/* ============================================================================
   iMindBridge.care — warm editorial design system
   Born from love; compassion over profit. Calm morning light, not cold clinic.
   ========================================================================== */

/* ---- Fonts (self-hosted; keeps CSP tight + no third-party tracking) ------- */
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ---- Tokens --------------------------------------------------------------- */
:root{
  --paper:#F6EFE3;          /* page canvas */
  --paper-2:#FDFAF3;        /* raised cards */
  --sand:#EBE2D1;           /* soft alt band */
  --sage:#DCE4D8;           /* green-tinted band */
  --ink:#241E19;            /* primary text */
  --ink-soft:#6A5F54;       /* muted text */
  --pine:#1E3A31;           /* primary brand green */
  --pine-2:#2F5A49;         /* lighter green */
  --clay:#D26A44;           /* accent / primary CTA */
  --clay-dk:#B9532F;        /* CTA hover */
  --apricot:#F0C79C;        /* warm highlight */
  --line:rgba(36,30,25,.14);
  --shadow-sm:0 1px 2px rgba(36,30,25,.06),0 2px 8px rgba(36,30,25,.05);
  --shadow-md:0 6px 20px rgba(36,30,25,.10),0 2px 6px rgba(36,30,25,.06);
  --shadow-lg:0 24px 60px rgba(30,58,49,.16),0 8px 20px rgba(36,30,25,.08);
  --r-sm:10px; --r-md:16px; --r-lg:26px; --r-pill:999px;
  --maxw:1160px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --sans:"Hanken",ui-sans-serif,system-ui,sans-serif;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  color-scheme:light;
}

/* ---- Reset / base --------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  font-size:clamp(16px,1.05vw,18px);line-height:1.62;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;overflow-x:hidden;
}
/* paper grain overlay */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.04;letter-spacing:-.015em;margin:0}
h1 em,h2 em,h3 em{font-style:italic;font-weight:400;color:var(--clay)}
p{margin:0}
::selection{background:var(--apricot);color:var(--ink)}
:focus-visible{outline:3px solid var(--clay);outline-offset:3px;border-radius:4px}

.skip{position:absolute;left:-9999px;top:0;background:var(--pine);color:#fff;padding:.7rem 1.1rem;border-radius:0 0 var(--r-sm) 0;z-index:200}
.skip:focus{left:0}

/* ---- Layout helpers ------------------------------------------------------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(1.1rem,4vw,2.5rem);position:relative;z-index:1}
.section{padding-block:clamp(3.5rem,8vw,7rem);position:relative;z-index:1}
.section--sand{background:var(--sand)}
.section--pine{background:var(--pine);color:#F4EEE2}
.section--sage{background:var(--sage)}
.tick{width:1.15em;height:1.15em;flex:none;display:inline-block;vertical-align:-.15em}
.eyebrow{font-family:var(--sans);font-weight:600;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--clay);display:inline-flex;align-items:center;gap:.5rem}
.section--pine .eyebrow{color:var(--apricot)}
.lead{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--ink-soft);max-width:60ch}
.section--pine .lead{color:#D9CFBE}
h2.title{font-size:clamp(2rem,4.4vw,3.4rem);margin-top:.6rem;max-width:18ch}

/* ---- Buttons -------------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;gap:.55rem;border:none;border-radius:var(--r-pill);
  padding:.9rem 1.5rem;font-weight:600;font-size:.98rem;letter-spacing:.005em;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s;will-change:transform}
.btn svg{width:1.05em;height:1.05em}
.btn--primary{background:var(--clay);color:#fff;box-shadow:var(--shadow-md)}
.btn--primary:hover{background:var(--clay-dk);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn--ink{background:var(--pine);color:#F4EEE2}
.btn--ink:hover{background:#17302889;background:#162b24;transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--pine);transform:translateY(-2px)}
.section--pine .btn--ghost{color:#F4EEE2;box-shadow:inset 0 0 0 1.5px rgba(244,238,226,.4)}
.btn--lg{padding:1.05rem 1.8rem;font-size:1.05rem}
.btn[disabled]{opacity:.5;cursor:not-allowed;pointer-events:none}
.btn[disabled]::after{content:" · soon";font-weight:500;opacity:.8}

/* ---- Top bar + persona switcher ------------------------------------------ */
.crisis{background:var(--pine);color:#EAD9C7;font-size:.8rem;text-align:center;padding:.5rem 1rem;position:relative;z-index:60}
.crisis strong{color:#fff}
.crisis a{text-decoration:underline;text-underline-offset:2px}
.topbar{position:sticky;top:0;z-index:50;background:rgba(246,239,227,.82);backdrop-filter:blur(12px) saturate(1.3);border-bottom:1px solid var(--line)}
.topbar__in{display:flex;align-items:center;gap:1.2rem;height:66px}
.brand{font-family:var(--serif);font-weight:600;font-size:1.3rem;letter-spacing:-.02em;display:flex;align-items:center;gap:.5rem;white-space:nowrap}
.brand .dot{width:11px;height:11px;border-radius:50%;background:var(--clay);box-shadow:0 0 0 4px rgba(210,106,68,.2)}
.switch{margin-left:auto;display:flex;gap:.25rem;background:rgba(36,30,25,.05);padding:.28rem;border-radius:var(--r-pill);border:1px solid var(--line)}
.switch a{padding:.42rem .9rem;border-radius:var(--r-pill);font-size:.86rem;font-weight:600;color:var(--ink-soft);transition:color .2s,background .2s,box-shadow .2s;white-space:nowrap}
.switch a:hover{color:var(--ink)}
.switch a.is-active{background:var(--paper-2);color:var(--pine);box-shadow:var(--shadow-sm)}
.topbar .btn--primary{padding:.6rem 1.15rem;font-size:.9rem}
.topbar-cta{display:none}
@media(min-width:1020px){.topbar-cta{display:inline-flex}}
@media(max-width:720px){.switch a{padding:.42rem .62rem;font-size:.8rem}.brand{font-size:1.1rem}}

/* ---- Hero ----------------------------------------------------------------- */
.hero{position:relative;padding-block:clamp(3rem,7vw,5.5rem) clamp(3.5rem,8vw,6rem);overflow:hidden}
.hero__glow{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero__glow::before,.hero__glow::after{content:"";position:absolute;border-radius:50%;filter:blur(70px);opacity:.55}
.hero__glow::before{width:46vw;height:46vw;background:radial-gradient(circle,#F0C79C,transparent 68%);top:-16vw;right:-8vw}
.hero__glow::after{width:40vw;height:40vw;background:radial-gradient(circle,#BcD3c0,transparent 66%);background:radial-gradient(circle,#B9D0BD,transparent 66%);bottom:-18vw;left:-10vw}
.hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,4rem);align-items:center}
@media(max-width:900px){.hero__grid{grid-template-columns:1fr;gap:2.4rem}}
.hero h1{font-size:clamp(2.6rem,6.4vw,5rem);letter-spacing:-.03em}
.hero__sub{margin-top:1.4rem;font-size:clamp(1.08rem,1.7vw,1.4rem);color:var(--ink-soft);max-width:34ch}
.hero__cta{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.8rem}
.hero__meta{margin-top:2.2rem;display:flex;flex-wrap:wrap;gap:1.5rem;color:var(--ink-soft);font-size:.92rem}
.hero__meta b{color:var(--ink);font-weight:600}
.hero__meta span{display:flex;align-items:center;gap:.5rem}
.hero__meta .tick{color:var(--pine-2)}

/* hero phone card */
.phonecard{position:relative;background:linear-gradient(165deg,var(--pine),#162b24);color:#F4EEE2;border-radius:var(--r-lg);padding:clamp(1.6rem,3vw,2.3rem);box-shadow:var(--shadow-lg);overflow:hidden}
.phonecard::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(240,199,156,.3),transparent 70%);top:-70px;right:-60px}
.phonecard .kicker{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--apricot);font-weight:600}
.phonecard .num{font-family:var(--serif);font-size:clamp(1.9rem,3.2vw,2.5rem);margin-top:.5rem;letter-spacing:-.01em}
.phonecard ul{list-style:none;margin:1.3rem 0 0;padding:0;display:grid;gap:.75rem}
.phonecard li{display:flex;gap:.7rem;align-items:flex-start;font-size:.95rem;color:#DACFBE}
.phonecard li .tick{color:var(--apricot);flex:none;margin-top:.15rem}
.phonecard .fine{margin-top:1.3rem;font-size:.78rem;color:#A89C8B;line-height:1.5}

/* ---- Audience router cards ------------------------------------------------ */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.6rem}
@media(max-width:860px){.cards{grid-template-columns:1fr}}
.pcard{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;display:flex;flex-direction:column;gap:.8rem;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;position:relative}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:rgba(30,58,49,.35)}
.pcard h3{font-size:1.5rem}
.pcard p{color:var(--ink-soft);font-size:.96rem;flex:1}
.pcard .btn{align-self:flex-start;margin-top:.4rem}
.pcard__tag{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--clay)}
body[data-persona="employers"] .pcard[data-p="employers"],
body[data-persona="employees"] .pcard[data-p="employees"],
body[data-persona="brokers"]   .pcard[data-p="brokers"]{border-color:var(--clay);box-shadow:0 0 0 2px rgba(210,106,68,.25),var(--shadow-md)}

/* persona "for you" badge on relevant sections */
.foryou{display:none;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);background:rgba(210,106,68,.1);padding:.25rem .7rem;border-radius:var(--r-pill);margin-bottom:.9rem;width:fit-content}
body[data-persona="employers"] .section[data-for~="employers"] .foryou,
body[data-persona="employees"] .section[data-for~="employees"] .foryou,
body[data-persona="brokers"]   .section[data-for~="brokers"]   .foryou{display:inline-flex}

/* ---- Generic feature grids ------------------------------------------------ */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.4rem}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;margin-top:2.4rem}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:2.4rem}
@media(max-width:860px){.grid3,.grid4{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.grid2,.grid3,.grid4{grid-template-columns:1fr}}
.tile{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);padding:1.5rem;box-shadow:var(--shadow-sm);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.section--pine .tile{background:rgba(255,255,255,.055);border-color:rgba(244,238,226,.14);box-shadow:none}
.tile h3{font-size:1.18rem;margin-bottom:.35rem}
.tile .num{font-family:var(--serif);font-size:1.6rem;color:var(--clay);display:block;margin-bottom:.4rem}
.section--pine .tile .num{color:var(--apricot)}
.tile p{color:var(--ink-soft);font-size:.93rem}
.section--pine .tile p{color:#CFC4B3}

/* ---- "Life's a lot" worry grid (editorial) -------------------------------- */
.worries{columns:3;column-gap:1.2rem;margin-top:2.4rem}
@media(max-width:860px){.worries{columns:2}}
@media(max-width:560px){.worries{columns:1}}
.worry{break-inside:avoid;margin-bottom:1.2rem;background:var(--paper-2);border:1px solid var(--line);border-left:3px solid var(--clay);border-radius:var(--r-md);padding:1.3rem}
.worry h3{font-size:1.15rem;margin-bottom:.3rem}
.worry p{color:var(--ink-soft);font-size:.92rem}

/* ---- Steps ---------------------------------------------------------------- */
.steps{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:2.4rem}
@media(max-width:620px){.steps{grid-template-columns:1fr}}
.step{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;position:relative;overflow:hidden}
.step .n{font-family:var(--serif);font-size:3.4rem;color:var(--apricot);line-height:1;position:absolute;top:1rem;right:1.4rem;opacity:.9}
.step h3{font-size:1.35rem;margin-bottom:.4rem}
.step p{color:var(--ink-soft)}

/* ---- Comparison table ----------------------------------------------------- */
.compare{margin-top:2.4rem;overflow-x:auto;border-radius:var(--r-md);border:1px solid var(--line);background:var(--paper-2);box-shadow:var(--shadow-sm)}
table.cmp{width:100%;border-collapse:collapse;min-width:560px}
.cmp th,.cmp td{text-align:left;padding:.9rem 1.1rem;border-bottom:1px solid var(--line);font-size:.92rem}
.cmp thead th{font-family:var(--serif);font-size:1.05rem;background:var(--sage)}
.cmp thead th:nth-child(2){color:var(--pine)}
.cmp tbody tr:last-child td{border-bottom:none}
.cmp td:not(:first-child){text-align:center;width:22%}
.yes{color:var(--pine-2);font-weight:700}
.no,.vary{color:var(--ink-soft)}

/* ---- Pricing -------------------------------------------------------------- */
.price{display:grid;grid-template-columns:.9fr 1.1fr;gap:1.2rem;margin-top:2.4rem;align-items:stretch}
@media(max-width:820px){.price{grid-template-columns:1fr}}
.price__big{background:linear-gradient(165deg,var(--clay),#B9532F);color:#fff;border-radius:var(--r-lg);padding:2rem;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;justify-content:center}
.price__big .from{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;opacity:.85;font-weight:600}
.price__big .amt{font-family:var(--serif);font-size:clamp(3.4rem,7vw,5rem);line-height:.95;margin:.2rem 0}
.price__big .per{font-size:1rem;opacity:.9}
.price__big p{margin-top:1rem;font-size:.95rem;opacity:.95}
.price__big .btn{margin-top:1.6rem;align-self:flex-start;background:#fff;color:var(--clay-dk)}
.price__big .btn:hover{background:#FDF1E8}
.price__list{display:grid;gap:1rem}

/* ---- Testimonials --------------------------------------------------------- */
.quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;margin-top:2.4rem}
@media(max-width:720px){.quotes{grid-template-columns:1fr}}
.quote{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;position:relative;box-shadow:var(--shadow-sm)}
.quote::before{content:"\201C";font-family:var(--serif);font-size:4.5rem;color:var(--apricot);line-height:.5;position:absolute;top:1.6rem;left:1.2rem;opacity:.7}
.quote p{font-family:var(--serif);font-size:1.18rem;line-height:1.4;padding-top:1.3rem;padding-left:.2rem}
.quote cite{display:block;margin-top:1rem;font-style:normal;font-size:.86rem;color:var(--ink-soft)}
.quote cite b{color:var(--ink);font-weight:600}

/* ---- Founder -------------------------------------------------------------- */
.founder{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
@media(max-width:820px){.founder{grid-template-columns:1fr}}
.founder blockquote{margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.4vw,1.8rem);line-height:1.35;color:#F4EEE2}
.founder blockquote + blockquote{margin-top:1.3rem;font-size:1.1rem;color:#D9CFBE}

/* ---- Stat band ------------------------------------------------------------ */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:1rem}
@media(max-width:640px){.stats{grid-template-columns:1fr}}
.stat{text-align:center}
.stat .big{font-family:var(--serif);font-size:clamp(2.6rem,6vw,4rem);color:var(--apricot);line-height:1}
.stat .lbl{color:#D9CFBE;margin-top:.4rem;letter-spacing:.03em}

/* ---- Final CTA ------------------------------------------------------------ */
.finale{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.6rem}
@media(max-width:820px){.finale{grid-template-columns:1fr}}
.finale .pcard h3{font-size:1.25rem}

/* ---- Footer --------------------------------------------------------------- */
.foot{background:#1a3029;color:#C9BEAD;position:relative;z-index:1}
.foot__in{display:grid;grid-template-columns:1.6fr 1fr;gap:2rem;padding-block:clamp(2.6rem,5vw,4rem)}
@media(max-width:720px){.foot__in{grid-template-columns:1fr}}
.foot h4{font-family:var(--serif);color:#F4EEE2;font-size:1.4rem;margin-bottom:.7rem}
.foot p{font-size:.9rem;max-width:52ch}
.foot .contact{display:grid;gap:.5rem;font-size:.92rem}
.foot .contact a:hover{color:#fff}
.foot__bar{border-top:1px solid rgba(244,238,226,.14);padding-block:1.1rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-size:.82rem;color:#9c917f}
.foot__bar nav{display:flex;gap:1.3rem}
.foot__bar a:hover{color:#fff}
.foot .crisis-note{color:#E0B9A4;font-size:.82rem;margin-top:1rem}

/* ---- Dialogs (embeds live here; PHI stays in the iframe) ------------------ */
dialog{border:none;border-radius:var(--r-lg);padding:0;max-width:640px;width:calc(100% - 2rem);box-shadow:var(--shadow-lg);background:var(--paper-2);color:var(--ink)}
dialog::backdrop{background:rgba(26,32,25,.55);backdrop-filter:blur(3px)}
.dlg__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem 1.4rem;border-bottom:1px solid var(--line)}
.dlg__head h3{font-size:1.25rem}
.dlg__close{background:rgba(36,30,25,.06);border:none;border-radius:50%;width:36px;height:36px;font-size:1.3rem;line-height:1;color:var(--ink);display:grid;place-items:center}
.dlg__close:hover{background:rgba(36,30,25,.12)}
.dlg__body{padding:0}
.dlg__body iframe,.dlg__body .calendly-inline-widget{width:100%;min-height:68vh;border:0;display:block}
.dlg__note{padding:1.2rem 1.4rem;color:var(--ink-soft);font-size:.92rem}

/* ---- Entrance motion ------------------------------------------------------ */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(18px);animation:rise .8s var(--ease) forwards}
  @keyframes rise{to{opacity:1;transform:none}}
  .hero .reveal:nth-child(1){animation-delay:.05s}
  .hero__sub{animation-delay:.16s}
  .hero__cta{animation-delay:.28s}
  .hero__meta{animation-delay:.4s}
}