/* Shared conversion pages — Reid Studio */
:root { --cream:#faf7f2; --sand:#f1e8d7; --sage-deep:#6b8268; --ocean:#5c8a8a; --ocean-deep:#406a6a; --ocean-tint:#e1ecec; --charcoal:#20201d; --ink-soft:#3a3833; --ink-mute:#54514b; --stone:#716c66; --hairline:rgba(32,32,29,.14); --hairline-2:rgba(32,32,29,.08); --serif:"Fraunces",Georgia,serif; --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --maxw:1120px; --gutter:clamp(20px,4vw,44px); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--charcoal); background:var(--cream); font:16px/1.6 var(--sans); -webkit-font-smoothing:antialiased; } body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.28; background-image:radial-gradient(rgba(32,32,29,.15) .55px,transparent .55px); background-size:5px 5px; mix-blend-mode:multiply; } a { color:inherit; text-decoration:none; } :focus-visible { outline:2px solid var(--ocean); outline-offset:3px; }
.shell { width:min(var(--maxw),100%); margin:0 auto; padding:0 var(--gutter); position:relative; z-index:1; } .nav { padding:22px 0; border-bottom:1px solid var(--hairline-2); background:rgba(250,247,242,.88); backdrop-filter:blur(12px); } .nav-row { display:flex; align-items:center; justify-content:space-between; gap:20px; } .brand { font:500 23px var(--serif); letter-spacing:-.025em; } .brand em { color:var(--ocean-deep); font-weight:400; } .nav-note { color:var(--stone); font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.hero { padding:clamp(60px,9vw,112px) 0 64px; text-align:center; } .eyebrow { margin:0 0 18px; color:var(--stone); font-size:11px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; } .eyebrow::before { content:""; width:7px; height:7px; display:inline-block; margin:0 10px 1px 0; border-radius:99px; background:var(--ocean); } h1,h2,h3 { margin:0; font-family:var(--serif); font-weight:400; letter-spacing:-.035em; line-height:1.06; text-wrap:balance; } h1 { max-width:13ch; margin:auto; font-size:clamp(42px,6.5vw,76px); } h1 em,h2 em { color:var(--ocean-deep); font-weight:380; } h2 { font-size:clamp(31px,4vw,48px); } h3 { font-size:25px; } .lede { max-width:62ch; margin:26px auto 0; color:var(--ink-mute); font-size:clamp(17px,1.8vw,20px); } .proof { display:flex; justify-content:center; flex-wrap:wrap; gap:10px 24px; max-width:760px; padding-top:22px; margin:34px auto 0; border-top:1px solid var(--hairline); color:var(--ink-soft); font-size:14px; } .proof span { display:inline-flex; align-items:center; gap:8px; } .proof span::before { content:"✓"; color:var(--sage-deep); font-weight:800; }
.section { padding:clamp(56px,8vw,96px) 0; } .section-sand { background:var(--sand); border-top:1px solid var(--hairline-2); border-bottom:1px solid var(--hairline-2); } .section-head { max-width:650px; margin-bottom:38px; } .section-head p:not(.eyebrow) { color:var(--ink-mute); margin:18px 0 0; } .offer-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:26px; align-items:start; } .card { background:#fff; border:1px solid var(--hairline); border-radius:16px; box-shadow:0 18px 48px rgba(32,32,29,.06); } .included { padding:clamp(28px,4vw,44px); }
.feature-list { list-style:none; padding:0; margin:28px 0 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 26px; } .feature-list li { position:relative; padding-left:28px; color:var(--ink-soft); font-size:15px; } .feature-list li::before { content:""; position:absolute; top:7px; left:2px; width:13px; height:7px; border-left:2px solid var(--sage-deep); border-bottom:2px solid var(--sage-deep); transform:rotate(-45deg); } .feature-list strong { display:block; color:var(--charcoal); font-size:16px; }
.price-card { padding:38px 34px 34px; border-top:3px solid var(--ocean); position:sticky; top:20px; } .price-kicker { color:var(--ocean-deep); font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; margin:0 0 12px; } .price { display:flex; align-items:baseline; gap:8px; margin:14px 0 6px; } .price strong { font:400 64px/.9 var(--serif); letter-spacing:-.06em; } .price span { color:var(--stone); font-size:14px; } .price-note { color:var(--ink-mute); font-size:14px; margin:18px 0 24px; } .button { display:inline-flex; align-items:center; justify-content:center; width:100%; padding:17px 20px; border:0; border-radius:8px; background:var(--ocean); color:#fff; font:700 16px/1 var(--sans); cursor:pointer; transition:transform .18s ease,background .18s ease; } .button:hover { background:var(--ocean-deep); transform:translateY(-1px); } .checkout-note { margin:16px 0 0; color:var(--stone); text-align:center; font-size:12px; } .checkout-note::before { content:"↗"; margin-right:6px; } .scope { margin-top:26px; padding:18px; border-radius:10px; background:var(--ocean-tint); color:var(--ink-soft); font-size:13px; } .scope strong { color:var(--charcoal); }
.process { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; counter-reset:steps; } .step { padding:28px; border:1px solid var(--hairline); border-radius:14px; background:var(--cream); } .step::before { counter-increment:steps; content:"0" counter(steps); color:var(--ocean-deep); font:italic 25px/1 var(--serif); } .step h3 { margin:18px 0 10px; font-size:24px; } .step p { margin:0; color:var(--ink-mute); font-size:15px; } .faq { max-width:760px; } details { border-top:1px solid var(--hairline); padding:20px 0; } details:last-child { border-bottom:1px solid var(--hairline); } summary { cursor:pointer; font:20px var(--serif); letter-spacing:-.02em; } details p { color:var(--ink-mute); margin:14px 0 0; } .footer { padding:38px 0; background:var(--charcoal); color:#c9c4bb; text-align:center; font-size:13px; } .footer a { color:#fff; border-bottom:1px solid rgba(255,255,255,.32); }
.thankyou-hero { padding-bottom:44px; } .thankyou-hero h1 { max-width:15ch; } .intake-wrap { max-width:820px; margin:0 auto; padding:0 var(--gutter) 90px; position:relative; z-index:1; } .intake-intro { margin:0 0 24px; color:var(--ink-mute); text-align:center; } .form-card { padding:clamp(26px,5vw,48px); } fieldset { margin:0; padding:28px 0; border:0; border-top:1px solid var(--hairline-2); } fieldset:first-of-type { padding-top:0; border-top:0; } legend { padding:0; font:400 27px/1.2 var(--serif); letter-spacing:-.025em; } .field-help { margin:8px 0 20px; color:var(--stone); font-size:13px; } .fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } .field-full { grid-column:1/-1; } label { display:block; color:var(--ink-soft); font-size:13px; font-weight:700; } input,select,textarea { display:block; width:100%; margin:7px 0 0; padding:13px 14px; border:1px solid var(--hairline); border-radius:7px; background:#fff; color:var(--charcoal); font:400 16px/1.4 var(--sans); } textarea { min-height:130px; resize:vertical; } input:focus,select:focus,textarea:focus { outline:2px solid rgba(92,138,138,.42); border-color:var(--ocean); } .choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .choice { display:flex; align-items:flex-start; gap:9px; padding:13px; border:1px solid var(--hairline-2); border-radius:8px; font-size:14px; font-weight:500; cursor:pointer; } .choice input { width:auto; margin:4px 0 0; accent-color:var(--ocean); } .privacy { margin:18px 0 0; color:var(--stone); font-size:12px; } .honeypot { position:absolute; left:-9999px; } .complete { max-width:650px; min-height:68vh; margin:0 auto; padding:clamp(90px,14vw,160px) var(--gutter); text-align:center; position:relative; z-index:1; } .complete-mark { display:inline-grid; place-items:center; width:60px; height:60px; margin-bottom:24px; border-radius:50%; background:var(--ocean-tint); color:var(--ocean-deep); font-size:28px; }
@media (max-width:760px) { .nav-note { display:none; } .offer-grid,.process,.feature-list,.fields,.choice-grid { grid-template-columns:1fr; } .price-card { position:static; } }