/* referstyle.css — full-bleed, page-local styles for refer.aspx */

/* Reset page edge so hero/footer backgrounds touch viewport edges */
html, body { margin: 0; padding: 0; }

.refer-root, .refer-root *,
.refer-footer, .refer-footer *{
  box-sizing: border-box;
  font-family: "Montserrat", Arial, sans-serif;
}



/* ---------- HERO (full-bleed) ---------- */
.refer-root .hero{
  background:#26533d;     /* hero green */
  color:#f3e8c9;          /* warm cream text */
  min-height:45vh;
  padding-block:clamp(24px,5vh,56px);
  display:flex;
  align-items:flex-start;
  width:100%;
}

.refer-root .rf-container,
.refer-footer .rf-container{
  width:100%;
  max-width:1160px;
  margin-inline:auto;
  padding-inline:clamp(14px,3vw,28px);
}

.refer-root .brandline{
  text-align:right;
  color:#e9dfc3;
  font-weight:700;
  letter-spacing:.2px;
  font-size:clamp(12px,1.4vw,14px);
}

.refer-root .headline{
  margin:10px 0 8px 0;
  font-weight:800;
  line-height:1.05;
  font-size:clamp(34px,6.2vw,58px);
  color:#f3e8c9;
}
.refer-root .headline .subline{ display:block; font-weight:800; }

.refer-root .lead{
  margin:8px 0 18px 0;
  color:#e9dfc3;
  font-size:clamp(15px,2vw,18px);
  max-width:72ch;
}

.refer-root .hero-grid{
  display:grid;
  gap:clamp(14px,2vw,24px);
  grid-template-columns:1fr;
}
@media (min-width:980px){
  .refer-root .hero-grid{ grid-template-columns:1.35fr .9fr; }
}

.refer-root .list, .refer-root .list-ol{
  margin:0 0 12px 18px;
  color:#e9dfc3;
}
.refer-root .list li, .refer-root .list-ol li{ margin:6px 0; }

.refer-root .reward{
  background:#fff;
  color:#0f172a;
  border-radius:8px;
  padding:16px 18px;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
  align-self:start;
}
.refer-root .reward-title{
  margin:0 0 6px;
  font-weight:800;
  font-size:20px;
  color:#163b31;
}
.refer-root .reward-points{ margin:8px 0 0 18px; }
.refer-root .reward-points li{ margin:6px 0; }

/* ---------- FORM SECTION (full width content area) ---------- */
.refer-root .form-section{
  background:#90b880;     /* requested form background */
  padding-block:clamp(20px,4.5vh,34px);
  border-top:1px solid rgba(0,0,0,.06);
  width:100%;
}

.refer-root .ref-form{ width:100%; max-width:920px; }

.refer-root .grid-2{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
@media (min-width:720px){
  .refer-root .grid-2{ grid-template-columns:1fr 1fr; }
}

.refer-root .label{
  display:block;
  font-weight:600;
  font-size:15px;
  color:#0d1321;
  margin:16px 0 6px;
}
.refer-root .input{
  width:100%;
  padding:12px;
  font-size:16px;
  border:1px solid #d9dde4;
  border-radius:3px;
  background:#fff;
  color:#0d1321;
}

.refer-root .checkbox{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin:14px 0 10px;
  font-size:14px;
  color:#0d1321;
}
.refer-root .checkbox input{ transform:translateY(2px); }

.refer-root .btn{
  display:inline-block;
  border:0;
  cursor:pointer;
  background:#e7c06a;
  color:#123c31;
  border-radius:3px;
  padding:14px 18px;
  font-weight:800;
  letter-spacing:.2px;
  font-size:17px;
}

.caps { text-transform: uppercase; }

.error {
  color: red;
  margin-top: 5px;
  display: none; /* start hidden */
}

#error_consent {
  margin-bottom: 20px; /* Only applies spacing to consent error */
}

/* success / notice message */
#formMsg.notice,
.refer-root .notice {
  border: 1px solid #123c31;   /* green border */
  background: #dff3e6;         /* green background */
  color: #123c31;               /* green text */
  margin-top: 10px;              /* 5px spacing above */
  padding: 10px 12px;           /* comfortable padding */
  border-radius: 3px;           /* match form rounding */
  display: block;               /* ensure it sits on its own line */
}

/* ---------- EMBEDDED FOOTER (full-bleed) ---------- */
.refer-footer{
  background:#41424E;
  color:#90909C;
  padding:36px 0 18px;
  border-top:1px solid #e5e7eb;
  width:100%;
  font-size:13px; /* base footer text size */
}

.refer-footer .rf-row{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
}

/* center ONLY the copyright row */
.refer-footer .rf-row.rf-copy{
  justify-content:center;  /* centers the child column */
  text-align:center;       /* centers text inside */
}
.refer-footer .rf-row.rf-copy .rf-col{
  flex:0 0 auto;           /* don't stretch full width */
}

.refer-footer .rf-cols-3 > .rf-col{
  flex:0 0 calc(33.333% - 16px);
  max-width:calc(33.333% - 16px);
}
@media (max-width:960px){
  .refer-footer .rf-cols-3 > .rf-col{
    flex:0 0 100%;
    max-width:100%;
  }
}

.refer-footer .rf-cols-2 > .rf-col{
  flex:0 0 calc(50% - 12px);
  max-width:calc(50% - 12px);
}
@media (max-width:640px){
  .refer-footer .rf-cols-2 > .rf-col{
    flex:0 0 100%;
    max-width:100%;
  }
}

.refer-footer .footer-logo{ display:block; }
.refer-footer .rf-space{ border:0; border-top:1px solid #41424E; height:0; margin:14px 0; }

.refer-footer .footer-heading{
  margin:0 0 8px;
  font-size:16px; /* headings override base */
}

.refer-footer .copy-text{
  font-size:12px; /* copyright text size */
}

.refer-footer ul{
  list-style-type:square; /* square bullets */
}

/* Footer links: same color/size as text, no underline, no hover color change */
.refer-footer a{
  color:inherit;
  font-size:inherit;
  text-decoration:none;
}
.refer-footer a:hover,
.refer-footer a:focus{
  color:inherit;
  text-decoration:none;
}
