/* StickersFox — contact page (mobile-first, scoped under .sf-contact) */
/* Kill the global .site-main-content top padding so the green hero hugs the
   header with no cream/white seam (same approach already used on /deals). */
.site-main-content:has(.sf-contact){padding-top:0}
.sf-contact{
  --c-green:#1E3A2F;--c-panel:#15281E;--c-ink:#191917;--c-muted:#6E6E66;--c-soft:#8C8C82;
  --c-cream:#FBFAF7;--c-paper:#FFFFFF;--c-line:#ECE8DF;--c-field:#FCFBF8;
  --c-orange:#E8581A;--c-amber:#F0A23A;--c-gmuted:#9FB2A6;--c-gline:rgba(255,255,255,.12);
  --c-shadow:0 18px 48px -18px rgba(21,40,30,.30);
  background:var(--c-cream);color:var(--c-ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased;
}
.sf-contact *{box-sizing:border-box}
.sf-contact h1,.sf-contact h2{font-family:'Nunito','Inter',sans-serif;margin:0}

/* hero */
.sf-contact .sfc-hero{background:var(--c-green);color:#fff;padding:34px 22px 70px}
.sf-contact .sfc-hero-in{max-width:600px;margin:0 auto}
.sf-contact .sfc-eyebrow{font-size:11.5px;letter-spacing:3px;text-transform:uppercase;color:var(--c-amber);font-weight:700;margin-bottom:14px}
.sf-contact .sfc-title{font-weight:800;font-size:30px;line-height:1.13;letter-spacing:-.5px}
.sf-contact .sfc-lede{font-size:16px;color:#C7D3CB;margin:13px 0 0;line-height:1.62;max-width:46ch}
.sf-contact .sfc-trust{display:flex;align-items:center;gap:9px;margin-top:20px}
.sf-contact .sfc-stars{color:var(--c-amber);font-size:14px;letter-spacing:1.5px}
.sf-contact .sfc-trust-txt{font-size:13.5px;color:#C7D3CB}
.sf-contact .sfc-trust-txt strong{color:#fff;font-weight:700}
.sf-contact .sfc-chips{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.sf-contact .sfc-chip{display:inline-flex;align-items:center;font-size:12px;font-weight:500;color:#E2EAE4;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.17);border-radius:999px;padding:6px 12px;line-height:1.2}

/* form card (overlaps hero) */
.sf-contact .sfc-formhost{padding:0 16px}
.sf-contact .sfc-card{max-width:600px;margin:-46px auto 0;background:var(--c-paper);border:1px solid var(--c-line);border-radius:18px;box-shadow:var(--c-shadow);padding:26px 22px 28px;position:relative;z-index:2}
.sf-contact .sfc-h2{font-weight:700;font-size:22px;letter-spacing:-.2px}
.sf-contact .sfc-sub{color:var(--c-muted);font-size:14.5px;margin:7px 0 22px;line-height:1.55}

.sf-contact .sfc-form{display:flex;flex-direction:column;gap:15px}
.sf-contact .sfc-two{display:flex;flex-direction:column;gap:15px}
.sf-contact .sfc-field{display:flex;flex-direction:column}
.sf-contact .sfc-field label{font-size:13px;font-weight:600;color:#43433d;margin-bottom:7px}
.sf-contact .sfc-opt{color:var(--c-soft);font-weight:500}
.sf-contact .sfc-field input,
.sf-contact .sfc-field select,
.sf-contact .sfc-field textarea{
  width:100%;border:1px solid var(--c-line);border-radius:12px;padding:14px 15px;
  font-family:inherit;font-size:16px;color:var(--c-ink);background:var(--c-field);
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.sf-contact .sfc-field input::placeholder,
.sf-contact .sfc-field textarea::placeholder{color:#ADA99F}
.sf-contact .sfc-field input:focus,
.sf-contact .sfc-field select:focus,
.sf-contact .sfc-field textarea:focus{outline:none;border-color:var(--c-green);background:var(--c-paper);box-shadow:0 0 0 3px rgba(30,58,47,.10)}
.sf-contact .sfc-field select{
  appearance:none;-webkit-appearance:none;padding-right:42px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236E6E66' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right 15px center;
}
.sf-contact .sfc-field textarea{min-height:120px;resize:vertical}

/* upload — primary element, made obvious */
.sf-contact .sfc-file{display:flex;align-items:center;gap:13px;border:1.5px dashed #CFC8BA;border-radius:12px;padding:16px;background:var(--c-field);cursor:pointer;transition:border-color .15s,background .15s;min-height:66px}
.sf-contact .sfc-file:hover{border-color:var(--c-green);background:var(--c-paper)}
.sf-contact .sfc-file.has-file{border-style:solid;border-color:var(--c-green);background:#fff}
.sf-contact .sfc-file-ic{width:22px;height:22px;color:var(--c-green);flex-shrink:0}
.sf-contact .sfc-file-txt{flex:1;min-width:0}
.sf-contact .sfc-file-t{font-size:14.5px;font-weight:600;color:#33332e;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-contact .sfc-file-h{font-size:12px;color:var(--c-soft);margin-top:2px;display:block}
.sf-contact .sfc-file-btn{flex-shrink:0;border:1.5px solid var(--c-green);color:var(--c-green);border-radius:9px;padding:9px 14px;font-size:13px;font-weight:700;white-space:nowrap;transition:background .15s,color .15s}
.sf-contact .sfc-file:hover .sfc-file-btn{background:var(--c-green);color:#fff}
.sf-contact .sfc-file input{display:none}

.sf-contact .sfc-submit{margin-top:5px;min-height:54px;display:flex;align-items:center;justify-content:center;gap:9px;background:var(--c-green);color:#fff;border:none;border-radius:13px;padding:15px 22px;font-family:inherit;font-size:16px;font-weight:700;letter-spacing:.1px;cursor:pointer;transition:background .15s,transform .05s}
.sf-contact .sfc-submit:hover{background:#173026}
.sf-contact .sfc-submit:active{transform:translateY(1px)}
.sf-contact .sfc-submit svg{width:18px;height:18px}

.sf-contact .sfc-assure{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--c-muted);margin:3px 0 0;line-height:1.5}
.sf-contact .sfc-assure svg{width:15px;height:15px;color:#3f7a57;flex-shrink:0;margin-top:2px}

.sf-contact .sfc-err{display:block;color:#B5341B;font-size:12.5px;margin-top:6px}
.sf-contact .sfc-alert{background:#FBEEE9;border:1px solid #F3C9BB;color:#9A3415;border-radius:11px;padding:13px 15px;font-size:13.5px;margin-bottom:18px}

/* success state */
.sf-contact .sfc-success{text-align:center;padding:18px 6px 10px}
.sf-contact .sfc-success-ic{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:#E8F2EA;color:#2f7d4f;margin-bottom:14px}
.sf-contact .sfc-success-ic svg{width:26px;height:26px}
.sf-contact .sfc-success h2{font-weight:700;font-size:21px;margin-bottom:8px}
.sf-contact .sfc-success p{color:var(--c-muted);font-size:14.5px;max-width:44ch;margin:0 auto;line-height:1.6}

/* honeypot */
.sf-contact .sfc-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* faq link */
.sf-contact .sfc-faqlink{max-width:600px;margin:22px auto 0;padding:0 22px;font-size:14px;color:var(--c-muted);text-align:center;line-height:1.6}
.sf-contact .sfc-faqlink a{color:var(--c-green);font-weight:700;text-decoration:none;border-bottom:1px solid rgba(30,58,47,.3);padding-bottom:1px;white-space:nowrap}

/* essentials */
.sf-contact .sfc-essentials{max-width:600px;margin:28px auto 8px;padding:0 22px}
.sf-contact .sfc-ess-lbl{font-size:11.5px;letter-spacing:1.8px;text-transform:uppercase;color:var(--c-soft);font-weight:700;margin:0 0 4px}
.sf-contact .sfc-erow{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;border-bottom:1px solid var(--c-line)}
.sf-contact .sfc-erow:last-child{border-bottom:none}
.sf-contact .sfc-ek{font-size:14px;color:var(--c-muted)}
.sf-contact .sfc-ev{font-size:15.5px;font-weight:600;text-align:right}
.sf-contact .sfc-ev a{color:var(--c-orange);text-decoration:none;border-bottom:1px solid rgba(232,88,26,.4);padding-bottom:1px}

/* tablet / desktop */
@media(min-width:760px){
  .sf-contact .sfc-hero{padding:64px 32px 104px}
  .sf-contact .sfc-title{font-size:42px;letter-spacing:-1px;line-height:1.08}
  .sf-contact .sfc-lede{font-size:17.5px;margin-top:16px}
  .sf-contact .sfc-trust{margin-top:24px}
  .sf-contact .sfc-chips{margin-top:18px}
  .sf-contact .sfc-card{margin-top:-64px;padding:38px 40px 40px}
  .sf-contact .sfc-h2{font-size:25px}
  .sf-contact .sfc-sub{margin-bottom:26px}
  .sf-contact .sfc-form{gap:18px}
  .sf-contact .sfc-two{flex-direction:row}
  .sf-contact .sfc-two>*{flex:1}
  .sf-contact .sfc-faqlink{margin-top:30px}
  .sf-contact .sfc-essentials{margin-top:34px}
  .sf-contact .sfc-erow{padding:18px 0}
}
