/* Maria Ochoa studio. Navy and cream: premium, calm, readable. Real photos and real product screens carry the page; type does the rest. */
:root{
  --cream:#f5f0e6; --cream-2:#ece4d3; --paper:#fffdf8; --white:#ffffff;
  --navy:#0a1530; --navy-2:#14244a; --navy-3:#22335e;
  --text:#3a4159; --muted:#6a6f84; --line:#e2d9c6; --line-2:#d4c9b2;
  --gold:#cfae6e; --gold-ink:#8d6c30; --gold-soft:#f2e7cc;
  --green:#2f7a4f; --green-soft:#e3f1e8;
  --sans:"Plus Jakarta Sans","Helvetica Neue",Arial,system-ui,sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --max:1240px; color-scheme:light;
}
*{box-sizing:border-box}
html,body{overflow-x:clip}
html{scroll-behavior:auto}
body{margin:0;background:var(--cream);color:var(--navy);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
p{margin:0}
h1,h2,h3,h4{margin:0;color:var(--navy);font-weight:800;letter-spacing:-.035em;line-height:1.04;text-wrap:balance}
h1{font-size:clamp(2.7rem,6.4vw,5.4rem);letter-spacing:-.05em;line-height:.98}
h2{font-size:clamp(2.1rem,4.6vw,3.7rem)}
h3{font-size:clamp(1.2rem,1.8vw,1.45rem);letter-spacing:-.025em;line-height:1.2}
em.s{font-family:var(--serif);font-style:italic;font-weight:500;letter-spacing:-.02em;color:var(--gold-ink)}
.band{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:var(--max);margin:0 auto}
.sec{padding-block:clamp(72px,10vw,128px)}
.sec.alt{background:var(--paper)}
.sec.dark{background:var(--navy);color:var(--cream)}
.sec.dark h2,.sec.dark h3{color:var(--cream)}
.sec.dark em.s{color:var(--gold)}
.kick{display:inline-flex;align-items:center;gap:8px;font:700 .78rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink)}
.kick::before{content:"";width:18px;height:2px;background:var(--gold)}
.dark .kick{color:var(--gold)}
.lede{color:var(--text);font-size:clamp(1.03rem,1.35vw,1.17rem);max-width:60ch}
.dark .lede{color:#c9cede}
.head{display:grid;gap:18px;max-width:820px;margin-bottom:clamp(36px,5vw,60px);justify-items:start}
.head.c{margin-inline:auto;text-align:center;justify-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:12px;font:700 .97rem var(--sans);text-decoration:none;cursor:pointer;border:1px solid transparent;transition:transform .2s,background .2s,border-color .2s,color .2s;white-space:nowrap}
.btn.pri{background:var(--navy);color:var(--cream)}
.btn.pri:hover{background:var(--navy-2);transform:translateY(-1px)}
.btn.sec{border-color:var(--line-2);background:transparent;color:var(--navy)}
.btn.sec:hover{border-color:var(--navy)}
.btn.gold{background:var(--gold);color:var(--navy)}
.btn.gold:hover{filter:brightness(1.06)}
.dark .btn.sec{border-color:#3a4a78;color:var(--cream)}
.btn.sm{min-height:40px;padding:0 16px;font-size:.88rem;border-radius:10px}
.arrow::after{content:"→";transition:transform .2s}.arrow:hover::after{transform:translateX(3px)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* header */
.top{position:sticky;top:0;z-index:40;background:rgba(245,240,230,.86);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid transparent;transition:border-color .2s}
.top.scrolled{border-bottom-color:var(--line)}
.top .wrap{display:flex;align-items:center;gap:24px;min-height:70px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:1.12rem;letter-spacing:-.03em;margin-right:auto}
.logo i{width:30px;height:30px;border-radius:9px;background:var(--navy);display:grid;place-items:center;font-style:normal;color:var(--gold);font-family:var(--serif);font-style:italic;font-size:1.15rem}
.nav{display:flex;gap:26px;font-weight:600;font-size:.94rem}
.nav a{text-decoration:none;color:var(--text)}.nav a:hover,.nav a[aria-current="page"]{color:var(--navy)}
.nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--gold)}
.askbtn{display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line-2);border-radius:10px;min-height:40px;padding:0 14px;font:700 .88rem var(--sans);color:var(--navy);cursor:pointer}
.askbtn .dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.menu{display:none;background:none;border:1px solid var(--line-2);border-radius:10px;width:42px;height:40px;cursor:pointer;color:var(--navy)}
.drawer{display:none}
@media (max-width:980px){
  .nav,.top .askbtn,.top .btn.pri{display:none}
  .menu{display:grid;place-items:center}
  .drawer.open{display:grid;gap:4px;padding:8px 0 18px}
  .drawer a,.drawer button{font:700 1.1rem var(--sans);text-decoration:none;color:var(--navy);padding:12px 2px;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;cursor:pointer}
  .drawer .btn{margin-top:10px;border-bottom:0;justify-content:center;color:var(--cream)}
}

/* hero */
.hero{padding-block:clamp(36px,5vw,72px) clamp(64px,8vw,110px);position:relative;overflow:hidden}
.hgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(36px,5vw,72px);align-items:center}
.hero h1{margin-top:22px}
.hero .lede{margin-top:24px}
.hero .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:32px}
.trust{display:flex;align-items:center;gap:14px;margin-top:34px;font-size:.9rem;color:var(--muted)}
.trust b{color:var(--navy)}
.trust .faces{display:flex}
.trust .faces span{width:34px;height:34px;border-radius:50%;border:2px solid var(--cream);margin-left:-8px;display:grid;place-items:center;font:800 .75rem var(--sans);color:var(--cream)}
.trust .faces span:first-child{margin-left:0}
.hphoto{position:relative;aspect-ratio:4/4.3;max-height:680px}
.hphoto>img{width:100%;height:100%;object-fit:cover;border-radius:28px;display:block;box-shadow:0 50px 100px -50px rgba(10,21,48,.6)}
.fc{position:absolute;background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 60px -24px rgba(10,21,48,.45);font-size:.88rem}
.fc.coo{left:-34px;top:9%;padding:13px 15px;max-width:290px;display:flex;gap:11px}
.fc.coo i{flex:none;width:34px;height:34px;border-radius:10px;background:var(--navy);color:var(--gold);display:grid;place-items:center;font-style:normal;font-weight:800;font-size:.8rem}
.fc.coo b{display:block;font-size:.84rem}.fc.coo small{display:block;color:var(--text);line-height:1.4;font-size:.84rem;margin-top:2px}
.fc.scr{right:-22px;bottom:10%;width:58%;padding:6px}.fc.scr img{display:block;width:100%;border-radius:11px}
.fc.num{left:24px;bottom:-22px;background:var(--navy);border-color:var(--navy);color:var(--cream);padding:14px 18px}
.fc.num b{display:block;font:800 1.8rem/1 var(--sans);color:var(--gold);letter-spacing:-.03em}.fc.num small{color:#c9cede}
.live{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);animation:pulse 1.6s infinite}
@keyframes pulse{50%{opacity:.3}}
@media (max-width:980px){.hgrid{grid-template-columns:1fr}.hphoto{margin:0 8px 20px}}
@media (max-width:560px){.fc.coo{left:-8px;max-width:240px}.fc.scr{right:-8px;width:64%}.fc.num{display:none}}

/* page hero (inner pages) */
.phero{padding-block:clamp(48px,7vw,96px) clamp(40px,5vw,64px)}
.phero .head{margin-bottom:0}
.phero h1{font-size:clamp(2.5rem,5.6vw,4.6rem)}
.phero.split .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,64px);align-items:center}
.phero.split img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:24px;box-shadow:0 40px 90px -45px rgba(10,21,48,.6)}
@media (max-width:900px){.phero.split .wrap{grid-template-columns:1fr}}

/* proof band */
.proof{background:var(--navy);color:var(--cream)}
.proof .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.proof div{padding:30px 22px;border-left:1px solid #26365f}
.proof div:first-child{border-left:0}
.proof b{display:block;font:800 clamp(1.8rem,3vw,2.5rem)/1 var(--sans);letter-spacing:-.04em;color:var(--gold)}
.proof span{display:block;margin-top:8px;color:#c9cede;font-size:.92rem}
@media (max-width:760px){.proof .wrap{grid-template-columns:1fr 1fr}.proof div:nth-child(3){border-left:0}.proof div{border-top:1px solid #26365f}.proof div:nth-child(-n+2){border-top:0}}

/* service cards */
.svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.svcard{background:var(--white);border:1px solid var(--line);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;transition:transform .3s,box-shadow .3s}
.svcard:hover{transform:translateY(-4px);box-shadow:0 30px 60px -36px rgba(10,21,48,.45)}
.svcard .im{aspect-ratio:16/11;position:relative;overflow:hidden}
.svcard .im img{width:100%;height:100%;object-fit:cover;display:block}
.svcard .im .pr{position:absolute;left:14px;bottom:14px;background:var(--cream);color:var(--navy);border-radius:999px;padding:6px 12px;font:700 .82rem var(--sans)}
.svcard .tx{padding:22px;display:grid;gap:12px;flex:1;align-content:start}
.svcard p{color:var(--text);font-size:.95rem}
.svcard ul{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:.92rem;color:var(--text)}
.svcard li{display:flex;gap:9px}.svcard li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--gold);margin-top:.6em}
.svcard .more{margin-top:auto;padding-top:6px;font-weight:700;color:var(--navy)}
@media (max-width:900px){.svc{grid-template-columns:1fr}}

/* demos */
.demos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.demo{grid-column:span 2;background:var(--white);border:1px solid var(--line);border-radius:22px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.demo.big{grid-column:span 3}
.demo:hover{transform:translateY(-4px);box-shadow:0 30px 60px -36px rgba(10,21,48,.45)}
.demo .im{position:relative;aspect-ratio:16/10;background:var(--cream-2);overflow:hidden}
.demo .im>img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.demo:hover .im>img{transform:scale(1.03)}
.demo .im .ph{position:absolute;right:7%;bottom:-16%;width:26%;border-radius:20px;background:#111;padding:4px;box-shadow:0 20px 40px -14px rgba(0,0,0,.5)}
.demo .im .ph img{display:block;width:100%;border-radius:16px}
.demo .im .scr{position:absolute;left:7%;top:10%;width:80%;border-radius:10px;overflow:hidden;border:4px solid #fff;box-shadow:0 24px 50px -18px rgba(0,0,0,.55)}
.demo .im .scr img{display:block;width:100%}
.demo .im.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(10,21,48,.28));pointer-events:none}
.demo .im .ph,.demo .im .scr,.demo .im .tag{z-index:1}
.demo .tag{position:absolute;left:12px;top:12px;background:rgba(255,253,248,.94);border:1px solid var(--line);border-radius:999px;padding:5px 10px;font:700 .72rem var(--sans);color:var(--navy);display:flex;gap:6px;align-items:center}
.demo .tx{padding:20px 22px 22px;display:grid;gap:8px;flex:1;align-content:start}
.demo .who{font:700 .76rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.demo h3{font-size:1.4rem}
.demo p{color:var(--text);font-size:.94rem}
.demo .go{margin-top:auto;padding-top:8px;font-weight:700;display:inline-flex;gap:8px;align-items:center}
@media (max-width:1000px){.demo,.demo.big{grid-column:span 3}}
@media (max-width:680px){.demos{grid-template-columns:1fr}.demo,.demo.big{grid-column:auto}}

/* COO showcase */
.coo2{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(28px,5vw,72px);align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.chips span{border:1px solid #33457a;border-radius:999px;padding:7px 13px;font-size:.86rem;font-weight:600;color:#dfe3ee}
.chatwin{background:var(--paper);border-radius:24px;overflow:hidden;box-shadow:0 60px 120px -50px rgba(0,0,0,.6);color:var(--navy)}
.chatwin .bar{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);background:var(--white)}
.chatwin .bar i{width:40px;height:40px;border-radius:12px;background:var(--navy);color:var(--gold);display:grid;place-items:center;font-style:normal;font-weight:800}
.chatwin .bar b{display:block}.chatwin .bar small{color:var(--muted);font-size:.8rem;display:flex;gap:6px;align-items:center}
.chatwin .msgs{height:440px;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;overflow:hidden}
.bub{max-width:84%;padding:11px 14px;border-radius:16px 16px 16px 4px;background:var(--white);border:1px solid var(--line);font-size:.94rem;line-height:1.45;animation:pop .35s ease both;flex:none}
.bub.mine{align-self:flex-end;background:var(--navy);color:var(--cream);border-color:var(--navy);border-radius:16px 16px 4px 16px}
.bub.card{padding:0;overflow:hidden}
.bub.card .h{background:var(--navy);color:var(--gold);font:700 .72rem var(--sans);letter-spacing:.06em;padding:8px 14px}
.bub.card .b{padding:10px 14px;display:grid;gap:4px}
.typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:var(--white);border:1px solid var(--line);border-radius:14px;flex:none}
.typing i{width:7px;height:7px;border-radius:50%;background:#a7a99f;animation:blink 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:.25}}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:900px){.coo2{grid-template-columns:1fr}.chatwin .msgs{height:420px}}

/* ask band */
.ask{background:var(--white);border:1px solid var(--line);border-radius:26px;padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,4vw,48px);align-items:center}
.askform{display:flex;gap:8px;background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:8px}
.askform input{flex:1;min-width:0;border:0;background:transparent;font:500 16px var(--sans);color:var(--navy);padding:0 10px}
.askform input:focus{outline:none}
.sugg{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.sugg button{border:1px solid var(--line-2);background:var(--paper);border-radius:999px;padding:8px 13px;font:600 .86rem var(--sans);color:var(--text);cursor:pointer}
.sugg button:hover{border-color:var(--navy);color:var(--navy)}
@media (max-width:860px){.ask{grid-template-columns:1fr}}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;counter-reset:s}
.step{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:24px;display:grid;gap:10px;align-content:start}
.step .n{font:700 .78rem var(--sans);letter-spacing:.06em;color:var(--gold-ink)}
.step p{color:var(--text);font-size:.94rem}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* price teaser */
.pt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pt a{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:26px;text-decoration:none;display:grid;gap:8px}
.pt a.f{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.pt a.f h3,.pt a.f .p{color:var(--cream)}.pt a.f p{color:#c9cede}
.pt .p{font:800 2.4rem/1 var(--sans);letter-spacing:-.05em}
.pt .p small{font:600 .82rem var(--sans);color:var(--muted);letter-spacing:0}
.pt p{color:var(--text);font-size:.94rem}
@media (max-width:860px){.pt{grid-template-columns:1fr}}

/* cta */
.cta{position:relative;overflow:hidden;border-radius:28px;background:var(--navy);color:var(--cream);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:stretch}
.cta .tx{padding:clamp(28px,5vw,64px);display:grid;gap:18px;align-content:center;justify-items:start}
.cta h2{color:var(--cream)}
.cta img{width:100%;height:100%;object-fit:cover;min-height:280px;display:block}
@media (max-width:860px){.cta{grid-template-columns:1fr}.cta img{max-height:300px}}

/* agents */
.aggrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.agc{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:22px;display:grid;gap:8px;align-content:start}
.agc .n{font:700 .76rem var(--sans);color:var(--gold-ink);letter-spacing:.06em}
.agc p{color:var(--text);font-size:.92rem}
.agc.feat{background:var(--navy);border-color:var(--navy)}.agc.feat h3{color:var(--cream)}.agc.feat p{color:#c9cede}.agc.feat .n{color:var(--gold)}
@media (max-width:1000px){.aggrid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.aggrid{grid-template-columns:1fr}}
.org{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,56px);align-items:start}
.you{border:1px solid var(--gold);background:var(--gold-soft);border-radius:16px;padding:14px 18px;display:flex;justify-content:space-between;align-items:center}
.you b{font-weight:800;font-size:1.1rem}.you span{font-size:.82rem;color:var(--gold-ink);font-weight:700}
.wire{height:22px;margin-left:28px;border-left:2px dashed var(--gold)}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.role{border:1px solid var(--line);background:var(--white);color:var(--navy);border-radius:14px;padding:14px 16px;text-align:left;cursor:pointer;font:inherit;display:grid;gap:3px;transition:all .2s}
.role b{font-weight:700}.role small{color:var(--muted);font-size:.84rem}
.role[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}.role[aria-pressed="true"] small{color:#c9cede}
.rcard{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:clamp(20px,3vw,32px);display:grid;gap:18px;position:sticky;top:96px;box-shadow:0 30px 60px -44px rgba(10,21,48,.4)}
.rcard h3{font-size:clamp(1.8rem,3vw,2.4rem);letter-spacing:-.045em}
.rcard ul{margin:0;padding-left:18px;display:grid;gap:6px;color:var(--text)}
.rcard .tag2{justify-self:start;background:var(--gold-soft);color:var(--gold-ink);border-radius:999px;padding:6px 12px;font:700 .78rem var(--sans)}
.note{background:var(--cream);border-radius:16px 16px 16px 4px;padding:14px 16px;font-size:.95rem;line-height:1.5}
.note small{display:block;color:var(--gold-ink);font-weight:700;font-size:.74rem;margin-bottom:5px;letter-spacing:.04em;text-transform:uppercase}
.guard{font-size:.88rem;color:var(--muted);border-top:1px solid var(--line);padding-top:14px}
@media (max-width:900px){.org{grid-template-columns:1fr}.rcard{position:static}}
@media (max-width:420px){.roles{grid-template-columns:1fr}}

/* language demo */
.ldemo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.langs{display:flex;flex-wrap:wrap;gap:6px;margin-top:24px}
.langs button{font:600 .88rem var(--sans);border:1px solid var(--line-2);background:var(--white);color:var(--text);border-radius:999px;padding:8px 14px;cursor:pointer}
.langs button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.langs .any{font-size:.86rem;color:var(--muted);padding:9px 4px}
.stage2{display:grid;grid-template-columns:minmax(0,290px) minmax(0,1fr);gap:16px;align-items:end}
.phone{border-radius:40px;background:#111;padding:9px;box-shadow:0 50px 90px -40px rgba(10,21,48,.6)}
.screen{border-radius:32px;overflow:hidden;background:#efeae0;height:560px;display:flex;flex-direction:column}
.wa{background:var(--navy);color:var(--cream);padding:34px 14px 12px;display:flex;align-items:center;gap:10px}
.wa i{width:34px;height:34px;border-radius:10px;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-style:normal;font-weight:800}
.wa b{font-size:14.5px;display:block}.wa small{font-size:11px;color:#c9cede}
.thread{flex:1;padding:12px 10px;display:flex;flex-direction:column;gap:8px;overflow:hidden;justify-content:flex-end;font:400 14px/1.4 var(--sans);color:#111}
.m{max-width:84%;background:#fff;padding:8px 11px;border-radius:14px 14px 14px 4px;animation:pop .35s ease both;flex:none}
.m.c{align-self:flex-end;background:#dcefe2;border-radius:14px 14px 4px 14px}
.m.pic{padding:5px}.m.pic span{display:block;width:150px;height:96px;border-radius:10px;background:linear-gradient(135deg,#e5dccb,#f6f1e7 45%,#d8e2ef)}
.inbar{margin:0 8px 12px;background:#fff;border-radius:999px;padding:11px 15px;color:#9a9fb2;font-size:14px}
.summary{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:18px;display:grid;gap:10px;box-shadow:0 30px 60px -36px rgba(10,21,48,.4)}
.summary .t{font:700 .74rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--green)}
.summary dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.88rem}
.summary dt{color:var(--muted)}.summary dd{margin:0;font-weight:600}
@media (max-width:960px){.ldemo{grid-template-columns:1fr}}
@media (max-width:620px){.stage2{grid-template-columns:1fr}.phone{max-width:310px;margin:0 auto;width:100%}}

/* CFO */
.cfo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.cfol{margin:22px 0 0;padding:0;list-style:none;display:grid;gap:12px}
.cfol li{padding-left:28px;position:relative;color:var(--text)}
.cfol li::before{content:"";position:absolute;left:0;top:7px;width:14px;height:14px;border-radius:4px;border:2px solid var(--gold)}
.cfol b{color:var(--navy)}
.dash{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:18px;display:grid;gap:14px;box-shadow:0 50px 100px -50px rgba(10,21,48,.5)}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kpis div{background:var(--cream);border-radius:14px;padding:12px 14px}
.kpis small,.chart>small{display:block;font-size:.76rem;color:var(--muted);font-weight:600}
.kpis b{display:block;font:800 1.3rem/1.2 var(--sans);letter-spacing:-.03em;margin-top:4px}
.kpis em{font-style:normal;font-size:.74rem;font-weight:600;color:var(--green)}
.chart{border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;gap:10px}
.bar{display:grid;grid-template-columns:8.5rem minmax(0,1fr) 3.6rem;gap:10px;align-items:center;font-size:.84rem}
.bar b{text-align:right}
.bar i{height:10px;border-radius:999px;background:var(--cream-2);position:relative;overflow:hidden}
.bar i::after{content:"";position:absolute;inset:0;width:var(--w);border-radius:999px;background:var(--navy)}
.bar.neg i::after{background:#c0584a}.bar.neg b{color:#a8392b}
@media (max-width:960px){.cfo{grid-template-columns:1fr}}
@media (max-width:480px){.kpis{grid-template-columns:1fr}.bar{grid-template-columns:6.5rem minmax(0,1fr) 3.2rem}}

/* control list */
.ctrl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ctrl div{border-top:2px solid var(--gold);padding-top:18px;display:grid;gap:8px}
.ctrl p{color:#c9cede;font-size:.95rem}
@media (max-width:760px){.ctrl{grid-template-columns:1fr}}

/* pricing */
.tiers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch}
.tier,.plan{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:26px 22px;display:flex;flex-direction:column;gap:12px;position:relative}
.tier .nm,.plan .nm{font:700 .82rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.pr{font:800 clamp(2rem,3vw,2.6rem)/1 var(--sans);letter-spacing:-.05em}
.pr small{font:600 .82rem var(--sans);color:var(--muted);margin-left:4px;letter-spacing:0}
.typ{font-size:.84rem;color:var(--navy);font-weight:600}
.tier p,.plan p{color:var(--text);font-size:.94rem}
.tier ul,.plan ul{margin:0;padding:14px 0 0;list-style:none;display:grid;gap:8px;border-top:1px solid var(--line);font-size:.92rem;color:var(--text)}
.tier li,.plan li{display:flex;gap:9px}.tier li::before,.plan li::before{content:"✓";color:var(--green);font-weight:800}
.tier .btn,.plan .btn{margin-top:auto}
.tier.feat,.plan.feat{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.tier.feat .nm,.plan.feat .nm{color:var(--gold)}.tier.feat .typ{color:var(--gold)}
.tier.feat p,.tier.feat ul,.plan.feat p,.plan.feat ul{color:#c9cede;border-color:#2a3b6b}.tier.feat .pr small,.plan.feat .pr small{color:#c9cede}
.badge{position:absolute;top:-12px;left:20px;background:var(--gold);color:var(--navy);font:800 .72rem var(--sans);padding:5px 11px;border-radius:999px;letter-spacing:.04em}
.also{margin-top:18px;color:var(--muted);font-size:.94rem;max-width:95ch}.also b{color:var(--navy)}
.how{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,64px)}
.hl{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.hl li{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:12px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--white);color:var(--text);font-size:.95rem}
.hl li>span:first-child{width:2rem;height:2rem;border-radius:10px;background:var(--gold-soft);color:var(--gold-ink);display:grid;place-items:center;font-weight:800;font-size:.8rem}
.hl b{color:var(--navy)}
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:28px}
.timeline div{padding:20px;border-radius:16px;background:var(--gold-soft)}
.when{font:700 .76rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.timeline b{display:block;margin:6px 0}.timeline p{color:var(--text);font-size:.9rem}
.cmpwrap{overflow-x:auto;border:1px solid var(--line);border-radius:20px;background:var(--white)}
table.cmp{width:100%;min-width:780px;border-collapse:collapse;font-size:.93rem}
.cmp th,.cmp td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
.cmp tr:last-child>*{border-bottom:0}
.cmp thead th{font:700 .76rem var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--cream)}
.cmp tbody th{color:var(--navy);font-weight:700}
.cmp .me{background:var(--navy);color:var(--cream);font-weight:700}
.cmp thead .me{color:var(--gold);background:var(--navy)}
@media (max-width:1060px){.tiers{grid-template-columns:1fr 1fr}}
@media (max-width:860px){.how{grid-template-columns:1fr}.plans{grid-template-columns:1fr}.timeline{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.tiers{grid-template-columns:1fr}.timeline{grid-template-columns:1fr}}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.faq details{border:1px solid var(--line);border-radius:14px;padding:16px 18px;background:var(--white)}
.faq summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--gold-ink);font-weight:800;font-size:1.2rem;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--text);margin-top:10px;font-size:.94rem}
@media (max-width:760px){.faq{grid-template-columns:1fr}}

/* work page */
.cases{display:grid;gap:22px}
.case{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);gap:clamp(20px,3vw,40px);align-items:center;background:var(--white);border:1px solid var(--line);border-radius:26px;padding:clamp(12px,1.6vw,18px)}
.case .demo{border:0;border-radius:18px;grid-column:auto}
.case .im{border-radius:18px;aspect-ratio:16/10.5}
.case .tx2{display:grid;gap:14px;padding:8px 12px 8px 0}
.case .who{font:700 .76rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.case h3{font-size:clamp(1.8rem,3vw,2.4rem);letter-spacing:-.045em}
.case p{color:var(--text)}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.metrics div{padding:10px 12px;border-radius:12px;background:var(--cream)}
.metrics b{display:block;font:800 1.15rem/1.1 var(--sans);letter-spacing:-.03em}.metrics small{font-size:.76rem;color:var(--muted)}
.case ul{margin:0;padding:0;list-style:none;display:grid;gap:7px;font-size:.94rem;color:var(--text)}
.case li{display:flex;gap:10px}.case li::before{content:"✓";color:var(--green);font-weight:800}
.case li.ai::before{content:"✦";color:var(--gold-ink)}
.case .row{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:900px){.case{grid-template-columns:1fr}.case .tx2{padding:6px 8px 12px}}

/* about */
.ab{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,72px);align-items:start}
.ab .body{display:grid;gap:18px;font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--text)}
.ab .body b{color:var(--navy)}
.mono{width:120px;height:120px;border-radius:30px;background:var(--navy);color:var(--gold);display:grid;place-items:center;font:italic 500 3.4rem var(--serif);margin-bottom:22px}
.vals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.vals div{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:24px;display:grid;gap:8px}
.vals p{color:var(--text);font-size:.95rem}
@media (max-width:860px){.ab{grid-template-columns:1fr}.vals{grid-template-columns:1fr}}

/* book */
.bookgrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:start}
.next{display:grid;gap:12px;margin-top:28px}
.next div{display:grid;grid-template-columns:2.4rem 1fr;gap:12px;align-items:start}
.next span{width:2.2rem;height:2.2rem;border-radius:10px;background:var(--navy);color:var(--gold);display:grid;place-items:center;font-weight:800;font-size:.85rem}
.next p{color:var(--text)}.next b{color:var(--navy)}
form.f{background:var(--white);border:1px solid var(--line);border-radius:24px;padding:clamp(18px,3vw,30px);display:grid;grid-template-columns:1fr 1fr;gap:14px;box-shadow:0 40px 80px -50px rgba(10,21,48,.5)}
form.f .full{grid-column:1/-1}
label.l{display:grid;gap:6px;font:700 .84rem var(--sans)}
input.i,textarea.i{width:100%;font:400 16px var(--sans);color:var(--navy);background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
input.i:focus,textarea.i:focus{outline:none;border-color:var(--navy);background:var(--white)}
textarea.i{min-height:110px;resize:vertical}
fieldset{border:0;margin:0;padding:0}legend{font:700 .84rem var(--sans);margin-bottom:8px;padding:0}
.picks{display:flex;flex-wrap:wrap;gap:6px}
.picks label{cursor:pointer;position:relative}
.picks input{position:absolute;opacity:0;pointer-events:none}
.picks span{display:inline-block;padding:9px 14px;border-radius:999px;border:1px solid var(--line-2);font-size:.9rem;font-weight:600;color:var(--text);background:var(--white)}
.picks input:checked+span{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.picks input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.formmsg{grid-column:1/-1;border-radius:12px;padding:12px 14px;font-weight:600;font-size:.94rem}
.formmsg.ok{background:var(--green-soft);color:var(--green)}.formmsg.err{background:#fbeae6;color:#a8392b}
.hp{position:absolute;left:-9999px}
@media (max-width:860px){.bookgrid{grid-template-columns:1fr}}
@media (max-width:520px){form.f{grid-template-columns:1fr}}

/* footer */
footer{background:var(--navy);color:#c9cede;padding-block:56px 32px;font-size:.92rem}
footer .wrap{display:grid;gap:30px}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:24px}
footer .logo{color:var(--cream)}
footer .logo i{background:var(--gold);color:var(--navy)}
footer a{color:#e7eaf2;text-decoration:none}footer a:hover{color:var(--gold)}
footer h4{color:var(--gold);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
footer .fine{border-top:1px solid #26365f;padding-top:20px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.82rem;color:#9aa3bd}
@media (max-width:700px){footer .cols{grid-template-columns:1fr}}

/* chat widget */
.chatfab{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:60;display:flex;align-items:center;gap:10px;background:var(--navy);color:var(--cream);border:0;border-radius:999px;padding:12px 18px 12px 12px;font:700 .95rem var(--sans);cursor:pointer;box-shadow:0 20px 40px -14px rgba(10,21,48,.6)}
.chatfab i{width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-style:normal;font-family:var(--serif);font-style:italic;font-weight:600}
.chatfab[hidden]{display:none}
.chatpanel{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:61;width:min(400px,calc(100vw - 32px));height:min(620px,calc(100dvh - 32px));background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:0 50px 100px -30px rgba(10,21,48,.55);display:none;flex-direction:column;overflow:hidden}
.chatpanel.open{display:flex}
.cp-h{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 18px;background:var(--navy);color:var(--cream)}
.cp-h i{width:36px;height:36px;border-radius:11px;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-style:normal;font-family:var(--serif);font-style:italic;font-weight:600;font-size:1.1rem}
.cp-h b{display:block}.cp-h small{color:#c9cede;font-size:.78rem}
.cp-h button{margin-left:auto;background:transparent;border:1px solid #33457a;color:var(--cream);width:36px;height:36px;border-radius:10px;font-size:1.2rem;cursor:pointer}
.cp-m{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.cp-m .bub{animation:pop .25s ease both;white-space:pre-wrap}
.cp-m .bub a{color:inherit;font-weight:700}
.cp-s{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 10px}
.cp-s button{border:1px solid var(--line-2);background:var(--white);border-radius:999px;padding:7px 11px;font:600 .82rem var(--sans);color:var(--text);cursor:pointer}
.cp-f{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);background:var(--white)}
.cp-f input{flex:1;min-width:0;border:1px solid var(--line);background:var(--cream);border-radius:12px;padding:12px 14px;font:400 16px var(--sans);color:var(--navy)}
.cp-f input:focus{outline:none;border-color:var(--navy)}
.cp-f button{background:var(--navy);color:var(--cream);border:0;border-radius:12px;padding:0 16px;font:700 .9rem var(--sans);cursor:pointer}
.cp-n{font-size:.72rem;color:var(--muted);text-align:center;padding:0 12px 10px;background:var(--white)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* demo viewer */
.dv{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:0;min-height:calc(100dvh - 70px);border-top:1px solid var(--line)}
.dv-stage{position:relative;background:#e9e2d2;background-image:radial-gradient(#d6ccb6 1px,transparent 1px);background-size:18px 18px;overflow:hidden;min-height:420px}
#stage{position:absolute;inset:0;overflow:hidden}
.inner{position:absolute;left:0;top:0;transform-origin:0 0;transition:transform .75s cubic-bezier(.2,.7,.2,1);display:none;border-radius:calc(14px / var(--s,1));box-shadow:0 40px 80px -30px rgba(10,21,48,.5);overflow:visible}
.inner.on{display:block}
.inner img{display:block;width:100%;height:100%;border-radius:inherit}
.hi{position:absolute;border:calc(3px / var(--s,1)) solid var(--gold);border-radius:calc(10px / var(--s,1));box-shadow:0 0 0 9999px rgba(10,21,48,.5);transition:all .6s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.ov .hi{box-shadow:0 0 0 9999px rgba(10,21,48,.12)}
.dv-side{background:var(--paper);border-left:1px solid var(--line);padding:26px 24px;display:flex;flex-direction:column;gap:18px;max-height:calc(100dvh - 70px);overflow-y:auto;position:sticky;top:70px}
.dv-side .who{font:700 .74rem var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--gold-ink)}
.dv-side h1{font-size:2rem;letter-spacing:-.04em;margin-top:6px}
.dv-side .line{color:var(--text);font-size:.95rem;margin-top:8px}
#cap{background:var(--navy);color:var(--cream);border-radius:18px;padding:18px;display:grid;gap:8px;min-height:150px;align-content:start}
#cap .k{font:700 .72rem var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--gold)}
#cap h3{color:var(--cream);font-size:1.3rem}#cap p{color:#d4d8e4;font-size:.95rem}
.ctrls{display:flex;align-items:center;gap:8px}
.ctrls button{min-height:46px}
.ctrls .rnd{width:46px;padding:0;border-radius:12px;border:1px solid var(--line-2);background:var(--white);font-size:1.2rem;cursor:pointer;color:var(--navy)}
.ctrls #next{flex:1}
#count{font:700 .86rem var(--sans);color:var(--muted);min-width:3.4rem;text-align:center}
#ovbtn{background:none;border:0;color:var(--navy);font:700 .88rem var(--sans);text-decoration:underline;text-underline-offset:4px;cursor:pointer;padding:0;align-self:flex-start}
#steps{list-style:none;margin:0;padding:0;display:grid;gap:4px}
#steps button{width:100%;display:grid;grid-template-columns:2rem 1fr;gap:8px;text-align:left;background:none;border:0;border-radius:10px;padding:9px 10px;font:600 .92rem var(--sans);color:var(--text);cursor:pointer}
#steps button span{color:var(--muted);font-size:.8rem;padding-top:2px}
#steps button[aria-current="step"]{background:var(--cream);color:var(--navy)}
#steps button[aria-current="step"] span{color:var(--gold-ink)}
.dv-side .foot{margin-top:auto;display:grid;gap:8px;padding-top:6px}
.dv-side .fine{font-size:.78rem;color:var(--muted)}
.backlink{font:700 .86rem var(--sans);text-decoration:none;color:var(--muted)}.backlink:hover{color:var(--navy)}
@media (max-width:900px){
  .dv{grid-template-columns:1fr}
  .dv-stage{height:62dvh;min-height:380px}
  .dv-side{position:static;max-height:none;border-left:0;border-top:1px solid var(--line);padding:20px 16px 90px}
  .dv-side .intro{order:-1}
}
/* live site demo */
.lv{display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:calc(100dvh - 70px);border-top:1px solid var(--line)}
.lv-frame{background:#e9e2d2;background-image:radial-gradient(#d6ccb6 1px,transparent 1px);background-size:18px 18px;display:grid;place-items:center;padding:18px}
.lv-frame .dev{width:100%;height:calc(100dvh - 110px);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 40px 80px -30px rgba(10,21,48,.5);transition:width .5s cubic-bezier(.2,.7,.2,1),border-radius .5s}
.lv-frame.phone .dev{width:400px;max-width:100%;border-radius:38px;border:10px solid #111}
.lv-frame iframe{width:100%;height:100%;border:0;display:block}
.seg{display:inline-flex;background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:4px}
.seg button{border:0;background:none;padding:8px 14px;border-radius:9px;font:700 .86rem var(--sans);color:var(--muted);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--navy);color:var(--cream)}
.tries{display:grid;gap:8px}
.tries button{display:grid;grid-template-columns:2rem 1fr;gap:10px;text-align:left;border:1px solid var(--line);background:var(--white);border-radius:14px;padding:12px 14px;cursor:pointer;font:inherit;color:var(--navy)}
.tries button span{width:2rem;height:2rem;border-radius:9px;background:var(--gold-soft);color:var(--gold-ink);display:grid;place-items:center;font-weight:800;font-size:.8rem}
.tries button b{display:block;font-size:.95rem}.tries button small{color:var(--muted);font-size:.84rem}
.tries button[aria-current="true"]{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
@media (max-width:900px){.lv{grid-template-columns:1fr}.lv-frame{padding:10px}.lv-frame .dev{height:72dvh}.lv .dv-side{position:static;max-height:none;border-left:0;border-top:1px solid var(--line);padding:20px 16px 90px}.seg{display:none}}
.top .wrap.drawer{display:none}
@media (max-width:980px){.top .wrap.drawer.open{display:grid}}
.cta .lede{color:#c9cede}
.cta .btn.sec{border-color:#3a4a78;color:var(--cream)}
.chatwin .bar i{font-size:.8rem;letter-spacing:.02em}
@media (max-width:600px){.chatwin .msgs{height:360px}}
.dv-side>*{flex-shrink:0}
.stagetag{display:none}
@media (max-width:900px){
  .dv{display:block}
  .dv-stage{position:sticky;top:70px;z-index:5;height:50dvh;min-height:300px;box-shadow:0 10px 20px -16px rgba(10,21,48,.5)}
  .dv-side .intro h1,.dv-side .intro .line,.dv-side .intro .who{display:none}
  .stagetag{display:flex;position:absolute;left:10px;top:10px;z-index:3;background:rgba(10,21,48,.88);color:var(--cream);border-radius:999px;padding:6px 12px;font:700 .78rem var(--sans);gap:6px}
  .stagetag span{color:var(--gold)}
  .dv-side{padding-top:14px}
  #cap{min-height:0}
}
@media (max-width:900px){
  .demopage .chatfab{display:none}
  .lv-frame.phone .dev,.lv-frame .dev{width:100%;border:0;border-radius:14px;height:70dvh}
  .stagetag{top:auto;bottom:10px}
}
.cp-s[hidden]{display:none}

/* big project showcase */
.stabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:18px;scrollbar-width:none}
.stabs::-webkit-scrollbar{display:none}
.stabs button{flex:none;text-align:left;border:1px solid var(--line);background:var(--white);border-radius:14px;padding:10px 16px;cursor:pointer;font:inherit;color:var(--navy);display:grid;gap:1px}
.stabs button b{font-size:.98rem}.stabs button small{font-size:.76rem;color:var(--muted)}
.stabs button[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.stabs button[aria-selected="true"] small{color:var(--gold)}
.spanel[hidden]{display:none}
.frame{display:block;position:relative;border-radius:20px;background:var(--white);border:1px solid var(--line);overflow:hidden;box-shadow:0 50px 100px -50px rgba(10,21,48,.55);text-decoration:none;color:var(--navy)}
.fbar{display:flex;align-items:center;gap:7px;height:42px;padding:0 16px;background:#f1ece1;border-bottom:1px solid var(--line)}
.fbar i{width:11px;height:11px;border-radius:50%;background:#dcd4c3}
.fbar .url{margin-left:14px;background:var(--white);border-radius:8px;padding:4px 14px;font-size:.8rem;color:var(--muted);flex:0 1 340px;overflow:hidden;white-space:nowrap}
.openhint{margin-left:auto;font:700 .82rem var(--sans);color:var(--navy);white-space:nowrap}
.view{position:relative}
.view>img{display:block;width:100%;height:auto}
.view .ph2{position:absolute;right:2.5%;bottom:-8%;width:19%;background:#111;border-radius:30px;padding:6px;box-shadow:0 30px 60px -20px rgba(0,0,0,.55)}
.view .ph2 img{display:block;width:100%;border-radius:25px}
.frame.pv{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);aspect-ratio:16/9.4;background:var(--cream-2)}
.pphoto{width:100%;height:100%;object-fit:cover;display:block}
.pphone{align-self:center;justify-self:center;height:92%;aspect-ratio:390/844;background:#111;border-radius:40px;padding:8px;box-shadow:0 40px 70px -30px rgba(10,21,48,.6)}
.pphone img{display:block;width:100%;height:100%;border-radius:33px;object-fit:cover}
.openhint.fl{position:absolute;left:16px;top:16px;background:rgba(255,253,248,.95);border-radius:999px;padding:8px 14px;border:1px solid var(--line)}
.frame:hover{box-shadow:0 60px 110px -50px rgba(10,21,48,.7)}
.sinfo{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:22px;flex-wrap:wrap}
.sinfo .who,.case2 .who{font:700 .76rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.sinfo h3{font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.04em;margin-top:4px}
.sinfo p{color:var(--text);max-width:62ch;margin-top:6px}
.sbtn{display:flex;gap:10px;flex-wrap:wrap}
.case2{background:var(--white);border:1px solid var(--line);border-radius:28px;padding:clamp(12px,1.6vw,20px);scroll-margin-top:90px}
.case2 .frame{box-shadow:none}
.cinfo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,4vw,48px);padding:clamp(18px,2.4vw,30px) clamp(6px,1.4vw,14px) clamp(8px,1vw,12px)}
.cinfo h3{font-size:clamp(1.8rem,3vw,2.5rem);letter-spacing:-.045em;margin-top:4px}
.cinfo p{color:var(--text);margin-top:8px}
.cinfo ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;color:var(--text)}
.cinfo li{display:flex;gap:10px}.cinfo li::before{content:"✓";color:var(--green);font-weight:800}
.cinfo li.ai::before{content:"✦";color:var(--gold-ink)}
@media (max-width:760px){
  .frame.pv{grid-template-columns:1fr;aspect-ratio:auto}
  .pphoto{height:170px}
  .pphone{height:auto;width:min(270px,78%);margin:-60px 0 18px;position:relative}
  .view .ph2{width:26%;bottom:-6%;border-radius:18px;padding:4px}.view .ph2 img{border-radius:14px}
  .fbar .url{display:none}
  .cinfo{grid-template-columns:1fr}
  .stabs button{padding:9px 13px}
}
.frame.pv{aspect-ratio:auto;align-items:stretch}
.pphone{height:auto;width:min(330px,78%);margin:28px 0}
.pphone img{height:auto;object-fit:initial}
@media (max-width:760px){
  .view{height:380px;overflow:hidden}
  .view>img{width:auto;height:100%;max-width:none;object-fit:cover}
  .view.l>img{margin-left:50%;transform:translateX(-50%)}
  .view .ph2{width:34%;bottom:4%;right:3%}
  .pphone{margin:-60px 0 18px}
}

/* ===== cinematic layer ===== */
.cine{background:radial-gradient(1200px 600px at 50% 0%,#1d2f63 0%,#0a1530 45%,#0a1430 100%);color:var(--cream);padding-block:clamp(48px,7vw,96px) 0;overflow:hidden;position:relative}
.cine::after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,#0a1430);pointer-events:none}
.cine-copy{text-align:center;max-width:900px;margin:0 auto;display:grid;justify-items:center;gap:22px}
.cine h1{color:var(--cream);font-size:clamp(2.8rem,7vw,6rem)}
.cine em.s{color:var(--gold)}
.cine .kick{color:var(--gold)}
.cine .lede{color:#c9cede;text-align:center}
.cine .row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.cine .btn.sec,.chaps .btn.sec,.cine-sec .btn.sec{border-color:#3a4a78;color:var(--cream)}
.stage3d{perspective:2200px;margin-top:clamp(40px,6vw,72px);position:relative;z-index:1}
.tilt{position:relative;max-width:1180px;margin:0 auto;transform-origin:50% 0;transform:rotateX(var(--rx,16deg)) scale(var(--sc,.94));transition:transform .1s linear;will-change:transform}
.glow{position:absolute;inset:-10% 10% 20%;background:radial-gradient(closest-side,rgba(207,174,110,.35),transparent);filter:blur(30px);z-index:-1}
.bf{position:relative;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 60px 140px -40px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.08)}
.bf .fbar{background:#e9e3d6;border-bottom:1px solid #d9d0bd;height:38px}
.bfv{position:relative;background:#fff}
.bfv>img{display:block;width:100%;height:auto}
.phn{background:#0b0b0d;border-radius:44px;padding:9px;box-shadow:0 50px 100px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.1)}
.phn img{display:block;width:100%;border-radius:36px}
.tilt .phn{position:absolute;width:21%;bottom:-8%}
.tilt .phn.hl{left:-6%}.tilt .phn.hr{right:-6%}
.chip{position:absolute;background:rgba(255,253,248,.97);color:var(--navy);border-radius:16px;padding:12px 15px;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);font-size:.86rem;display:flex;gap:10px;align-items:flex-start}
.chip b{display:block}.chip small{color:var(--text);display:block;max-width:230px}
.chip .live{margin-top:6px;flex:none}
.chip.c1{left:14%;top:-5%}.chip.c2{right:14%;top:8%;display:block}.chip.c2 b{font-size:1.6rem;color:var(--gold-ink);letter-spacing:-.03em}
.proof{position:relative;z-index:2}
.proof{background:#0a1430}
.cine-sec{background:#0a1430;color:var(--cream);padding-block:clamp(64px,8vw,110px) 10px}
.cine-sec h1,.cine-sec h2{color:var(--cream)}.cine-sec em.s{color:var(--gold)}.cine-sec .kick{color:var(--gold)}.cine-sec .lede{color:#c9cede}
.chaps{background:#0a1430;color:var(--cream);padding-bottom:clamp(64px,8vw,110px)}
.chap{padding-block:clamp(48px,6vw,90px);border-top:1px solid #1c2a55;scroll-margin-top:70px}
.chap:first-child{border-top:0}
.chap-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,3vw,36px);align-items:end;margin-bottom:clamp(24px,3.5vw,44px)}
.chap .num{font:italic 500 clamp(3.4rem,7vw,6rem)/.8 var(--serif);color:var(--gold)}
.chap .who{font:700 .76rem var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.chap h3{color:var(--cream);font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.045em;margin-top:6px}
.chap-head p{color:#c9cede;max-width:62ch;margin-top:10px;font-size:1.05rem}
.chap-stage{position:relative;padding-right:clamp(0px,7vw,110px)}
.chap-stage .phn.fl-r{position:absolute;right:0;bottom:-6%;width:clamp(150px,19%,250px)}
.lframe{aspect-ratio:1440/900;overflow:hidden}
.lframe iframe{position:absolute;left:0;top:0;width:1440px;height:900px;border:0;transform-origin:0 0;pointer-events:auto}
.lframe .lfall{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1;transition:opacity .6s}
.lframe.ready .lfall{opacity:0;pointer-events:none}
.lcover{position:absolute;inset:0;display:none}
.livetag{margin-left:auto;font:700 .78rem var(--sans);color:var(--navy);display:flex;gap:7px;align-items:center}
.thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(20px,3vw,34px);padding-right:clamp(0px,7vw,110px)}
.thumbs a{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/10;background:#fff;box-shadow:0 30px 60px -30px rgba(0,0,0,.7);text-decoration:none}
.thumbs img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.thumbs a:hover img{transform:scale(1.04)}
.thumbs span{position:absolute;left:12px;bottom:12px;background:rgba(10,21,48,.9);color:var(--cream);border-radius:999px;padding:6px 12px;font:700 .8rem var(--sans)}
.thumbs.two{grid-template-columns:minmax(0,2.2fr) minmax(0,1fr)}
.thumbs.two a.tall{aspect-ratio:auto}
.thumbs.two a.tall img{object-position:top}
.pstage{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,360px) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center}
.cos{display:grid;gap:16px}
.co{background:#121f47;border:1px solid #23346a;border-radius:18px;padding:18px 20px;display:grid;gap:6px}
.co span{font:italic 500 1.5rem/1 var(--serif);color:var(--gold)}
.co b{color:var(--cream);font-size:1.08rem}
.co p{color:#b9c0d6;font-size:.92rem}
.phn.big{width:100%}
.chap-det{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,4vw,48px);margin-top:clamp(40px,5vw,64px);align-items:start}
.chap-det .metrics div{background:#121f47}
.chap-det .metrics b{color:var(--cream)}.chap-det .metrics small{color:#9aa3bd}
.chap-det ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;color:#d4d8e4}
.chap-det li{display:flex;gap:10px}.chap-det li::before{content:"✓";color:#6fcf97;font-weight:800}
.chap-det li.ai::before{content:"✦";color:var(--gold)}
.chap-det .prob{grid-column:2;color:#9aa3bd;font-size:.94rem}.chap-det .prob b{color:var(--cream)}
.svcard .im img.scrn{object-position:left top}
.cta.solo{grid-template-columns:1fr;text-align:center;background:radial-gradient(700px 300px at 50% 0%,#24386f,#0a1530 70%)}
.cta.solo .tx{justify-items:center}
.cta.solo .lede{margin-inline:auto}
.agstage{position:relative;padding-right:60px}
.agstage .phn{position:absolute;right:0;bottom:-8%;width:30%}
.rv{opacity:0;transform:translateY(46px) scale(.975);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media (max-width:900px){
  .tilt .phn{width:26%}.tilt .phn.hl{display:none}.tilt .phn.hr{right:-2%}
  .chip.c1{left:2%;top:-14%}.chip.c2{display:none}
  .chap-head{grid-template-columns:auto minmax(0,1fr)}.chap-head .sbtn{grid-column:1/-1}
  .chap-stage,.thumbs{padding-right:0}
  .chap-stage .phn.fl-r{width:30%;right:-2%;bottom:-10%}
  .pstage{grid-template-columns:1fr}.pstage .phn.big{max-width:320px;margin:0 auto;order:-1}
  .chap-det{grid-template-columns:1fr}.chap-det .prob{grid-column:auto}
  .thumbs{grid-template-columns:1fr 1fr}.thumbs a:last-child:nth-child(3){grid-column:1/-1}
  .thumbs.two{grid-template-columns:1.6fr 1fr}
  .lframe iframe{display:none}.lframe .lfall{opacity:1}.lcover{display:block}
  .agstage{padding-right:30px}
}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.tilt{transform:none}}
.thumbs.two a.tall{aspect-ratio:16/10}
.chip.c2{right:3%;top:-7%}
.chatwin .bar i::after{display:none}.chatwin .bar i{height:40px;overflow:visible}
@media (max-width:860px){.ask{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){
  .chap-head{grid-template-columns:minmax(0,1fr);gap:10px}
  .chap .num{font-size:2.8rem}
  .chap-stage .phn.fl-r{right:0}
}

/* ===== type: same pairing as the eye site, serif display + clean sans ===== */
:root{--sans:"Figtree","Helvetica Neue",Arial,system-ui,sans-serif;--serif:"Newsreader",Georgia,"Times New Roman",serif}
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.025em;line-height:1.02}
h1{font-size:clamp(3rem,7vw,6.2rem)}
h2{font-size:clamp(2.3rem,5vw,4.2rem)}
em.s{font-weight:400;letter-spacing:-.02em}
.chap h3,.dv-side h1,.case h3,.cinfo h3,.sinfo h3,.rcard h3{font-family:var(--serif);font-weight:400;letter-spacing:-.025em}
.chap h3{font-size:clamp(2.4rem,4.6vw,4rem)}
.proof b,.pr,.pt .p,.mono{font-family:var(--serif);font-weight:400;letter-spacing:-.02em}
.kick{font-weight:700}

/* ===== iris network hero ===== */
.cine{padding-top:0}
.iris-wrap{position:relative;height:min(100svh,940px);min-height:620px;margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)));display:grid;place-items:center;overflow:hidden}
#iris{position:absolute;inset:0;width:100%;height:100%;display:block}
.iris-wrap::after{content:"";position:absolute;inset:auto 0 0;height:160px;background:linear-gradient(transparent,#0a1530);pointer-events:none}
.cine-copy{position:relative;z-index:2;padding:0 16px;max-width:860px}
.cine h1{font-size:clamp(3rem,7.4vw,6.6rem);text-shadow:0 4px 40px rgba(10,20,48,.8)}
.cine .lede{font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:46ch}
.iris-tags{position:absolute;inset:0;pointer-events:none;z-index:1}
.iris-tags span{position:absolute;left:50%;top:50%;transform:rotate(var(--a)) translateX(min(44vw,560px)) rotate(calc(-1 * var(--a)));translate:-50% -50%;font:600 .78rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#d8c08c;background:rgba(10,21,48,.7);border:1px solid rgba(207,174,110,.35);padding:6px 11px;border-radius:999px;white-space:nowrap;backdrop-filter:blur(4px)}
@media (max-width:900px){.iris-tags{display:none}.iris-wrap{height:auto;min-height:88svh;padding-block:90px 70px}}
.stage3d{margin-top:-40px}

/* ===== agents grid icons ===== */
.agc .ic{width:44px;height:44px;border-radius:12px;background:var(--gold-soft);color:var(--gold-ink);display:grid;place-items:center;margin-bottom:6px}
.agc.feat .ic{background:#24386f;color:var(--gold)}
.agc .ic svg{width:22px;height:22px}
.svcard .tx p{font-size:1rem}
:root{--deep:#070f24}
.cine{background:var(--deep)}
.iris-wrap{background:radial-gradient(900px 700px at 50% 50%,#17295a 0%,var(--deep) 70%)}
.iris-wrap::after{background:linear-gradient(transparent,var(--deep))}
.proof,.cine-sec,.chaps{background:var(--deep)}
.proof div{border-color:#1d2c58}
.cine-copy::before{content:"";position:absolute;inset:-70px -110px;background:radial-gradient(closest-side,rgba(7,13,32,.88),rgba(7,13,32,.55) 62%,transparent);z-index:-1;pointer-events:none}
.cine-copy{isolation:isolate}

/* ===== promise band, numbers hub, network backgrounds ===== */
canvas.net{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.promise{position:relative;background:var(--deep);color:var(--cream);padding-block:clamp(64px,8vw,110px);overflow:hidden;border-top:1px solid #1d2c58}
.promise .wrap{position:relative;z-index:1}
.pr3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.pr3>div{display:grid;gap:14px;align-content:start;padding:28px;border-radius:22px;background:rgba(18,31,71,.72);border:1px solid #23346a;backdrop-filter:blur(6px)}
.pr3 h2{color:var(--cream);font-size:clamp(1.9rem,2.8vw,2.6rem)}
.pr3 em.s{color:var(--gold)}.pr3 .kick{color:var(--gold)}
.pr3 p{color:#c3c9db}
.pr3 a{color:var(--gold);font-weight:700;text-decoration:none}
.numbers{background:var(--deep);color:var(--cream);padding-block:clamp(64px,8vw,110px);border-top:1px solid #1d2c58}
.numbers h2{color:var(--cream)}.numbers em.s{color:var(--gold)}.numbers .kick{color:var(--gold)}.numbers .lede{color:#c9cede;margin-inline:auto}
.hubwrap{position:relative;height:clamp(520px,52vw,640px);display:grid;place-items:center}
.hubcard{position:relative;z-index:1;width:min(420px,92%);background:#fffdf8;color:var(--navy);border-radius:22px;padding:18px;box-shadow:0 40px 100px -30px rgba(0,0,0,.8),0 0 0 6px rgba(232,205,146,.12);display:grid;gap:12px}
.hc-top{font:700 .78rem var(--sans);color:var(--green);display:flex;gap:8px;align-items:center}
.hc-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hc-grid div{background:var(--cream);border-radius:14px;padding:12px 14px}
.hc-grid small{display:block;font-size:.76rem;color:var(--muted);font-weight:600}.hc-grid b{display:block;font:500 1.6rem/1.15 var(--serif);letter-spacing:-.02em}.hc-grid em{font-style:normal;font-size:.76rem;color:var(--green);font-weight:600}
.hc-note{background:var(--navy);color:#e3e6ef;border-radius:14px;padding:12px 14px;font-size:.9rem;line-height:1.45}
.hc-note small{display:block;color:var(--gold);font-weight:700;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px}
.numrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
.numrow div{border-top:2px solid var(--gold);padding-top:16px}
.numrow b{display:block;font:400 2.6rem/1 var(--serif);color:var(--gold)}.numrow span{color:#c9cede;font-size:.95rem}
.netbg{position:relative;overflow:hidden}.netbg>.wrap{position:relative;z-index:1}
.cta.solo{position:relative;overflow:hidden}.cta.solo .tx{position:relative;z-index:1}
.aghero{background:var(--deep);color:var(--cream);padding-block:clamp(56px,7vw,96px) clamp(30px,4vw,50px);overflow:hidden}
.aghero h1{color:var(--cream)}.aghero em.s{color:var(--gold)}.aghero .kick{color:var(--gold)}.aghero .lede{color:#c9cede;margin-inline:auto}
.aghero .row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.aghero .btn.sec{border-color:#3a4a78;color:var(--cream)}
.hubcard.coo{width:min(340px,86%)}
.hc-big{font:400 1.45rem/1.25 var(--serif);letter-spacing:-.015em}
.hc-sub{color:var(--text);font-size:.92rem}
.hc-btns{display:flex;gap:8px}.hc-btns span{background:var(--navy);color:var(--cream);border-radius:10px;padding:8px 14px;font-weight:700;font-size:.86rem}.hc-btns span.o{background:var(--cream);color:var(--navy)}
@media (max-width:900px){
  .pr3{grid-template-columns:1fr}
  .hubwrap{height:auto;padding-block:20px}
  .hubwrap canvas.net{display:none}
  .numrow{grid-template-columns:1fr}
}
.hubchips{display:none}
@media (max-width:900px){.hubchips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:18px;order:2}.hubchips span{border:1px solid rgba(232,205,146,.5);color:#efe6d2;border-radius:999px;padding:6px 11px;font-size:.8rem;font-weight:600}.hubwrap{display:flex;flex-direction:column;align-items:center}}

/* ===== C concept: gold-ringed monogram, serif name, spaced capitals ===== */
.logo{gap:12px;font-weight:400}
.logo .lmono{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--gold);display:grid;place-items:center;font:italic 400 1.1rem/1 var(--serif);color:var(--gold-ink);flex:none;padding-bottom:2px}
.logo .lname{font:400 1.42rem/1 var(--serif);letter-spacing:-.005em;color:var(--navy)}
.logo .lstudio{font:600 .64rem/1 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--muted);padding-top:3px}
footer .logo .lname{color:var(--cream)}footer .logo .lmono{color:var(--gold)}footer .logo .lstudio{color:#9aa3bd}
@media (max-width:420px){.logo .lstudio{display:none}}
/* typography follows the monogram: serif for every title, spaced caps for labels, light clean sans for reading */
h3,.agc h3,.step h3,.svcard h3,.tier h3,.vals h3,.ctrl h3,.co b,.chap-det h3{font-family:var(--serif);font-weight:500;letter-spacing:-.01em}
h3{font-size:clamp(1.35rem,2vw,1.65rem)}
.agc h3{font-size:1.35rem}
.co b{font-size:1.2rem}
.kick,.who,.nm,.when,.n,.tag2{letter-spacing:.2em!important}
.nav{font-weight:500;letter-spacing:.01em}
.btn{font-weight:600;letter-spacing:.01em}
.pr3 h2{font-weight:400}
.hc-grid b,.metrics b,.kpis b{font-family:var(--serif);font-weight:500}
/* photo of Maria */
.me{margin:0 0 18px;width:min(320px,100%);aspect-ratio:4/5;border-radius:24px;overflow:hidden;box-shadow:0 30px 70px -36px rgba(10,21,48,.6);position:relative}
.me img{width:100%;height:100%;object-fit:cover;display:block}
.me::after{content:"";position:absolute;inset:10px;border:1px solid rgba(207,174,110,.6);border-radius:16px;pointer-events:none}
.me-n{font:400 1.6rem var(--serif)}
.founder{background:var(--paper);padding-block:clamp(64px,8vw,110px)}
.fgrid2{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:center}
.me.big{width:100%;max-width:440px;margin:0}
.founder blockquote{margin:16px 0 0;font:400 clamp(1.8rem,3.4vw,2.8rem)/1.15 var(--serif);letter-spacing:-.015em;color:var(--navy)}
.fsig{margin-top:18px;color:var(--muted)}.fsig b{color:var(--navy)}
.creds{list-style:none;margin:22px 0 26px;padding:0;display:grid;gap:10px;color:var(--text)}
.creds li{padding-left:22px;position:relative}.creds li::before{content:"";position:absolute;left:0;top:.6em;width:10px;height:10px;border-radius:50%;border:1.5px solid var(--gold)}
.creds b{color:var(--navy)}
@media (max-width:860px){.fgrid2{grid-template-columns:1fr}.me.big{max-width:340px}}
/* chat avatar */
i.av{width:32px;height:32px;border-radius:50%;overflow:hidden;display:block;border:1.5px solid var(--gold);background:var(--navy);padding:0}
i.av img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.cp-h i.av{width:40px;height:40px}
/* phones: show the phone version of the agency overview, big and readable */
.mobduo,.mobhero{display:none}
@media (max-width:760px){
  #northstar .chap-stage,#northstar .thumbs{display:none}
  .mobduo{display:grid;grid-template-columns:1fr;gap:22px;justify-items:center}
  .mobduo .phn{width:min(330px,88%)}
  .mobhero{display:flex;justify-content:center;margin-top:-30px;position:relative;z-index:2}
  .mobhero .phn{width:min(320px,86%)}
  .cine .stage3d{display:none}
}

/* ===== strategic partner ===== */
.strat{background:var(--deep);color:var(--cream);padding-block:clamp(70px,9vw,120px);border-top:1px solid #1d2c58}
.strat h2{color:var(--cream)}.strat em.s{color:var(--gold)}.strat .kick{color:var(--gold)}.strat .lede{color:#c9cede;margin-inline:auto}
.signals{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:-10px auto 34px;max-width:900px}
.signals span{font:600 .8rem var(--sans);color:#b9c3e0;border:1px solid #2a3b6b;border-radius:999px;padding:7px 12px;background:rgba(18,31,71,.7);animation:sig 4s ease-in-out infinite}
.signals span:nth-child(2n){animation-delay:.7s}.signals span:nth-child(3n){animation-delay:1.4s}
@keyframes sig{50%{border-color:rgba(232,205,146,.7);color:#f1e3c2}}
.recs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;position:relative}
.recs::before{content:"";position:absolute;left:8%;right:8%;top:-22px;height:22px;border:1px solid rgba(232,205,146,.35);border-bottom:0;border-radius:14px 14px 0 0}
.rec{background:#fffdf8;color:var(--navy);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:10px;box-shadow:0 40px 80px -40px rgba(0,0,0,.8);border-top:4px solid var(--c)}
.rec .tag{align-self:flex-start;font:700 .7rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--c);background:color-mix(in srgb,var(--c) 12%,white);border-radius:999px;padding:5px 10px}
.rec h3{font-size:1.45rem}
.rec p{color:var(--text);font-size:.94rem;flex:1}
.rec b{font:400 2rem/1 var(--serif);color:var(--c)}.rec b small{font:600 .8rem var(--sans);color:var(--muted);margin-left:4px}
.rec.up{--c:#2f7a4f}.rec.push{--c:#2b5fb4}.rec.hold{--c:#b4442f}.rec.star{--c:#a07a2c;background:linear-gradient(160deg,#fff8e6,#fffdf8)}
.strat-foot{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:36px;padding-top:28px;border-top:1px solid #23346a}
.strat-foot p{font:400 clamp(1.4rem,2.4vw,1.9rem)/1.2 var(--serif);color:var(--cream);max-width:30ch}
@media (max-width:1000px){.recs{grid-template-columns:1fr 1fr}.recs::before{display:none}}
@media (max-width:560px){.recs{grid-template-columns:1fr}}
.slstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:clamp(28px,4vw,48px)}
.slstats div{border-top:2px solid var(--gold);padding-top:14px}
.slstats b{display:block;font:400 clamp(2rem,3.4vw,3rem)/1 var(--serif);color:var(--gold)}
.slstats span{color:#c9cede;font-size:.92rem}
.pstage.two{grid-template-columns:minmax(0,.9fr) minmax(220px,300px) minmax(220px,300px) minmax(0,.9fr);gap:clamp(16px,2.4vw,32px)}
@media (max-width:900px){.slstats{grid-template-columns:1fr 1fr}.pstage.two{grid-template-columns:1fr}.pstage.two .phn.big{max-width:320px;margin:0 auto;order:-1}}
/* phones: desktop stays as the backdrop, the phone screen sits on top as the focus */
@media (max-width:760px){
  #northstar .chap-stage{display:block}
  #northstar .chap-stage .phn.fl-r{display:none}
  #northstar .chap-stage .bf{opacity:.85;transform:scale(.96);transform-origin:top center}
  .mobduo{margin-top:-30%;position:relative;z-index:2}
  .mobduo .phn{width:min(300px,80%);box-shadow:0 40px 80px -20px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.12)}
  .mobhero{display:block;position:relative;margin-top:-20px;padding-bottom:10px}
  .mobhero .bf{opacity:.85;transform:scale(.96)}
  .mobhero .phn{width:min(270px,72%);margin:-34% auto 0;position:relative;z-index:2;box-shadow:0 40px 80px -20px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.12)}
}
.chip.c2{display:flex}.chip.c2 b{font-size:inherit;color:inherit;letter-spacing:0}
/* every project: desktop main, phone floating, row of screens (Lumen layout) */
.thumbs a.pt{background:#e9e3d6}
.thumbs a.pt img{object-fit:contain;object-position:center;padding:10px 0}
.tilt .phn.hr{right:-4%;width:22%}
@media (max-width:760px){
  .mobduo{display:none!important}
  #northstar .chap-stage .phn.fl-r{display:block}
  .chap-stage .bf{opacity:.85;transform:scale(.96);transform-origin:top center}
  .chap-stage .phn.fl-r{position:relative;right:auto;bottom:auto;width:min(290px,78%);margin:-30% auto 0;z-index:2;box-shadow:0 40px 80px -20px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.12)}
}
.thumbs.two{grid-template-columns:1fr 1fr}.thumbs.two a.tall{aspect-ratio:16/10}@media (max-width:900px){.thumbs.two{grid-template-columns:1fr 1fr}}
/* COO chat: own class names so other components' styles can't leak in */
.chatwin .cwbar{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);background:var(--white)}
.chatwin .cwbar i{width:42px;height:42px;border-radius:12px;background:var(--navy);color:var(--gold);display:grid;place-items:center;font:700 .74rem var(--sans);letter-spacing:.04em;font-style:normal;flex:none}
.chatwin .cwbar b{display:block}.chatwin .cwbar small{color:var(--muted);font-size:.8rem;display:flex;gap:6px;align-items:center}
.bub.cwcard{padding:0;overflow:hidden;max-width:86%;align-self:flex-start;background:var(--white)}
.cwh{background:var(--navy);color:var(--gold);font:700 .72rem var(--sans);letter-spacing:.08em;padding:9px 14px}
.cwb{padding:11px 14px;font-size:.92rem;line-height:1.45;color:var(--navy)}
.chatwin .msgs{height:460px}

/* ===== project showcase, v3: one grid, one rhythm ===== */
.chap{padding-block:clamp(72px,8vw,120px)}
.chap+.chap{border-top:1px solid #1a2852}
.ch-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(36px,4vw,56px)}
.ch-l{display:grid;gap:12px;justify-items:start}
.ch-l .num{font:italic 400 1.1rem/1 var(--serif);color:var(--gold);letter-spacing:.04em}
.ch-l .who{font:700 .74rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#b9a77d}
.ch-l h3{font:400 clamp(2.4rem,4.4vw,3.8rem)/1 var(--serif);letter-spacing:-.025em;color:var(--cream);margin:2px 0 4px}
.ch-l p{color:#c3c9db;font-size:1.05rem;max-width:52ch;margin-bottom:10px}
.ch-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid #2a3b6b}
.ch-stats div{padding:18px 16px 4px 0;display:grid;gap:6px}
.ch-stats div+div{padding-left:18px;border-left:1px solid #1d2c58}
.ch-stats b{font:400 clamp(1.7rem,2.6vw,2.3rem)/1 var(--serif);color:var(--gold);letter-spacing:-.01em}
.ch-stats span{color:#9fa8c2;font-size:.86rem;line-height:1.35}
.ch-stage{position:relative;padding-right:clamp(0px,9vw,140px)}
.ch-stage .bf{border-radius:14px}
.ch-stage .ch-ph{position:absolute;right:0;bottom:-48px;width:clamp(180px,20%,262px);border-radius:40px}
.ch-stage .ch-ph img{border-radius:32px}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);margin-top:clamp(72px,7vw,96px)}
.tile{display:grid;gap:8px;text-decoration:none;color:inherit;align-content:start}
.timg{aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 24px 50px -28px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.06);margin-bottom:8px}
.timg img{width:100%;height:100%;object-fit:cover;object-position:left top;display:block;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.tile:hover .timg img{transform:scale(1.035)}
.timg.tph{background:linear-gradient(160deg,#1a2a58,#0a1530)}
.timg.tph img{object-fit:contain;object-position:center;padding:14px 0}
.tile b{font:400 1.3rem var(--serif);color:var(--cream)}
.tile span{color:#9fa8c2;font-size:.92rem}
.tile b::after{content:" →";color:var(--gold);font-family:var(--sans);font-size:1rem;opacity:0;transition:opacity .2s}
.tile:hover b::after{opacity:1}
.chap-det{margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:1px solid #1d2c58;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,4vw,48px)}
.chap-det .prob{grid-column:auto}
@media (max-width:900px){
  .ch-head{grid-template-columns:1fr;align-items:start}
  .ch-stage{padding-right:0}
  .ch-stage .bf{opacity:.85;transform:scale(.96);transform-origin:top center}
  .ch-stage .ch-ph{position:relative;right:auto;bottom:auto;width:min(280px,76%);margin:-30% auto 0;z-index:2;box-shadow:0 40px 80px -20px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.12)}
  .tiles{grid-template-columns:1fr;margin-top:40px;gap:28px}
  .chap-det{grid-template-columns:1fr}
}
@media (max-width:420px){.ch-stats span{font-size:.78rem}.ch-stats div+div{padding-left:12px}}
.timg.tph{background:#f4f2ee}
.timg.tph img{object-fit:cover;object-position:50% 12%;padding:0}
@media (max-width:900px){
  .tiles{grid-auto-flow:column;grid-auto-columns:82%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;margin-inline:calc(-1*max(16px,env(safe-area-inset-left,0px)));padding:0 max(16px,env(safe-area-inset-left,0px)) 10px;scrollbar-width:none}
  .tiles::-webkit-scrollbar{display:none}
  .tile{scroll-snap-align:start}
}
.trust2{background:var(--paper);padding-block:clamp(70px,9vw,120px)}
.trust2 .lede{margin-inline:auto}
.tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line)}
.tgrid>div{padding:30px 28px 30px 0;display:grid;gap:10px;align-content:start;border-bottom:1px solid var(--line)}
.tgrid>div:not(:nth-child(3n+1)){padding-left:28px;border-left:1px solid var(--line)}
.ti{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--gold);display:grid;place-items:center;color:var(--gold-ink)}
.ti svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tgrid h3{font-size:1.4rem}.tgrid p{color:var(--text);font-size:.95rem}
.tproof{text-align:center;margin-top:30px;font:400 1.3rem var(--serif);color:var(--navy)}.tproof b{color:var(--gold-ink);font-weight:500}
@media (max-width:900px){.tgrid{grid-template-columns:1fr}.tgrid>div,.tgrid>div:not(:nth-child(3n+1)){padding:24px 0;border-left:0}}
@media (min-width:901px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.tiles{scroll-padding-inline:16px}.tiles>.tile{scroll-snap-align:start}}
.morework{background:rgb(11,22,52);color:#e9e4d8}.morework .wrap{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding-block:0 clamp(64px,8vw,110px)}
.morework p{opacity:.75;margin:0}
.chaps .chap:last-child{padding-bottom:clamp(40px,4vw,56px)}
/* interactive networks: sections that carry one keep content above the canvas */
.netbg{position:relative;overflow:hidden}.netbg>*:not(canvas.net){position:relative;z-index:1}
/* neural thread: scroll map on the right edge */
.nthread{position:fixed;right:22px;top:50%;transform:translateY(-50%);height:min(56vh,460px);width:14px;z-index:40;opacity:0;pointer-events:none;transition:opacity .4s}
.nthread.show{opacity:1;pointer-events:auto}
.nt-line{position:absolute;left:6px;top:0;bottom:0;width:2px;background:rgba(150,170,225,.25);border-radius:2px;overflow:hidden}
.nt-line b{position:absolute;left:0;top:0;width:100%;background:linear-gradient(#e8cd92,#cfae6e);box-shadow:0 0 10px #e8cd92;height:0}
.nthread button{position:absolute;left:0;width:14px;height:14px;margin-top:-7px;border-radius:50%;border:2px solid rgba(150,170,225,.6);background:#0a1530;padding:0;cursor:pointer;transition:transform .25s,background .25s,border-color .25s,box-shadow .25s}
.nthread button.past{border-color:#cfae6e;background:#cfae6e}
.nthread button.on{border-color:#e8cd92;background:#e8cd92;transform:scale(1.35);box-shadow:0 0 0 5px rgba(232,205,146,.18),0 0 14px rgba(232,205,146,.8)}
.nthread button span{position:absolute;right:24px;top:50%;transform:translate(6px,-50%);white-space:nowrap;font:600 12.5px Figtree,system-ui,sans-serif;color:#efe6d2;background:rgba(13,24,56,.94);border:1px solid rgba(232,205,146,.45);padding:5px 11px;border-radius:999px;opacity:0;pointer-events:none;transition:.2s}
.nthread button:hover span,.nthread button:focus-visible span{opacity:1;transform:translate(0,-50%)}
@media (max-width:1100px){.nthread{display:none}}
.hubwrap{cursor:default}
/* who it's for */
.fitfor{background:var(--cream,#f6f1e7);color:var(--ink,#0a1530);padding-block:clamp(72px,9vw,128px)}
.fitfor .head{text-align:center;max-width:860px;margin:0 auto clamp(40px,5vw,64px)}
.who-feat{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(28px,4vw,56px);align-items:center;margin-bottom:clamp(56px,7vw,96px)}
.who-shot .bf{box-shadow:0 30px 70px -30px rgba(10,21,48,.45)}
.tagx{display:inline-block;font:700 11.5px/1 Figtree,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9a7430}
.who-copy h3{font-family:Newsreader,serif;font-weight:400;font-size:clamp(26px,2.6vw,36px);line-height:1.15;margin:12px 0 20px}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}.ba div{border-radius:14px;padding:14px 16px;background:#fff;border:1px solid #e6dfd3}.ba div+div{background:#0a1530;color:#efe6d2;border-color:#0a1530}
.ba small{font:700 11px Figtree;letter-spacing:.12em;text-transform:uppercase;opacity:.65}.ba p{margin:6px 0 0;font-size:15px;line-height:1.45}
.wins{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:10px}.wins li{padding-left:22px;position:relative;line-height:1.45}.wins li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;border-radius:50%;background:#cfae6e;box-shadow:0 0 0 4px rgba(207,174,110,.2)}
.who-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.wcard{background:#fff;border:1px solid #e6dfd3;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.wcard:hover{transform:translateY(-4px);box-shadow:0 24px 50px -28px rgba(10,21,48,.45)}
.wimg{aspect-ratio:16/10;overflow:hidden;background:#eee7dc}.wimg img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block;transition:transform .6s}.wcard:hover .wimg img{transform:scale(1.04)}
.wbody{padding:18px 20px 22px}.wbody h4{font-family:Newsreader,serif;font-weight:400;font-size:24px;margin:8px 0 8px;line-height:1.15}
.wbody .pain{color:#55607a;font-size:15px;line-height:1.45;margin:0 0 10px}.wbody .win{font-size:15px;line-height:1.45;margin:0}.wbody .win b{color:#9a7430}
@media (max-width:900px){.who-feat{grid-template-columns:1fr}.ba{grid-template-columns:1fr}
 .who-grid{grid-auto-flow:column;grid-auto-columns:84%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin-inline:-16px;padding:0 16px 10px;scrollbar-width:none}.who-grid::-webkit-scrollbar{display:none}.wcard{scroll-snap-align:start}}
/* hero: customer phone left, owner phone right */
.tilt .phn.hl,.tilt .phn.hr{width:23%;bottom:-10%}.tilt .phn.hl{left:-5%;display:block}.tilt .phn.hr{right:-5%}
.phn{position:relative}.phn img{border-radius:36px;display:block;width:100%}
.phcap{position:absolute;left:50%;top:-38px;transform:translateX(-50%);white-space:nowrap;font:600 13px Figtree,sans-serif;color:#0a1530;background:#e8cd92;padding:6px 13px;border-radius:999px;box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
.agstage .phcap,.chap .phcap{display:none}
@media (max-width:900px){
 .mobhero .duo2{display:flex;justify-content:center;gap:10px;margin:-38% auto 0;position:relative;z-index:2;padding:0 6px}
 .mobhero .duo2 .phn{width:47%;margin:0;border-radius:30px;padding:6px}.mobhero .duo2 .phn img{border-radius:25px}
 .mobhero .duo2 .phn:last-child{transform:translateY(26px)}
 .mobhero .phcap{font-size:11px;top:-30px;padding:5px 10px}
}
/* hero, desktop: dashboard centered, a phone on each side with room to breathe */
@media (min-width:901px){
 .cine .tilt{max-width:1280px;padding:0 0 4%}
 .cine .tilt .hero-main{width:74%;margin:0 auto}
 .cine .tilt .phn.hl,.cine .tilt .phn.hr{display:block;width:19.5%;bottom:0;top:auto;padding:7px;border-radius:38px}
 .cine .tilt .phn.hl{left:0;right:auto}.cine .tilt .phn.hr{right:0;left:auto}
 .cine .tilt .phn img{border-radius:31px}
 .cine .tilt .phcap{top:-44px;font-size:13.5px;padding:7px 15px}
 .cine .tilt .chip{display:none}
 .cine .tilt .glow{inset:0 18% 25%}
}
@media (min-width:901px) and (max-width:1180px){.cine .tilt .hero-main{width:70%}.cine .tilt .phn.hl,.cine .tilt .phn.hr{width:21%}.cine .tilt .phcap{font-size:12px}}
@media (min-width:901px){.cine .tilt{padding-bottom:7%}.cine .tilt .phn.hl,.cine .tilt .phn.hr{bottom:5%}.cine .tilt .phcap{top:auto;bottom:-50px}}
@media (min-width:901px){.cine .stage3d{padding-bottom:84px}.cine .tilt .phn.hl,.cine .tilt .phn.hr{bottom:0}.cine .tilt{padding-bottom:3%}}
/* spacing pass: trim doubled gaps between neighbouring sections */
.trust2{padding-bottom:clamp(48px,5vw,72px)}
.trust2 + .sec{padding-top:clamp(56px,6vw,84px)}
#work.cine-sec{padding-bottom:0}
#work + .chaps > .chap:first-child{padding-top:clamp(40px,4vw,64px);border-top:0}
.ab .body .ab-lead{font-family:Newsreader,serif;font-size:clamp(24px,2.4vw,32px);line-height:1.25;color:var(--navy,#0a1530);margin-bottom:6px}
.ab-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0 26px}
.ab-facts div{border-top:2px solid #cfae6e;padding-top:12px}.ab-facts b{display:block;font-family:Newsreader,serif;font-weight:400;font-size:30px;color:#9a7430;line-height:1.1}.ab-facts span{font-size:14px;color:#55607a;line-height:1.4;display:block;margin-top:4px}
@media (max-width:600px){.ab-facts{grid-template-columns:1fr}}
@media (min-width:901px){.ab>div:first-child{position:sticky;top:110px;align-self:start}}
/* hero up to 900px: always the stacked phone layout, nothing hangs off the edge */
@media (max-width:900px){
 .cine .stage3d{display:none}
 .mobhero{display:block;position:relative;margin-top:-20px;padding-bottom:48px;max-width:680px;margin-inline:auto}
 .mobhero .bf{opacity:.85;transform:scale(.96)}
 .mobhero .duo2{display:flex;justify-content:center;gap:10px;margin:-38% auto 0;position:relative;z-index:2;padding:0 6px}
 .mobhero .duo2 .phn{width:47%;max-width:300px;margin:0;border-radius:30px;padding:6px}
 .mobhero .duo2 .phn img{border-radius:25px}
 .mobhero .duo2 .phn:last-child{transform:translateY(26px)}
 .mobhero .phcap{font-size:11px;top:-30px;padding:5px 10px}
}
@media (min-width:600px) and (max-width:900px){.mobhero .duo2{margin-top:-30%}.mobhero .phcap{font-size:12.5px;top:-36px}}
/* pricing: five tiers, four home cards */
.tiers{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1240px){.tiers{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.tiers{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.tiers{grid-template-columns:1fr}}
.pt{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1060px){.pt{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pt{grid-template-columns:1fr}}
.tier li,.plan li{display:block;position:relative;padding-left:20px}.tier li::before,.plan li::before{position:absolute;left:0;top:0}
.wcard,.wcard:hover{transform:none!important}.wcard{transition:box-shadow .3s}
.cine .lede2{margin:10px 0 0;font-size:.95rem;letter-spacing:.02em;color:#cfae6e;font-weight:600}
/* language switch */
.langsw{display:inline-flex;border:1px solid var(--line-2);border-radius:10px;overflow:hidden;min-height:40px;margin-right:2px}
.langsw button{border:0;background:transparent;font:700 .8rem var(--sans);letter-spacing:.06em;color:var(--navy);padding:0 11px;cursor:pointer;min-width:40px}
.langsw button[aria-pressed="true"]{background:var(--navy);color:#f4ecdc}
@media (max-width:900px){.langsw{min-height:36px;margin-left:auto;margin-right:8px}.langsw button{padding:0 9px;min-width:34px}}
.netbg.iris-wrap>#iris{position:absolute;z-index:0}.netbg.iris-wrap>canvas.net{z-index:0;opacity:.9}
html[lang=es] .cine h1{font-size:clamp(2.4rem,6vw,5rem)}
html[lang=es] .tier .btn{white-space:normal;padding-inline:10px;font-size:.88rem}
.iris-tags span:nth-child(2),.iris-tags span:nth-child(3){display:none}
@media (max-width:600px){.btn{white-space:normal;text-align:center}}
/* kickers that wrap (longer Spanish labels): keep the dash on the first line and give lines room */
.kick{line-height:1.4;align-items:flex-start;max-width:100%}
.kick::before{flex:none;margin-top:.62em}
.head[style*="center"] .kick,.fitfor .head .kick,.cine .kick,.cta .kick{justify-content:center}
.tag2{white-space:normal;line-height:1.35;letter-spacing:.06em}
@media (max-width:600px){.cine .kick::before,.cta .kick::before{display:none}}
.kick{text-wrap:balance}
.agc .agname{display:block;font:700 .72rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);margin:-4px 0 8px}
.agc.feat .agname{color:var(--gold)}
/* light sections: keep the network as texture, not noise behind body copy */
.netbg.netlight>canvas.net{opacity:.38;-webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 45%,transparent 0,#000 75%);mask-image:radial-gradient(ellipse 60% 55% at 50% 45%,rgba(0,0,0,.25) 0,#000 80%)}

/* richer metallic gold on the main buttons; slimmer header */
.btn.gold{background:linear-gradient(135deg,#ecd49c 0%,#cfae6e 48%,#b9945a 100%);color:#0a1530;box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 6px 18px rgba(207,174,110,.22)}
.top .wrap{min-height:56px;gap:20px}
.logo .lmono{width:32px;height:32px;font-size:.98rem}
.logo .lname{font-size:1.12rem}
.top .btn.sm{padding-top:8px;padding-bottom:8px}
.top .askbtn,.top .langsw button{padding-top:6px;padding-bottom:6px}

/* ---------- scrollable phones: each phone shows a full-length screen you can scroll inside ---------- */
.phn{position:relative}
.phn .phs{aspect-ratio:390/844;overflow-y:auto;overflow-x:hidden;border-radius:36px;background:#f4f0e8;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:none}
.phn .phs::-webkit-scrollbar{display:none}
.phn .phs img{border-radius:0!important;display:block;width:100%;height:auto}
.phn .phs:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.phn .phnav{position:absolute;left:9px;right:9px;bottom:9px;border-radius:0 0 36px 36px;overflow:hidden;pointer-events:none}
.phn .phnav img{border-radius:0!important;display:block;width:100%}
.phn .phhint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);background:rgba(10,21,48,.82);color:#fff;font-size:11.5px;font-weight:600;letter-spacing:.02em;padding:6px 11px;border-radius:99px;pointer-events:none;opacity:0;transition:opacity .4s;white-space:nowrap;z-index:2}
.phn.hinting .phhint{opacity:1}
.phn.has-nav .phhint{bottom:62px}
.cine .tilt .phn .phs{border-radius:31px}
.mobhero .duo2 .phn .phs{border-radius:25px}
.mobhero .duo2 .phn .phnav{left:6px;right:6px;bottom:6px;border-radius:0 0 25px 25px}

/* ---------- Profit showcase: a live phone of a sample business. Everything here is scoped to .pshow. ---------- */
.pshow{background:var(--paper);padding-block:clamp(72px,10vw,128px)}
.pshow .ps-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,80px);align-items:center}
.pshow .ps-copy{display:grid;gap:20px;justify-items:start}
.pshow .ps-copy .btn{margin-top:8px}
.pshow .ps-stage{display:grid;justify-items:center;gap:26px;padding-top:44px}
.pshow .ps-phone{width:min(360px,100%)}
.pshow .ps-screen{aspect-ratio:390/780;overflow-y:auto;overflow-x:hidden;border-radius:36px;background:var(--cream);padding:18px 14px 22px;scrollbar-width:none;font-family:var(--sans);color:var(--navy);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.pshow .ps-screen::-webkit-scrollbar{display:none}
.pshow .ps-screen:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.pshow .ps-top{display:flex;align-items:center;gap:10px;padding:6px 4px 14px}
.pshow .ps-top b{display:block;font-size:15px;line-height:1.2}
.pshow .ps-top small{font-size:12px;color:var(--muted);font-weight:600}
.pshow .ps-mark{flex:none;width:32px;height:32px;border-radius:10px;background:var(--navy);color:var(--gold);display:grid;place-items:center;font:italic 500 18px var(--serif)}
.pshow .ps-found{background:var(--green-soft);border:1px solid color-mix(in srgb,var(--green) 22%,transparent);border-radius:20px;padding:16px}
.pshow .ps-lab{font-size:12px;font-weight:700;color:color-mix(in srgb,var(--green) 72%,#333);line-height:1.3}
.pshow .ps-row{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;margin-top:6px}
.pshow .ps-big{font:500 40px/1 var(--serif);letter-spacing:-.03em;color:var(--green)}
.pshow .ps-sub{margin-top:6px;font-size:12.5px;font-weight:600;color:color-mix(in srgb,var(--green) 72%,#333)}
.pshow .ps-vs{text-align:right;flex:none}
.pshow .ps-vs b{display:block;font:600 16px/1.2 var(--serif);color:var(--navy);margin-bottom:4px}
.pshow .ps-vs b.g{color:var(--green);margin-bottom:0}
.pshow .ps-chart{display:block;width:100%;height:auto;margin-top:12px}
.pshow .ps-key{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;font-weight:600;color:var(--muted);margin:6px 0 2px}
.pshow .ps-key i{display:inline-block;width:14px;height:0;border-top:2.5px solid var(--navy);vertical-align:middle;margin-right:5px;opacity:.75}
.pshow .ps-key i.a{border-top-style:dashed;opacity:.4}
.pshow .ps-key i.w{border-color:var(--green);opacity:1;border-top-width:3px}
.pshow .ps-pips{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-top:12px}
.pshow .ps-pips i{height:26px;border-radius:7px;border:1.5px dashed color-mix(in srgb,var(--green) 38%,transparent);display:grid;place-items:center;color:var(--green)}
.pshow .ps-pips i.o{background:var(--green);border:0}
.pshow .ps-pips svg{width:11px;height:11px;opacity:.6}
.pshow .ps-legend{display:flex;justify-content:space-between;gap:6px;margin-top:8px;font-size:11px;white-space:nowrap;font-weight:600;color:color-mix(in srgb,var(--green) 72%,#333)}
.pshow .ps-legend b{color:var(--green)}
.pshow .ps-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:20px 4px 10px}
.pshow .ps-h h5{margin:0;font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--navy)}
.pshow .ps-h span{font-size:12px;font-weight:600;color:var(--muted)}
.pshow .ps-fix{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:14px;transition:opacity .2s}
.pshow .ps-fix+.ps-fix{margin-top:10px}
.pshow .ps-fix.done{opacity:.72}
.pshow .ps-cat{font-size:11.5px;font-weight:700;color:var(--muted)}
.pshow .ps-r1{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-top:4px}
.pshow .ps-r1 h4{font-size:15px;font-weight:800;line-height:1.25;letter-spacing:-.005em}
.pshow .ps-amt{text-align:right;flex:none}
.pshow .ps-amt b{display:block;font:600 20px/1 var(--serif);color:var(--green)}
.pshow .ps-amt small{font-size:11px;color:var(--muted);font-weight:600}
.pshow .ps-seen{display:inline-flex;align-items:center;gap:6px;margin-top:10px;max-width:100%;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:600;background:var(--green-soft);color:var(--green)}
.pshow .ps-btns{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:7px;margin-top:12px}
.pshow .ps-btns[hidden]{display:none}
.pshow .ps-btns button{border:1px solid var(--line);background:var(--white);border-radius:11px;padding:10px 6px;font:700 13px var(--sans);color:var(--navy);cursor:pointer}
.pshow .ps-btns button.ok{background:var(--green);border-color:var(--green);color:#fff;font-weight:800}
.pshow .ps-state{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:13px;font-weight:700;color:var(--green)}
.pshow .ps-state[hidden]{display:none}
.pshow .ps-undo{background:none;border:0;padding:4px 0;font:700 12.5px var(--sans);color:var(--muted);text-decoration:underline;cursor:pointer}
.pshow .ps-lockbox{background:var(--cream-2);border-radius:18px;padding:6px;margin-top:10px}
.pshow .ps-lkh{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted);padding:8px 10px 2px}
.pshow .ps-lk{display:flex;gap:10px;align-items:center;padding:10px 8px;border-bottom:1px solid var(--line)}
.pshow .ps-lk:last-of-type{border-bottom:0}
.pshow .ps-lk .ic{flex:none;width:28px;height:28px;border-radius:9px;background:var(--white);display:grid;place-items:center;color:var(--muted)}
.pshow .ps-lk .t{flex:1;min-width:0}
.pshow .ps-lk .t b{display:block;font-size:13.5px;line-height:1.25}
.pshow .ps-lk .t small{font-size:11.5px;color:var(--muted);font-weight:600}
.pshow .ps-lk .amt{text-align:right;flex:none;font-weight:800;font-size:12.5px;color:var(--green)}
.pshow .ps-lk .amt small{display:block;font-size:10.5px;color:var(--muted);font-weight:600}
.pshow .ps-ghosts{display:grid;gap:8px;padding:6px 8px 10px;filter:blur(3px);opacity:.55}
.pshow .ps-ghosts div{display:flex;justify-content:space-between}
.pshow .ps-ghosts i{display:block;height:10px;border-radius:5px;background:var(--line-2)}
.pshow .ps-foot{margin:16px 0 0;text-align:center;font-size:11.5px;color:var(--muted)}
.pshow .ps-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:520px}
.pshow .ps-chips li{background:var(--white);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:.88rem;color:var(--text);line-height:1.3;text-align:center}
.pshow .ps-chips b{color:var(--green)}
@media (max-width:900px){.pshow .ps-grid{grid-template-columns:1fr}.pshow .ps-stage{padding-top:40px}.pshow .ps-phone{width:min(330px,88%)}}

/* Founder strip in the profit showcase */
.pshow .ps-me{display:flex;gap:16px;align-items:flex-start;margin-top:30px;padding-top:24px;border-top:1px solid var(--line,rgba(16,24,48,.12));max-width:520px}
.pshow .ps-me img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 3px rgba(198,160,92,.35)}
.pshow .ps-me-n{margin:0;display:flex;flex-direction:column;gap:2px}
.pshow .ps-me-n b{font-size:16px}
.pshow .ps-me-n span{font-size:13px;color:var(--muted,#5b6275);letter-spacing:.01em}
.pshow .ps-me-q{margin:10px 0 0;font-size:15px;line-height:1.5;font-style:italic}
.pshow .ps-me-c{margin:8px 0 0;font-size:12.5px;font-weight:600;color:var(--gold-ink,#8a6a2f);letter-spacing:.04em;text-transform:uppercase}
@media (max-width:640px){.pshow .ps-me img{width:54px;height:54px}.pshow .ps-me-q{font-size:14.5px}}

/* Owner + customer phones, shown with context after the AI team (Nov 8) */
.duoctx .duoph{display:flex;justify-content:center;gap:clamp(16px,4vw,48px);margin-top:clamp(28px,4vw,48px);flex-wrap:wrap}
.duoctx .duoph .phn{position:relative;width:min(280px,44%);margin:0;padding:7px;border-radius:38px}
.duoctx .duoph .phn:last-child{transform:translateY(28px)}
.duoctx .phcap{position:absolute;top:-30px;left:0;right:0;text-align:center}
@media (max-width:600px){.duoctx .duoph{gap:10px}.duoctx .duoph .phn{width:47%;padding:5px;border-radius:28px}.duoctx .duoph .phn:last-child{transform:translateY(20px)}}

/* ===== Home story (Nov 8): hero without the dashboard, then the owner's pain ===== */
.cine .iris-wrap{height:min(100svh,880px);min-height:640px}
@media (max-width:900px){.cine .iris-wrap{min-height:calc(100svh - 64px);padding-block:80px 96px}}
.iris-cue{position:absolute;left:50%;bottom:clamp(28px,5vh,52px);translate:-50% 0;z-index:3;width:30px;height:48px;border-radius:16px;border:1.5px solid rgba(207,174,110,.6);display:grid;justify-items:center;padding-top:9px}
.iris-cue span{width:3px;height:9px;border-radius:2px;background:var(--gold);animation:cue 1.8s ease-in-out infinite}
@keyframes cue{0%{transform:translateY(0);opacity:1}70%{transform:translateY(14px);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.iris-cue span{animation:none}}

.ownerpain{background:var(--cream);padding-block:clamp(72px,9vw,120px) clamp(64px,8vw,104px)}
.ownerpain .head{margin-bottom:clamp(32px,4vw,52px)}
.pain3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px)}
.pain3 article{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:clamp(22px,2.4vw,30px);display:grid;gap:12px;align-content:start}
.pain3 h3{font-size:clamp(1.35rem,1.9vw,1.6rem);line-height:1.15}
.pain3 p{margin:0;color:var(--text);font-size:.97rem}
.pv{height:86px;border-radius:14px;background:var(--cream);margin-bottom:6px;padding:14px;display:flex;align-items:center;gap:10px;font:700 12px var(--sans);color:var(--muted)}
.pv-cal i{flex:1;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--line-2) 0 62%,transparent 62% 64%,#d9b8a8 64%)}
.pv-cal .late{background:#fbeae6;color:#a8392b;padding:6px 10px;border-radius:999px;white-space:nowrap}
.pv-leak{flex-direction:column;align-items:stretch;justify-content:center;gap:6px;padding-block:10px}
.pv-leak span{display:flex;justify-content:space-between;align-items:center;line-height:1}
.pv-leak span::after{content:"";width:34%;height:6px;border-radius:3px;background:linear-gradient(90deg,#e7b9ae,#a8392b)}
.pv-leak span:nth-child(2)::after{width:22%}.pv-leak span:nth-child(3)::after{width:44%}
.pv-apps{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.pv-apps i{height:24px;border-radius:7px;background:var(--line);border:1px solid var(--line-2)}
.pv-apps i:nth-child(3n){background:var(--cream-2)}.pv-apps i:nth-child(4n){background:#e9e1cf}
.pain-turn{margin:clamp(36px,5vw,56px) auto 0;max-width:30ch;text-align:center;font:400 clamp(1.6rem,3vw,2.4rem)/1.2 var(--serif);letter-spacing:-.02em;color:var(--navy);text-wrap:balance}
@media (max-width:860px){.pain3{grid-template-columns:1fr}.pv{height:72px}}

/* Promise: head above the three cards; HOW step 4 and the pledge in pricing */
.promise .head h2{color:var(--cream)}.promise .head .lede{color:#c3c9db}.promise .head .kick{color:var(--gold)}
.step.gold{background:var(--navy);border-color:var(--navy)}
.step.gold h3{color:var(--cream)}.step.gold p{color:#c9cede}.step.gold .n{color:var(--gold)}
.pledge{margin-top:clamp(22px,3vw,32px);display:flex;gap:clamp(16px,2.4vw,26px);align-items:flex-start;background:var(--gold-soft);border:1px solid #e3cf9f;border-radius:22px;padding:clamp(22px,3vw,34px)}
.pledge .pl-ic{flex:none;width:52px;height:52px;border-radius:50%;background:var(--navy);display:grid;place-items:center}
.pledge .pl-ic svg{width:26px;height:26px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pledge .pl-q{margin:10px 0 0;font:400 clamp(1.25rem,2vw,1.6rem)/1.35 var(--serif);letter-spacing:-.01em;color:var(--navy);max-width:62ch}
.pledge .pl-sig{margin:12px 0 0;font-size:.9rem;font-weight:700;color:var(--gold-ink)}
@media (max-width:600px){.pledge{flex-direction:column}.pledge .pl-ic{width:44px;height:44px}}

/* Final CTA: future pace */
.cta .cta-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.cta .cta-fine{margin:0;font-size:.9rem;color:#9fa8c3}
.duoctx{padding-block:clamp(72px,9vw,120px) clamp(96px,10vw,140px)}
.duoctx .phcap{left:50%;right:auto;top:-42px;transform:translateX(-50%);text-align:center}
.duoctx .duoph{margin-top:clamp(56px,6vw,72px)}
.promise .head{margin-bottom:clamp(32px,4vw,52px)}.promise .head em.s{color:var(--gold)}
.cine .lede{max-width:52ch;text-wrap:balance}
.pain-turn{max-width:34ch}
.cta em.s{color:var(--gold)}.cta .kick{color:var(--gold)}

/* Hero promise line under the buttons (Nov 8, Maria) */
.cine .hpromise{display:flex;align-items:flex-start;justify-content:center;gap:8px;margin:-6px 0 0;max-width:52ch;font-size:.92rem;line-height:1.45;color:#c9cede;text-align:left}
.cine .hpromise svg{flex:none;width:18px;height:18px;margin-top:1px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:901px){.cine .hpromise{max-width:600px;text-wrap:balance}}

/* ===== Profit showcase: execution plans (Nov 9). Two open plan cards, then 8 fixes behind a + toggle. ===== */
.pshow .ps-plans{margin-top:clamp(64px,8vw,104px);display:grid;gap:clamp(20px,2.4vw,28px)}
.pshow .pp-head{display:grid;gap:12px;justify-items:start;max-width:860px;margin-bottom:clamp(4px,1vw,12px)}
.pshow .pp-head h3{font:400 clamp(1.9rem,3.4vw,2.8rem)/1.08 var(--serif);letter-spacing:-.025em}
.pshow .pp-head p{color:var(--text);font-size:1.02rem;max-width:60ch}
.pshow .pp-sample{font-size:.8rem;font-weight:700;color:var(--muted);background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.pshow .pp-two-up{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,24px);align-items:stretch}
.pshow .pp{background:var(--white);border:1px solid var(--line);border-radius:24px;padding:clamp(20px,2.4vw,30px);display:flex;flex-direction:column;gap:14px;box-shadow:0 1px 0 rgba(10,21,48,.03),0 24px 48px -32px rgba(10,21,48,.28);position:relative;overflow:hidden}
.pshow .pp::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--green),color-mix(in srgb,var(--green) 40%,var(--gold)))}
.pshow .pp-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px}
.pshow .pp-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.pshow .pp-n{width:30px;height:30px;border-radius:50%;background:var(--navy);color:var(--gold);display:grid;place-items:center;font:italic 500 17px/1 var(--serif);flex:none}
.pshow .pp-cat{font-size:.8rem;font-weight:700;color:var(--muted)}
.pshow .pp-tag{font-size:.74rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--gold-ink);background:var(--gold-soft);border-radius:999px;padding:4px 10px}
.pshow .pp-amt{text-align:right;line-height:1}
.pshow .pp-amt b{display:block;font:500 clamp(1.7rem,2.6vw,2.1rem)/1 var(--serif);letter-spacing:-.02em;color:var(--green)}
.pshow .pp-amt small{font-size:.76rem;font-weight:600;color:var(--muted)}
.pshow .pp h3{font:400 clamp(1.45rem,2.1vw,1.8rem)/1.15 var(--serif);letter-spacing:-.02em}
.pshow .pp-play{font-size:1rem;line-height:1.5;color:var(--navy);font-weight:600;max-width:52ch}
.pshow .pp .ps-seen{margin-top:-2px;align-self:flex-start}
.pshow .pp-lab{font-size:.74rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--gold-ink)}
.pshow .pp-steps{list-style:none;margin:-4px 0 0;padding:0;display:grid}
.pshow .pp-steps li{display:grid;grid-template-columns:7.2rem minmax(0,1fr);gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:.95rem;line-height:1.45;color:var(--text)}
.pshow .pp-steps li:first-child{border-top:0;padding-top:4px}
.pshow .st-w{font-weight:800;color:var(--navy);font-size:.86rem;padding-top:1px}
.pshow .pp-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:auto}
.pshow .pp-box{background:var(--cream);border-radius:16px;padding:14px 16px;display:grid;gap:6px;align-content:start}
.pshow .pp-box p{font-size:.92rem;line-height:1.45;color:var(--navy);font-weight:600}
.pshow .pp-know{background:var(--green-soft)}
.pshow .pp-know .pp-lab{color:color-mix(in srgb,var(--green) 75%,#333)}
.pshow .pp-kpi{display:grid;gap:2px}
.pshow .pp-kpi .k-l{font-size:.86rem;font-weight:700;color:var(--navy)}
.pshow .pp-kpi b{font:500 1.6rem/1.1 var(--serif);letter-spacing:-.02em;color:var(--green)}
.pshow .pp-kpi .k-n{font-size:.8rem;font-weight:600;color:color-mix(in srgb,var(--green) 70%,#444)}
/* the 8 compact rows */
.pshow .pm-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(20px,4vw,56px);align-items:start;margin-top:clamp(20px,3vw,36px)}
.pshow .pm-aside{display:grid;gap:10px;position:sticky;top:96px}
.pshow .pm-sum{display:grid}
.pshow .pm-sum b{font:400 clamp(2.2rem,3.6vw,3rem)/1 var(--serif);letter-spacing:-.03em;color:var(--green)}
.pshow .pm-sum span{font-size:.9rem;font-weight:600;color:var(--muted);margin-top:4px}
.pshow .pm-hint{font-size:.95rem;color:var(--text);max-width:30ch}
.pshow .pm-list{list-style:none;margin:0;padding:0;background:var(--white);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.pshow .pm-row+.pm-row{border-top:1px solid var(--line)}
.pshow .pm-head{all:unset;box-sizing:border-box;width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto 32px;gap:14px;align-items:center;padding:16px clamp(14px,2vw,22px);cursor:pointer;transition:background .2s}
.pshow .pm-head:hover{background:color-mix(in srgb,var(--cream) 60%,transparent)}
.pshow .pm-head:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:22px}
.pshow .pm-n{font:italic 500 1.05rem/1 var(--serif);color:var(--gold-ink);text-align:center}
.pshow .pm-t{display:grid;gap:2px;min-width:0}
.pshow .pm-cat{font-size:.76rem;font-weight:700;color:var(--muted)}
.pshow .pm-title{font-size:1rem;font-weight:700;color:var(--navy);line-height:1.3}
.pshow .pm-amt{text-align:right;line-height:1;font-variant-numeric:tabular-nums}
.pshow .pm-amt b{display:block;font:500 1.3rem/1 var(--serif);color:var(--green);letter-spacing:-.01em}
.pshow .pm-amt small{font-size:.72rem;font-weight:600;color:var(--muted)}
.pshow .pm-pl{width:32px;height:32px;border-radius:50%;border:1px solid var(--line-2);position:relative;transition:background .25s,border-color .25s,transform .3s}
.pshow .pm-pl::before,.pshow .pm-pl::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.8px;border-radius:1px;background:var(--navy);translate:-50% -50%;transition:transform .3s,background .25s}
.pshow .pm-pl::after{transform:rotate(90deg)}
.pshow .pm-row.open .pm-pl{background:var(--navy);border-color:var(--navy)}
.pshow .pm-row.open .pm-pl::before,.pshow .pm-row.open .pm-pl::after{background:var(--cream)}
.pshow .pm-row.open .pm-pl::after{transform:rotate(0deg)}
.pshow .pm-body{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .35s cubic-bezier(.2,.7,.2,1),visibility 0s .35s}
.pshow .pm-row.open .pm-body{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .35s cubic-bezier(.2,.7,.2,1),visibility 0s}
.pshow .pm-in{overflow:hidden;min-height:0;display:grid;gap:12px;padding:0 clamp(14px,2vw,22px) 0 calc(clamp(14px,2vw,22px) + 42px)}
.pshow .pm-row.open .pm-in{padding-bottom:20px}
.pshow .pm-in .pp-play{font-size:.97rem}
.pshow .pm-in .pp-kpi b{font-size:1.4rem}
.pshow .ps-total{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:6px 14px;margin-top:clamp(8px,1.5vw,16px);padding:18px 22px;border-radius:18px;background:var(--navy);color:#c9cede;text-align:center}
.pshow .ps-total .t-l{font-size:.8rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--gold)}
.pshow .ps-total b{font:400 clamp(1.25rem,2vw,1.55rem)/1.2 var(--serif);color:var(--cream);letter-spacing:-.01em}
.pshow .ps-total .t-n{font-size:.85rem}
@media (prefers-reduced-motion:reduce){.pshow .pm-body,.pshow .pm-pl,.pshow .pm-pl::before,.pshow .pm-pl::after{transition:none}}
@media (max-width:980px){.pshow .pp-two-up{grid-template-columns:1fr}.pshow .pm-wrap{grid-template-columns:1fr}.pshow .pm-aside{position:static}}
@media (max-width:560px){
  .pshow .pp-steps li{grid-template-columns:1fr;gap:2px}
  .pshow .pp-two{grid-template-columns:1fr}
  .pshow .pp-top{align-items:start}
  .pshow .pm-head{grid-template-columns:minmax(0,1fr) auto 30px;gap:10px;padding:14px 14px}
  .pshow .pm-n{display:none}
  .pshow .pm-pl{width:30px;height:30px}
  .pshow .pm-in{padding-left:14px;padding-right:14px}
  .pshow .pm-title{font-size:.95rem}
}
/* Sample template note: every dashboard is built for the business (Nov 9, Maria) */
.pshow .ps-yours{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(16px,4vw,56px);align-items:center;margin-top:clamp(12px,2vw,24px);padding:clamp(22px,3vw,34px);border:1px solid #e3cf9f;border-radius:22px;background:var(--gold-soft)}
.pshow .py-h{display:grid;gap:10px}
.pshow .py-h h3{font:400 clamp(1.7rem,2.8vw,2.3rem)/1.08 var(--serif);letter-spacing:-.025em}
.pshow .py-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,24px)}
.pshow .py-list li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;font-size:.97rem;line-height:1.45;font-weight:600;color:var(--navy)}
.pshow .py-list svg{width:22px;height:22px;padding:4px;border-radius:50%;background:var(--navy);fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.step .step-x{margin-top:10px;font-size:.85rem;font-weight:700;color:var(--gold-ink)}
@media (max-width:980px){.pshow .ps-yours{grid-template-columns:1fr}.pshow .py-list{grid-template-columns:1fr}}

/* Live Ondine app inside the showcase phone (Nov 9) */
.pshow .ps-live{padding:0;overflow:hidden}
.pshow .ps-live iframe{display:block;width:100%;height:100%;border:0;border-radius:36px;background:#EEF3F2}
.pshow .ps-open{display:block;text-align:center;margin:14px auto 0;font-weight:600;font-size:14px;color:var(--navy);text-decoration:underline;text-underline-offset:3px}

/* Short homepage showcase: one open plan + "see all" expander (Nov 9) */
.pshow .pp-one{max-width:760px;margin:0 auto}
.pshow .pm-all{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;margin:22px auto 0;padding:14px 22px;border-radius:999px;border:1px solid color-mix(in srgb,var(--navy) 18%,transparent);background:#fff;color:var(--navy);font:600 15px var(--sans);cursor:pointer;box-shadow:0 10px 30px -18px rgba(10,21,48,.35)}
.pshow .pm-all b{color:#2f7a4f;font-weight:700}
.pshow .pm-all i{width:22px;height:22px;border-radius:50%;background:color-mix(in srgb,var(--navy) 8%,transparent);position:relative}
.pshow .pm-all i:before,.pshow .pm-all i:after{content:"";position:absolute;left:6px;right:6px;top:10px;height:2px;background:var(--navy);transition:transform .2s}
.pshow .pm-all i:after{transform:rotate(90deg)}
.pshow .pm-all[aria-expanded="true"] i:after{transform:rotate(0)}
.pshow .pm-more{max-width:760px;margin:18px auto 0}
.pshow .pm-more .pm-list{margin:0}