:root{
--ink:#05060A;--ink-soft:#0B1016;--line-dark:rgba(242,245,240,.14);
--text-dark:#F2F5F0;--muted-dark:#9FB09B;--accent:#8EEA32;--accent-warm:#FFB020;
--paper:#F4F2EC;--paper-2:#EBE7DE;--card:#FFFFFF;--line:#D8D2C6;
--text:#101A14;--muted:#4A564E;--accent-ink:#1F5B12;
--radius:18px;--shell:min(1120px,calc(100% - 2.4rem));
--font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);background:var(--paper);color:var(--text);line-height:1.6;font-size:17px}
body.light-page{background:var(--paper)}
img{max-width:100%;display:block}
a{color:inherit}
button,input,textarea,select{font:inherit}
h1,h2,h3{line-height:1.12;margin:0 0 .6em;letter-spacing:-.02em;text-wrap:balance}
h1{font-size:clamp(2.3rem,6.2vw,4rem);font-weight:800}
h2{font-size:clamp(1.8rem,4.2vw,2.9rem);font-weight:800}
h3{font-size:1.15rem;font-weight:700}
p{margin:0 0 1rem}
.shell{width:var(--shell);margin:0 auto}
.section{padding:clamp(3.5rem,8vw,6.5rem) 0}
.lead{font-size:clamp(1.05rem,2.4vw,1.25rem);color:var(--muted);max-width:62ch}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.73rem;font-weight:800;color:var(--accent-ink);margin:0 0 .8rem}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:1rem;top:1rem;z-index:99;background:var(--card);color:var(--text);padding:.7rem 1rem;border-radius:12px}
:focus-visible{outline:3px solid var(--accent-warm);outline-offset:3px;border-radius:6px}
/* header */
.site-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:1.2rem;justify-content:space-between;padding:.7rem max(1.2rem,calc((100vw - 1120px)/2));background:rgba(5,6,10,.92);color:var(--text-dark);border-bottom:1px solid var(--line-dark);backdrop-filter:blur(14px)}
.light-page .site-header{background:rgba(5,6,10,.96)}
.site-header nav{display:none;gap:1.4rem}
.site-header nav a{color:#D5DED2;text-decoration:none;font-size:.94rem}
.site-header nav a:hover{color:var(--text-dark)}
.flowenica-wordmark{width:132px;height:23px;object-fit:contain}
.header-actions{display:flex;align-items:center;gap:.6rem}
.language{border:1px solid var(--line-dark);border-radius:999px;padding:.35rem .6rem;text-decoration:none;font-weight:700;font-size:.82rem;color:var(--text-dark)}
/* buttons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:1px solid transparent;border-radius:999px;padding:.85rem 1.35rem;background:var(--accent);color:#0A1405;font-weight:800;text-decoration:none;cursor:pointer;min-height:48px}
.button:hover{filter:brightness(1.05)}
.button.small{padding:.6rem 1rem;min-height:44px;font-size:.9rem}
/* OP312: the outline of a button is the only thing that says where it is, so it
   is a UI component boundary and owes 3:1. --line-dark (alpha .14) measured
   1.36:1 on the opening's ground: an outline nobody can find. */
.button.ghost{background:transparent;color:var(--text-dark);border-color:rgba(242,245,240,.55)}
.button.quiet{background:transparent;color:var(--text);border-color:var(--line)}
.light-page .button.ghost{color:var(--text);border-color:var(--line)}
/* OP312: a light-page document can still open on a dark hero, and there the
   paper-ground rule above painted near-black text on near-black: measured at
   1.14:1 on the offer page, which is an invisible button, not a quiet one. On
   that ground the outline buttons take the dark-ground palette. */
.offer-hero .button.ghost,.offer-hero .button.quiet{color:var(--text-dark);border-color:rgba(242,245,240,.55)}
/* hero */
.hero{position:relative;background:var(--ink);color:var(--text-dark)}
.hero-scroll{position:relative;height:300vh}
.hero-frame{position:sticky;top:0;min-height:100vh;min-height:100dvh;display:flex;align-items:center;overflow:hidden;padding:clamp(2rem,7vw,3rem) 0}
.hero-frame:before{content:"";position:absolute;inset:-20% -10% 40%;background:radial-gradient(60% 60% at 20% 20%,rgba(142,234,50,.16),transparent 70%),radial-gradient(50% 50% at 85% 10%,rgba(255,176,32,.12),transparent 70%);pointer-events:none}
.hero-grid{position:relative;display:grid;gap:1.6rem;width:100%}
.hero .eyebrow{color:var(--accent)}
.hero .lead{color:#CFD8CC}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.6rem 0 1rem}
.hero-note{color:var(--muted-dark);font-size:.95rem;max-width:48ch}
.trust-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0 0;padding:0;list-style:none}
.trust-row li{font-size:.82rem;padding:.35rem .7rem;border:1px solid var(--line-dark);border-radius:999px;color:#CFD8CC}
.fade-to-light{position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(180deg,rgba(5,6,10,0) 0%,rgba(24,28,24,.55) 45%,var(--paper) 100%);pointer-events:none}
/* the three acts */
/* Each act owns a stretch of the pinned scroll and is absent outside it: not
   faded to nothing, but visibility:hidden with no events. Two acts share the
   screen only during the two short handovers the script declares. Every act
   also arrives and leaves in depth, so the sequence reads as travel and not as
   a slideshow. */
.scene{position:relative;height:clamp(230px,30vh,300px);perspective:900px;perspective-origin:50% 45%;overflow:hidden}
.stage{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(calc(var(--my,0) * 4deg)) rotateY(calc(var(--mx,0) * 5deg));transition:transform .25s ease-out}
.act{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none;visibility:hidden;backface-visibility:hidden}
.act-scatter{visibility:visible;opacity:var(--o1,1);transform:translateZ(calc(var(--z1,0) * 1px))}
.act-corridor{opacity:var(--o2,0);transform:translateZ(calc(var(--z2,-300) * 1px))}
.act-flow{opacity:var(--o3,0);transform:translateZ(calc(var(--z3,-260) * 1px))}
.card{position:absolute;left:50%;top:50%;width:min(52%,166px);display:grid;gap:.2rem;padding:.45rem .6rem;border:1px solid var(--line-dark);border-radius:13px;background:linear-gradient(150deg,rgba(24,31,26,.97),rgba(11,16,22,.94));box-shadow:0 16px 34px rgba(0,0,0,.5);color:var(--text-dark)}
.card b{font-weight:800;font-size:.76rem;letter-spacing:-.01em}
.card .owner{display:flex;align-items:center;gap:.35rem;font-size:.64rem;font-weight:600;color:var(--muted-dark);white-space:nowrap}
.card .dot{width:7px;height:7px;border-radius:50%;background:var(--accent-warm);flex:none}
.card.system .dot{background:var(--accent)}
.card .flag{justify-self:start;padding:.1rem .42rem;border-radius:999px;font-size:.58rem;font-weight:800;background:var(--accent-warm);color:#2A1A00;white-space:nowrap}
.card .flag.done{background:var(--accent);color:#0A1405}
.act-scatter .card{transform:translate3d(calc(var(--sx) * var(--k,.62) * 1px - 50%),calc(var(--sy) * var(--k,.62) * 1px - 50%),calc(var(--sz) * 1px));animation:float 7s ease-in-out infinite}
.act-scatter .c2{animation-delay:-1.6s}
.act-scatter .c3{animation-delay:-3.2s}
.act-scatter .c4{animation-delay:-4.8s}
.act-flow .card{transform:translate3d(calc(var(--fx) * var(--k,.62) * 1px - 50%),calc(var(--fy) * var(--k,.62) * 1px - 50%),calc(var(--fz) * 1px))}
@keyframes float{50%{transform:translate3d(calc(var(--sx) * var(--k,.62) * 1px - 50%),calc(var(--sy) * var(--k,.62) * 1px - 50% + 9px),calc(var(--sz) * 1px))}}
.c1{--sx:-118;--sy:-132;--sz:40;--fx:-26;--fy:-150;--fz:0}
.c2{--sx:52;--sy:-92;--sz:-30;--fx:22;--fy:-75;--fz:10}
.c3{--sx:-134;--sy:34;--sz:-60;--fx:-26;--fy:0;--fz:20}
.c4{--sx:112;--sy:64;--sz:30;--fx:22;--fy:75;--fz:30}
.c5{--sx:-26;--sy:144;--sz:-10;--fx:-26;--fy:150;--fz:40}
.corridor{position:absolute;inset:0;transform-style:preserve-3d;transform:translateZ(calc(var(--depth,0) * 1px))}
.wall{position:absolute;left:50%;top:50%;width:420px;height:250px;margin:-125px 0 0 -210px;transform-style:preserve-3d}
.wall.l{transform:rotateY(76deg) translateZ(180px)}
.wall.r{transform:rotateY(-76deg) translateZ(180px)}
.wall.t{transform:rotateX(-74deg) translateZ(120px)}
.wall.b{transform:rotateX(74deg) translateZ(120px)}
.wall pre{position:absolute;inset:0;margin:0;padding:.4rem .6rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-size:9px;line-height:1.55;white-space:pre;overflow:hidden}
.code.base{color:#66766B}
.code.lit{color:var(--accent);opacity:var(--lit,0)}
.code span{display:block;transform:translateX(calc(var(--jitter,0) * 7px * (1 - var(--lit,0))))}
.light{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;background:radial-gradient(circle,rgba(142,234,50,.5),rgba(142,234,50,.08) 55%,transparent 72%);transform:translateZ(-300px) scale(calc(.6 + var(--o2,0) * .9))}
.flow-line{position:absolute;left:50%;top:5%;width:40px;height:90%;margin-left:-20px}
.offer-billing{display:inline-block;margin-left:.5rem;padding:.1rem .45rem;border:1px solid var(--line);border-radius:999px;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}
/* OP312: the assistant declaration. It has to be read before a purchase, so it
   is a panel with its own ground rather than dimmed body text, and it is styled
   for both the paper sections and the dark heroes it appears in. */
.ai-operator{margin:1rem 0 0;padding:.75rem .95rem;border-radius:12px;max-width:72ch;background:var(--card);border:1px solid var(--line);color:var(--text);font-size:.93rem;line-height:1.5}
.ai-operator b{display:block;margin-bottom:.15rem;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.offer-hero .ai-operator,.contact-section .ai-operator{background:rgba(242,245,240,.08);border-color:var(--line-dark);color:#DFE6DC}
.offer-hero .ai-operator b,.contact-section .ai-operator b{color:var(--accent)}
/* the decorative fade to paper must never wash out the words above it */
.offer-hero .shell{position:relative;z-index:1}
/* the phone keeps the same rules on a smaller stage: three cards, one wall */
.act-scatter .c4,.act-scatter .c5,.act-flow .c4,.act-flow .c5{display:none}
.act-flow .c1{--fy:-165}
.act-flow .c2{--fy:0}
.act-flow .c3{--fy:165}
.wall.r,.wall.t,.wall.b{display:none}
/* method *//* method *//* method */
.method-section{background:var(--paper);position:relative}
.method-steps{list-style:none;counter-reset:step;display:grid;gap:1rem;padding:0;margin:2.4rem 0 0}
.method-steps li{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem 1.4rem}
.method-steps b{display:block;font-size:.8rem;letter-spacing:.12em;color:var(--accent-ink);margin-bottom:.5rem}
.method-steps p{color:var(--muted);margin:0}
.scope-note{margin-top:1.2rem;color:var(--muted);font-size:.95rem;max-width:62ch}
.ai-note{margin-top:2rem;padding:1.5rem;border-radius:var(--radius);background:var(--paper-2);border:1px solid var(--line)}
.ai-note p{color:var(--muted);margin-bottom:.6rem}
.inline-link{color:var(--accent-ink);font-weight:700}
/* offers */
.offers-section{background:var(--paper-2)}
.ladder{margin-top:2.4rem}
.ladder-label{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:800;color:var(--muted);margin:0 0 1rem}
.ladder-label.branch{margin-top:2.4rem}
.ladder-rungs,.ladder-branch{display:grid;gap:1rem}
.offer-card{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;box-shadow:0 10px 30px rgba(16,26,20,.06)}
.offer-card.rung{border-left:6px solid var(--accent)}
.offer-card.branch{border-left:6px solid var(--accent-warm)}
.offer-head{display:flex;align-items:baseline;gap:.7rem}
.offer-head .step{font-size:.8rem;font-weight:800;color:var(--muted)}
.offer-head h3{margin:0;font-size:1.2rem}
.offer-price{margin:.6rem 0 .3rem;font-weight:800;color:var(--text)}
.offer-price .amount{font-size:2.1rem;letter-spacing:-.03em}
.offer-price .from,.offer-price .per{font-size:.95rem;font-weight:700;color:var(--muted)}
.offer-tagline{color:var(--muted);margin:.2rem 0 .8rem}
.offer-facts{list-style:none;margin:0 0 1.1rem;padding:0;display:grid;gap:.35rem;font-size:.9rem;color:var(--muted)}
.offer-facts li{padding-left:1.1rem;position:relative}
.offer-facts li:before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--accent-ink)}
.offer-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:auto 0 0}
/* guarantee + proof */
.guarantee-band{background:linear-gradient(120deg,#12301A,#0B1F13);color:var(--text-dark);padding:clamp(2.6rem,6vw,4rem) 0}
.guarantee-band h2{margin-bottom:.6rem}
.guarantee-band p{color:#D4E2D2;max-width:70ch}
.badge{display:inline-block;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;font-weight:800;padding:.35rem .7rem;border-radius:999px;background:var(--accent);color:#0A1405;margin:0 0 .9rem}
.proof-section{background:var(--paper)}
.proof-grid{display:grid;gap:1rem;margin-top:2.2rem}
.proof-grid article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem}
.proof-grid p{color:var(--muted);margin:0}
.early-offer{margin-top:2rem;padding:1.5rem;border-radius:var(--radius);border:1px solid var(--accent-ink);background:#F2F7EC}
.early-offer p:last-child{margin-bottom:0;color:var(--muted)}
/* sectors */
.sectors-section{background:var(--paper-2)}
.sector-links{list-style:none;padding:0;margin:2rem 0 1.6rem;display:grid;gap:.6rem}
.sector-links a{color:var(--text);text-decoration:none;font-weight:700;border-bottom:1px solid var(--line);display:block;padding-bottom:.6rem}
.sector-links a:hover{color:var(--accent-ink)}
.sector-grid{display:grid;gap:1rem;margin:2rem 0}
.sector-grid article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem}
.sector-grid h2{font-size:1.15rem;margin-bottom:.5rem}
.sector-grid a{text-decoration:none}
.sector-grid a:hover{color:var(--accent-ink)}
.sector-grid p{color:var(--muted);font-size:.95rem}
.sector-grid ul,.sector-pains{list-style:none;padding:0;margin:.6rem 0 0;display:flex;flex-wrap:wrap;gap:.4rem}
.sector-grid li,.sector-pains li{font-size:.8rem;padding:.3rem .6rem;border:1px solid var(--line);border-radius:999px;color:var(--muted)}
.sector-pains{margin:1.4rem 0}
/* faq */
.faq-section{background:var(--paper)}
.faq{display:grid;gap:.7rem;max-width:70ch}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem}
.faq summary{font-weight:800;cursor:pointer}
.faq p{color:var(--muted);margin:.7rem 0 0}
/* contact */
.contact-section{background:var(--ink);color:var(--text-dark)}
.contact-grid{display:grid;gap:2.2rem}
.contact-section .eyebrow{color:var(--accent)}
.contact-section .lead{color:#CFD8CC}
.contact-points{list-style:none;padding:0;margin:1.4rem 0 0;display:grid;gap:.5rem;color:#CFD8CC;font-size:.95rem}
.contact-points li:before{content:"✓ ";color:var(--accent)}
.registration-form,.scrivici-form{display:grid;gap:.9rem;padding:1.4rem;border:1px solid var(--line-dark);border-radius:var(--radius);background:rgba(255,255,255,.05)}
.form-fields{display:grid;gap:.9rem;min-width:0;margin:0;padding:0;border:0}
.form-fields[disabled]{opacity:.55}
.contact-form-column{display:grid;gap:.9rem;min-width:0}
.intake-closed{margin:0;padding:.9rem 1rem;border:1px solid var(--accent);border-radius:12px;font-weight:700;color:var(--text-dark);background:rgba(5,6,10,.55)}
.form-disclosure{margin:0;font-size:.82rem;line-height:1.45;color:#CFD8CC}
.scrivici-link{margin:1rem 0 0}.scrivici-link a{color:var(--accent)}
.form-grid{display:grid;gap:.9rem}
label{display:grid;gap:.35rem;font-size:.85rem;font-weight:700}
input,textarea,select{width:100%;border:1px solid rgba(242,245,240,.25);border-radius:12px;padding:.8rem .9rem;background:rgba(5,6,10,.55);color:var(--text-dark)}
select option{color:#101A14}
.check{grid-template-columns:auto 1fr;align-items:start;font-weight:400;font-size:.86rem;color:#CFD8CC}
.check input{width:auto;margin-top:.25rem}
.check a{color:var(--accent)}
.submit{width:100%}
.form-status{min-height:1.4rem;margin:0;color:#CFE7B4}
.honeypot{position:absolute!important;left:-9999px!important}
/* offer + sector pages */
.offer-hero{position:relative;background:var(--ink);color:var(--text-dark);padding:clamp(2.6rem,7vw,4.5rem) 0 clamp(3rem,7vw,4rem);overflow:hidden}
.offer-hero .eyebrow,.sector-page .eyebrow,.sector-index .eyebrow{color:var(--accent)}
.offer-hero .lead{color:#CFD8CC}
.offer-meta{display:grid;gap:.9rem;margin:1.6rem 0}
.offer-meta dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-dark)}
.offer-meta dd{margin:.2rem 0 0;font-weight:700}
.offer-meta .offer-price .amount{font-size:1.8rem}
.offer-meta .offer-price .from,.offer-meta .offer-price .per{color:#CFD8CC}
.offer-guarantee{display:inline-block;margin:0;padding:.6rem .9rem;border-radius:12px;background:rgba(142,234,50,.12);border:1px solid rgba(142,234,50,.45);color:#DFF3C7;font-weight:700}
.offer-body{background:var(--paper)}
.offer-summary{font-size:clamp(1.05rem,2.4vw,1.2rem);max-width:64ch}
.method-rail{margin:2rem 0;padding:1.4rem;border-radius:var(--radius);background:linear-gradient(180deg,#0B1016,#101A14);perspective:800px;overflow:hidden}
.phases{list-style:none;display:grid;gap:.7rem;margin:0;padding:.4rem 0;transform-style:preserve-3d}
.phases li{min-width:0;padding:.9rem;border-radius:14px;background:rgba(242,245,240,.06);border:1px solid var(--line-dark);color:var(--text-dark);transform:translateZ(calc(var(--phase)*14px));box-shadow:0 14px 30px rgba(0,0,0,.35)}
.phases b{display:block;color:var(--accent);font-size:.8rem;letter-spacing:.1em}
.phases span{display:block;font-weight:700;margin:.25rem 0}
.phases small{display:block;color:#B8C6B5;font-size:.78rem;line-height:1.4}
.phases-title{margin-top:2rem}
.phase-list{list-style:none;padding:0;margin:0 0 2rem;display:grid;gap:.6rem}
.phase-list li{display:grid;gap:.15rem;padding:.9rem 1rem;background:var(--card);border:1px solid var(--line);border-radius:14px}
.phase-list span{color:var(--muted);font-size:.95rem}
.offer-block{margin:2rem 0}
.offer-block h2{font-size:1.4rem}
.offer-block ul{margin:0;padding:0;list-style:none;display:grid;gap:.6rem;max-width:70ch}
.offer-block li{position:relative;padding-left:1.7rem;color:var(--muted)}
.offer-block li:before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;border-radius:3px;background:var(--accent-ink)}
.offer-block.not-included li:before{background:var(--line);border:1px solid var(--muted)}
.sector-page,.sector-index{background:var(--paper)}
/* legal */
.legal-body{background:var(--paper);color:var(--text)}
.legal-page{width:min(800px,calc(100% - 2rem));margin:2.5rem auto;padding:1.8rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.purpose-register{width:100%;border-collapse:collapse;font-size:.86rem;margin:.6rem 0}
.purpose-register th,.purpose-register td{border:1px solid var(--line);padding:.5rem .6rem;text-align:left;vertical-align:top}
.purpose-register th{background:var(--card);font-weight:800}
.legal-page section{padding:.9rem 0;border-top:1px solid var(--line)}
.back{text-decoration:none;font-weight:800;color:var(--accent-ink)}
/* footer */
footer{background:#04070B;color:#B8C6B5;padding:2.5rem 0}
.footer-grid{display:grid;gap:1.6rem}
footer nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
footer a{color:#D5DED2;text-decoration:none;font-size:.92rem}
footer a:hover{color:var(--text-dark)}
footer p{margin:.6rem 0 0;font-size:.92rem}
.copyright{color:#8FA08C;font-size:.82rem}
/* consent */
/* OP326: an element with the hidden attribute is not drawn, whatever display
   its own rule declares. The banner rule's display:flex outranked the browser's
   own [hidden]{display:none}, so the script closed the banner and it stayed on
   the screen. */
[hidden]{display:none!important}
/* OP326: the banner opens the page, in the flow, instead of lying over it. As a
   fixed strip at the bottom it covered page controls on arrival -- the offer
   pages' second button on a phone, a short page's footer on a desktop -- and
   fought the assistant's launcher for the same corner; a space reserved at the
   bottom of the page was measured and could not change what the first screen
   shows. In the flow nothing can be under it, and when it closes the room it
   took closes with it. Both choices are full touch targets. */
.consent-banner{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem;padding:.5rem clamp(1rem,4vw,2rem);border-bottom:1px solid var(--line);background:var(--card);color:var(--text)}
.consent-banner p{margin:0;flex:1 1 16rem;min-width:0;font-size:.8rem;line-height:1.35;color:var(--muted)}
.consent-banner p strong{color:var(--text)}
.consent-banner>div{display:flex;flex-wrap:wrap;gap:.4rem;margin-left:auto}
.consent-banner button,.consent-banner a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--line);border-radius:999px;padding:.5rem .9rem;background:var(--paper);color:var(--text);text-decoration:none;cursor:pointer;font-weight:700;font-size:.8rem}
/* wider screens */
@media(min-width:760px){
body{font-size:18px}
.phases{grid-auto-flow:column;grid-auto-columns:1fr;transform:rotateX(14deg)}
.site-header nav{display:flex}
.form-grid{grid-template-columns:repeat(2,1fr)}
.method-steps{grid-template-columns:repeat(2,1fr)}
.proof-grid{grid-template-columns:repeat(3,1fr)}
.sector-links{grid-template-columns:repeat(2,1fr)}
.sector-grid{grid-template-columns:repeat(2,1fr)}
.ladder-rungs{grid-template-columns:repeat(2,1fr)}
.offer-meta{grid-template-columns:repeat(3,1fr)}
.footer-grid{grid-template-columns:1fr auto}
footer nav{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:1040px){
.hero-grid{grid-template-columns:1.05fr .95fr;align-items:center;gap:3rem}
.scene{height:min(62vh,460px)}
.stage{--k:1}
.act-scatter .c4,.act-scatter .c5,.act-flow .c4,.act-flow .c5{display:grid}
.act-flow .c1{--fy:-150}
.act-flow .c2{--fy:-75}
.act-flow .c3{--fy:0}
.wall{width:520px;height:300px;margin:-150px 0 0 -260px}
.wall pre{font-size:10px}
.wall.r,.wall.t,.wall.b{display:block}
.wall.l{transform:rotateY(76deg) translateZ(230px)}
.wall.r{transform:rotateY(-76deg) translateZ(230px)}
.wall.t{transform:rotateX(-74deg) translateZ(150px)}
.wall.b{transform:rotateX(74deg) translateZ(150px)}
.light{transform:translateZ(-340px) scale(calc(.6 + var(--o2,0) * .9))}
.ladder-rungs{grid-template-columns:repeat(4,1fr);align-items:end;perspective:1200px;perspective-origin:50% 40%}
.ladder-rungs .offer-card{transform:translate3d(0,calc((1 - var(--ladder,1)) * 30px - var(--ladder,1) * var(--rung) * 13px),calc(var(--rung) * 14px));transition:transform .5s cubic-bezier(.22,.7,.3,1)}
.ladder-rungs .offer-card:after{content:"";position:absolute;left:6px;right:6px;bottom:-12px;height:12px;border-radius:0 0 14px 14px;background:linear-gradient(180deg,rgba(16,26,20,.18),transparent);transform:translateZ(-1px)}
.ladder-branch{max-width:50%}
.contact-grid{grid-template-columns:.85fr 1.15fr;align-items:start}
.sector-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1039px){
.hero-frame{padding:1.6rem 0}
.hero h1{font-size:clamp(1.9rem,7.4vw,2.5rem)}
.hero .lead{font-size:.98rem}
.trust-row{gap:.35rem;margin:.9rem 0 0}
.trust-row li{font-size:.76rem;padding:.28rem .6rem}
.scene{height:clamp(196px,25vh,240px)}
}
/* Refused motion: one act, standing still, and nothing pinned. */
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
.hero-scroll{height:auto}
.hero-frame{position:relative;min-height:0}
.card,.corridor,.act,.stage,.ladder-rungs .offer-card{animation:none!important;transition:none!important}
.act-scatter,.act-corridor{display:none!important}
.act-flow{visibility:visible!important;opacity:1!important;transform:none!important}
.ladder-rungs{--ladder:1}
}