/* MY UNIQUE AI — shared styles. Warm, premium, human. No frameworks, no JS. */
:root{
  --ground:#F7F2EC;      /* warm ivory */
  --ground-2:#EFE6DC;    /* deeper ivory for bands */
  --ink:#2B1F24;         /* warm near-black, plum-leaning */
  --ink-2:#6B5A61;
  --line:#E2D6CB;
  --accent:#C8544B;      /* warm rose-red: UNIQUE, links, the one loud thing */
  --accent-soft:#F3D9D3;
  --card:#FFFCF8;
  --shadow:0 30px 60px -30px rgba(43,31,36,.35);
  --font-display:"Fraunces", Georgia, "Times New Roman", serif;
  --font-body:"Figtree", "Helvetica Neue", Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(60% 50% at 80% 10%, rgba(200,84,75,.10), transparent 60%),
             radial-gradient(50% 40% at 10% 90%, rgba(200,84,75,.07), transparent 60%);}
a{color:inherit}
.wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:0 24px}

/* header */
.top{display:flex;align-items:center;justify-content:space-between;padding:28px 0}
.wordmark{font-family:var(--font-display);font-size:1.15rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;font-weight:500}
.wordmark em{font-style:italic;font-weight:700;color:var(--accent);font-variation-settings:"opsz" 144,"SOFT" 60;letter-spacing:.02em;font-size:1.25em;vertical-align:-.04em}
.top .soon{font-size:.85rem;color:var(--ink-2);letter-spacing:.06em;text-transform:uppercase}

/* hero */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start;padding:40px 0 72px}
.hero>div{padding-top:clamp(8px,6vh,72px)}
.hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.6rem,6vw,4.9rem);line-height:1.02;letter-spacing:-.02em;margin:0 0 22px;text-wrap:balance;font-variation-settings:"opsz" 144,"SOFT" 40}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero p{font-size:1.15rem;color:var(--ink-2);max-width:32em;margin:0 0 30px}
.hero .cta{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--ground);text-decoration:none;padding:14px 22px;border-radius:999px;font-weight:600;letter-spacing:.01em;transition:transform .2s ease,background .2s ease}
.hero .cta:hover{transform:translateY(-1px);background:#3a2b31}
.hero .cta:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.hero figure{margin:0;position:relative}
.hero figure img{display:block;width:100%;max-height:78vh;border-radius:28px 28px 28px 120px;box-shadow:var(--shadow);object-fit:cover;aspect-ratio:4/5}
.hero figure figcaption{position:absolute;left:18px;bottom:18px;background:rgba(255,252,248,.92);backdrop-filter:blur(6px);padding:10px 14px;border-radius:14px;font-size:.9rem;color:var(--ink-2)}
.hero figure figcaption b{color:var(--ink);font-weight:600}

/* reveal on load, from a visible resting state */
@media (prefers-reduced-motion:no-preference){
  .rise{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
  .rise.d1{animation-delay:.08s}.rise.d2{animation-delay:.18s}.rise.d3{animation-delay:.3s}
  @keyframes rise{from{opacity:.001;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* featured */
.band{background:var(--ground-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.featured{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:center;padding:64px 0}
.featured img{display:block;width:100%;border-radius:20px;box-shadow:var(--shadow);aspect-ratio:3/4;object-fit:cover}
.eyebrow{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700;margin:0 0 12px}
.featured h2{font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.05;margin:0 0 8px;letter-spacing:-.015em}
.pill{display:inline-block;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-weight:700;margin:0 0 18px}
.featured p{color:var(--ink-2);max-width:34em;margin:0 0 22px;font-size:1.05rem}
.meta{display:flex;flex-wrap:wrap;gap:14px 28px;font-size:.95rem;color:var(--ink-2)}
.meta a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.meta a:hover{border-color:var(--accent)}

/* everly page */
.person{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;padding:40px 0 80px}
.person img{display:block;width:100%;border-radius:28px 120px 28px 28px;box-shadow:var(--shadow);aspect-ratio:4/5;object-fit:cover}
.person h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.4rem,5.5vw,4.2rem);line-height:1.02;margin:6px 0 10px;letter-spacing:-.02em}
.person .lede{font-size:1.15rem;color:var(--ink-2);max-width:32em}
.facts{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:10px;border-top:1px solid var(--line)}
.facts li{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.facts li span:first-child{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);padding-top:3px}
.note{font-size:.95rem;color:var(--ink-2);margin-top:22px}
.back{display:inline-block;text-decoration:none;color:var(--ink-2);margin:26px 0 0;font-size:.95rem}
.back:hover{color:var(--accent)}

/* footer */
footer{padding:36px 0 48px;color:var(--ink-2);font-size:.9rem;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
footer a{text-decoration:none;color:var(--ink-2)}
footer a:hover{color:var(--accent)}

@media (max-width:820px){
  .hero,.featured,.person{grid-template-columns:1fr;gap:32px}
  .hero{padding:24px 0 48px}
  .hero figure{order:-1}
  .hero figure img{aspect-ratio:4/4.6;border-radius:24px 24px 24px 80px}
  .featured{padding:48px 0}
  .facts li{grid-template-columns:1fr}
}

/* ===== v2 additions: the fuller marketing site. Same tokens, same faces. ===== */
.section{padding:72px 0}
.section h2{font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.05;letter-spacing:-.015em;margin:0 0 14px;text-wrap:balance}
.section h2 em{font-style:italic;color:var(--accent)}
.section .lead{color:var(--ink-2);font-size:1.1rem;max-width:36em;margin:0 0 36px}
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.reason{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px 26px 28px}
.reason h3{font-family:var(--font-display);font-weight:500;font-size:1.35rem;margin:0 0 10px;letter-spacing:-.01em}
.reason p{margin:0;color:var(--ink-2);font-size:1rem}
.reason .k{display:block;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:12px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:step}
.step{position:relative;padding:22px 24px 26px;border-top:2px solid var(--ink)}
.step::before{counter-increment:step;content:counter(step,decimal-leading-zero);font-family:var(--font-display);font-style:italic;color:var(--accent);font-size:2rem;display:block;margin-bottom:8px}
.step h3{margin:0 0 8px;font-size:1.15rem;font-weight:600}
.step p{margin:0;color:var(--ink-2)}
.week{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.week figure{margin:0;position:relative}
.week img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:18px;box-shadow:var(--shadow)}
.week figcaption{margin-top:10px;font-size:.92rem;color:var(--ink-2)}
.week figcaption b{color:var(--ink);font-weight:600}
.honest{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.honest ul{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.honest li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start;color:var(--ink-2)}
.honest li::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--accent);margin-top:9px;margin-left:6px}
.honest li b{color:var(--ink);font-weight:600}
.honest img{display:block;width:100%;border-radius:120px 28px 28px 28px;box-shadow:var(--shadow);aspect-ratio:4/5;object-fit:cover}
.faq{display:grid;gap:0;border-top:1px solid var(--line);max-width:760px}
.faq details{border-bottom:1px solid var(--line);padding:6px 0}
.faq summary{cursor:pointer;list-style:none;padding:16px 0;font-weight:600;font-size:1.05rem;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--accent);font-family:var(--font-display);font-size:1.4rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{margin:0 0 18px;color:var(--ink-2);max-width:60ch}
.closer{text-align:center;padding:80px 0 72px}
.closer h2{font-family:var(--font-display);font-weight:400;font-size:clamp(2.2rem,5vw,3.6rem);letter-spacing:-.02em;margin:0 0 14px}
.closer p{color:var(--ink-2);max-width:34em;margin:0 auto 28px;font-size:1.1rem}
.cta{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--ground);text-decoration:none;padding:14px 22px;border-radius:999px;font-weight:600;transition:transform .2s ease,background .2s ease}
.cta:hover{transform:translateY(-1px);background:#3a2b31}
.cta.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.cta.ghost:hover{border-color:var(--accent);background:transparent}
.ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
nav.menu{display:flex;gap:26px;font-size:.95rem}
nav.menu a{text-decoration:none;color:var(--ink-2)}
nav.menu a:hover{color:var(--accent)}
@media (max-width:820px){.reasons,.steps{grid-template-columns:1fr}.week{grid-template-columns:1fr 1fr}.honest{grid-template-columns:1fr}.honest img{order:-1;aspect-ratio:4/4.4;border-radius:80px 24px 24px 24px}nav.menu{display:none}}
