/* Social Attraction Media — site styles */
:root{
  --orange:#F2541B;
  --orange-ink:#D8440F;
  --ink:#141210;
  --blush:#E7D3C7;
  --blush-deep:#E0C3B4;
  --grey:#DAD9D4;
  --paper:#F6F4F1;
  --white:#ffffff;
  --rule:rgba(20,18,16,.14);
  --maxw:1240px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Figtree",system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:1.06rem;line-height:1.6;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,5vw,56px);}

/* display type */
h1,h2,h3,.disp{font-family:"Anton",Impact,sans-serif;font-weight:400;
  text-transform:uppercase;letter-spacing:.005em;line-height:.98;}
.o{color:var(--orange);}      /* orange word */
.mut{color:rgba(20,18,16,.45);} /* muted word */
.on-dark .mut, .on-orange .mut{color:rgba(255,255,255,.55);}

/* buttons */
.btn{display:inline-block;font-family:"Anton",sans-serif;text-transform:uppercase;
  letter-spacing:.03em;font-size:.95rem;text-decoration:none;padding:15px 26px;
  background:var(--ink);color:#fff;border:2px solid var(--ink);transition:.18s;}
.btn:hover{background:transparent;color:var(--ink);}
.on-orange .btn{background:var(--ink);border-color:var(--ink);color:#fff;}
.on-orange .btn:hover{background:#fff;border-color:#fff;color:var(--ink);}
.btn.ghost{background:transparent;color:var(--ink);}
.btn.ghost:hover{background:var(--ink);color:#fff;}
.btn.orange{background:var(--orange);border-color:var(--orange);color:#fff;}
.btn.orange:hover{background:transparent;color:var(--orange);}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:var(--blush);
  border-bottom:1px solid var(--rule);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;height:84px;}
.brand{display:flex;align-items:center;gap:0;text-decoration:none;}
.brand .tile{background:#111;border-radius:12px;padding:8px;display:grid;place-items:center;}
.brand .tile img{height:56px;width:auto;}
.navlinks{display:flex;align-items:center;gap:clamp(14px,2.4vw,30px);}
.navlinks a{font-family:"Figtree";font-weight:600;font-size:.98rem;text-decoration:none;color:var(--ink);opacity:.8;}
.navlinks a:hover,.navlinks a.active{opacity:1;color:var(--orange);}
.navlinks .call{font-family:"Anton";text-transform:uppercase;letter-spacing:.03em;
  background:#111;color:#fff;padding:12px 18px;font-size:.82rem;opacity:1;border-radius:2px;}
.navlinks .call:hover{background:var(--orange);color:#fff;}
.navtoggle{display:none;}

/* generic section */
section{position:relative;}
.pad{padding:clamp(64px,10vh,120px) 0;}
.sec-blush{background:var(--blush);}
.sec-grey{background:var(--grey);}
.sec-orange{background:var(--orange);color:#fff;}
.sec-ink{background:var(--ink);color:#f4efe9;}
.on-orange,.on-dark{color:#fff;}

/* curved motif */
.curve{position:absolute;border-radius:50%;pointer-events:none;z-index:0;}
.curve.peach{background:var(--blush-deep);opacity:.75;}

/* hero */
.hero{background:var(--blush);overflow:hidden;position:relative;}
.hero .curve{width:62vw;max-width:780px;aspect-ratio:1;left:-20vw;top:8vh;}
.hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(24px,4vw,60px);align-items:center;padding-top:clamp(40px,6vh,70px);
  padding-bottom:clamp(50px,8vh,96px);}
.hero h1{font-size:clamp(2.6rem,6vw,5rem);color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,.04);margin:0 0 20px;}
.hero .sub{font-size:clamp(2rem,4.6vw,3.6rem);margin:0 0 20px;}
.hero .tag{font-family:"Anton";text-transform:uppercase;font-size:clamp(1.1rem,2.3vw,1.6rem);
  letter-spacing:.01em;margin:0 0 20px;}
.hero p.lede{max-width:40ch;font-size:1.12rem;margin:0 0 28px;color:#2b2621;}
.hero .shot{position:relative;}
.hero .shot img{width:100%;height:clamp(360px,56vh,620px);object-fit:cover;border-radius:4px;
  box-shadow:0 24px 50px -28px rgba(20,18,16,.5);}

/* split rows (image + text) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,74px);align-items:center;}
.split.flip .col-img{order:2;}
.split img{width:100%;object-fit:cover;border-radius:4px;max-height:76vh;}
.split .kicker,.block .kicker{display:block;font-family:"Figtree";font-weight:700;
  color:var(--orange);font-size:.95rem;margin:0 0 8px;}
.split h2,.block h2{font-size:clamp(1.9rem,3.6vw,2.9rem);margin:0 0 20px;}
.lead-list{list-style:none;margin:0;padding:0;}
.lead-list li{padding:12px 0;border-top:1px solid var(--rule);}
.lead-list li strong{font-family:"Anton";text-transform:uppercase;letter-spacing:.02em;
  font-weight:400;font-size:1.05rem;display:block;margin-bottom:2px;}

/* services */
.block h2{max-width:22ch;}
.services{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start;}
.svc{margin:0 0 26px;}
.svc h3{font-size:clamp(1.3rem,2.4vw,1.7rem);margin:0 0 6px;}
.svc p{margin:0;max-width:44ch;}
.on-orange .svc p{color:rgba(255,255,255,.92);}

/* FAQ */
.faq{max-width:860px;}
.faq details{border-top:1px solid var(--rule);padding:4px 0;}
.faq details[open]{padding-bottom:10px;}
.faq summary{list-style:none;cursor:pointer;padding:20px 0;font-family:"Anton";
  text-transform:uppercase;letter-spacing:.015em;font-size:clamp(1.05rem,2vw,1.35rem);
  display:flex;justify-content:space-between;gap:16px;align-items:center;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary .pm{color:var(--orange);font-size:1.5rem;line-height:1;}
.faq details[open] summary .pm{transform:rotate(45deg);}
.faq p{margin:0 0 6px;max-width:70ch;}

/* lead magnet band */
.magnet{background:var(--ink);color:#f4efe9;}
.magnet .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:center;}
.magnet h2{font-size:clamp(1.8rem,3.6vw,2.9rem);margin:0 0 16px;color:#fff;}
.magnet p{color:rgba(255,255,255,.8);max-width:46ch;margin:0 0 18px;}

/* forms */
form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
label{display:block;font-family:"Figtree";font-weight:600;font-size:.86rem;margin:14px 0 6px;}
input,textarea{width:100%;font:inherit;padding:13px 14px;border:1px solid rgba(20,18,16,.25);
  border-radius:3px;background:#fff;color:var(--ink);}
.on-orange input,.on-orange textarea{border-color:rgba(0,0,0,.25);}
input:focus,textarea:focus{outline:2px solid var(--orange);border-color:var(--orange);}
textarea{min-height:130px;resize:vertical;}
.inline-form{display:flex;gap:10px;flex-wrap:wrap;max-width:460px;}
.inline-form input{flex:1;min-width:200px;background:#fff;color:var(--ink);}

/* footer */
footer{background:var(--ink);color:#e9e2da;padding:clamp(48px,7vh,80px) 0 34px;}
footer .grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:34px;align-items:start;}
footer .logo-mark{height:70px;margin-bottom:14px;}
footer .awe{font-family:"Anton";text-transform:uppercase;font-size:1.2rem;letter-spacing:.01em;margin:0 0 6px;}
footer a{color:#e9e2da;text-decoration:none;opacity:.85;}
footer a:hover{opacity:1;color:var(--orange);}
footer h4{font-family:"Anton";text-transform:uppercase;letter-spacing:.03em;font-weight:400;
  font-size:.95rem;color:#fff;margin:0 0 12px;}
footer ul{list-style:none;margin:0;padding:0;}
footer li{margin:0 0 8px;font-size:.98rem;}
footer .mail{color:var(--orange);font-family:"Anton";text-transform:lowercase;font-size:1.05rem;}
footer .base{border-top:1px solid rgba(255,255,255,.14);margin-top:34px;padding-top:20px;
  font-size:.82rem;color:rgba(255,255,255,.55);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;}

/* page hero (inner pages) */
.phero{padding:clamp(60px,9vh,120px) 0 clamp(40px,6vh,70px);}
.phero h1{font-size:clamp(2.4rem,6vw,4.6rem);margin:0 0 14px;}
.phero p{max-width:58ch;font-size:1.12rem;margin:0;}

/* utility */
.center{text-align:center;}
.mt{margin-top:28px;}
.lead-note{font-size:.92rem;color:rgba(20,18,16,.6);}
.on-orange .lead-note{color:rgba(255,255,255,.7);}

/* responsive */
@media (max-width:860px){
  .hero .wrap,.split,.services,.magnet .wrap,footer .grid{grid-template-columns:1fr;}
  .split.flip .col-img{order:0;}
  .hero .shot img{height:auto;max-height:70vh;}
  form .row{grid-template-columns:1fr;}
  .navlinks{gap:14px;}
  .navlinks a:not(.call){display:none;}
}
