/* Multi-page components, part B: the tools (calculator, quiz, plan builder), Google-vs-Meta,
   retargeting timeline, work grid + lightbox, contact stepper, about, legal, 404, the offer
   slide-in, form states and page transitions. */

[hidden]{display:none!important}

/* ——— segmented buttons + sliders ——— */
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg button{min-height:44px;padding:0 16px;border-radius:99px;font-weight:700;font-size:.9rem;color:var(--ink-2);box-shadow:inset 0 0 0 1.5px var(--line-2);
  transition:background-color var(--t-fast),color var(--t-fast),box-shadow var(--t-fast),transform var(--t-instant)}
.seg button:hover{box-shadow:inset 0 0 0 1.5px var(--forest)}
.seg button.on{background:var(--forest);color:var(--cream);box-shadow:none}
.seg button:active{transform:scale(.96)}
.dark .seg button{color:var(--cream-2);box-shadow:inset 0 0 0 1.5px rgba(232,237,227,.2)}
.dark .seg button:hover{box-shadow:inset 0 0 0 1.5px var(--sage)}
.dark .seg button.on{background:var(--sage);color:var(--night);box-shadow:none}
.hint-s{display:block;margin-top:8px;font-size:.82rem;line-height:1.45;color:var(--ink-3)}
.dark .hint-s{color:var(--cream-3)}
.range{display:grid;gap:8px}
.range>span{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-weight:700;color:var(--ink)}
.range output{font:800 1.3rem/1 var(--f-display);color:var(--forest);font-variant-numeric:tabular-nums}
.dark .range>span{color:var(--cream)}
.dark .range output{color:var(--sage)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:30px;margin:0;background:transparent;cursor:pointer;--p:50%;--fill:var(--forest);--rest:var(--mist)}
.dark input[type=range]{--fill:var(--sage);--rest:rgba(232,237,227,.14)}
input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:99px;background:linear-gradient(90deg,var(--fill) var(--p),var(--rest) var(--p))}
input[type=range]::-moz-range-track{height:8px;border-radius:99px;background:var(--rest)}
input[type=range]::-moz-range-progress{height:8px;border-radius:99px;background:var(--fill)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-9px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--fill),0 4px 10px rgba(0,0,0,.2);transition:transform var(--t-fast) var(--e-back)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--fill),0 4px 10px rgba(0,0,0,.2)}
input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
input[type=range]:focus-visible{outline:none}
input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--fill),0 0 0 8px rgba(110,140,90,.3)}

/* ——— ROI calculator ——— */
.calc{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);border-radius:30px;overflow:hidden;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow-lg)}
.calc-in{display:grid;gap:24px;align-content:start;padding:clamp(24px,3.4vw,42px)}
.calc .label{display:block;margin-bottom:10px;font-weight:700;color:var(--ink)}
.calc-out{display:grid;gap:18px;align-content:start;padding:clamp(24px,3.4vw,42px);background:var(--forest-deep);color:var(--cream-2)}
.co-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.co-grid div{padding:16px;border-radius:16px;background:rgba(232,237,227,.05);box-shadow:inset 0 0 0 1px rgba(232,237,227,.08)}
.co-grid small{display:block;font-size:.78rem;font-weight:600;color:var(--cream-3)}
.co-grid b{display:block;margin-top:6px;font:800 1.75rem/1 var(--f-display);color:var(--cream);font-variant-numeric:tabular-nums}
.co-bars{display:grid;gap:10px}
.cob{display:grid;grid-template-columns:70px 1fr 88px;align-items:center;gap:12px;font-size:.85rem;font-weight:700}
.cob i{display:block;height:14px;border-radius:99px;transform-origin:left;transform:scaleX(var(--s,.5));transition:transform .6s var(--e-out)}
.bar-cost{background:#E0876A}
.bar-rev{background:var(--sage)}
.cob b{text-align:right;color:var(--cream);font-variant-numeric:tabular-nums}
.verdict{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:18px;border-radius:18px;background:rgba(167,188,145,.12);box-shadow:inset 0 0 0 1.5px rgba(167,188,145,.4);
  transition:background-color var(--t-base),box-shadow var(--t-base)}
.verdict b{font:800 2.3rem/1 var(--f-display);color:var(--sage);font-variant-numeric:tabular-nums}
.verdict p{margin:0;font-size:.96rem;color:var(--cream)}
.verdict[data-verdict="maybe"]{background:rgba(226,180,92,.12);box-shadow:inset 0 0 0 1.5px rgba(226,180,92,.45)}
.verdict[data-verdict="maybe"] b{color:#EBC67E}
.verdict[data-verdict="bad"]{background:rgba(224,135,106,.12);box-shadow:inset 0 0 0 1.5px rgba(224,135,106,.45)}
.verdict[data-verdict="bad"] b{color:#F2B8A2}
.fine-d{margin:0;font-size:.8rem;line-height:1.5;color:var(--cream-3)}
.calc-out .btn{justify-self:start}
.bump{animation:bump .35s var(--e-back)}
@keyframes bump{40%{transform:scale(1.08)}}
@media (max-width:900px){ .calc{grid-template-columns:1fr} }

/* ——— Google vs Meta + quiz ——— */
.gvm{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:stretch}
.gvm-card{padding:32px;border-radius:26px;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow)}
.gvm-card.meta{background:var(--forest-deep);color:var(--cream-2)}
.gvm-card .ic{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--mist);color:var(--forest)}
.gvm-card.meta .ic{background:rgba(167,188,145,.14);color:var(--sage)}
.gvm-card .ic svg{width:26px;height:26px}
.gvm-card h3{font-size:1.5rem;margin:18px 0 10px}
.gvm-card h3 em{display:block;color:var(--forest);font-weight:400}
.gvm-card.meta h3{color:var(--cream)}
.gvm-card.meta h3 em{color:var(--sage)}
.gvm-card p{margin:0}
.gvm-card ul{list-style:none;margin:20px 0 0;padding:18px 0 0;display:grid;gap:10px;border-top:1px solid var(--line)}
.gvm-card.meta ul{border-color:rgba(232,237,227,.12)}
.gvm-card li{display:grid;grid-template-columns:104px 1fr;gap:10px;font-size:.93rem}
.gvm-card li b{color:var(--ink)}
.gvm-card.meta li b{color:var(--cream)}
.gvm-vs{align-self:center;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--sage);color:var(--night);font:800 1.1rem/1 var(--f-display);box-shadow:var(--shadow)}
.analogy{max-width:26em;margin:46px auto 0;text-align:center;font-size:clamp(1.8rem,3.4vw,2.5rem);line-height:1.15;color:var(--forest);rotate:-1.5deg}
.small-lede{margin-top:18px;font-size:1.05rem}
.quiz{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);margin-top:48px;border-radius:28px;overflow:hidden;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow-lg)}
.quiz-q{padding:clamp(24px,3.4vw,40px)}
.quiz-q h3{font-size:1.5rem}
.quiz-q h3 span{display:block;margin-top:6px;font:500 .95rem/1.4 var(--f-body);color:var(--ink-3)}
.quiz-q ol{list-style:none;counter-reset:q;padding:0;margin:22px 0 0;display:grid;gap:10px}
.quiz-q li{counter-increment:q;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--paper);transition:background-color var(--t-base)}
.quiz-q li>span::before{content:counter(q) ". ";font-weight:800;color:var(--forest)}
.quiz-q li.answered{background:var(--mist)}
.yn{display:flex;gap:6px}
.yn button{min-width:60px;min-height:42px;border-radius:99px;font-weight:700;font-size:.88rem;color:var(--ink-2);box-shadow:inset 0 0 0 1.5px var(--line-2);
  transition:background-color var(--t-fast),color var(--t-fast),transform var(--t-instant)}
.yn button:active{transform:scale(.95)}
.yn button.on{background:var(--forest);color:var(--cream);box-shadow:none}
.yn button[data-a="0"].on{background:var(--ink-3)}
.quiz-out{display:grid;align-content:center;gap:16px;padding:clamp(24px,3.4vw,40px);background:var(--forest-deep);color:var(--cream-2)}
.meter{height:12px;border-radius:99px;background:rgba(232,237,227,.1);overflow:hidden}
.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--bar-1-lit),var(--bar-3-lit));transform-origin:left;transform:scaleX(var(--m,0));transition:transform .6s var(--e-out)}
.qo-title{font:800 1.6rem/1.15 var(--f-display);color:var(--cream)}
.qo-text{margin:0}
.quiz-out .btn{justify-self:start}
@media (max-width:900px){
  .gvm{grid-template-columns:1fr} .gvm-vs{justify-self:center}
  .quiz{grid-template-columns:1fr} .quiz-q li{grid-template-columns:1fr}
}

/* ——— retargeting timeline ——— */
.rt{position:relative;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.rt .rt-bar{position:absolute;left:16%;right:16%;top:73px;height:3px;border-radius:3px;background:var(--line-2);overflow:hidden}
.rt-bar i{position:absolute;inset:0;background:linear-gradient(90deg,var(--bar-1),var(--bar-3));transform:scaleX(0);transform-origin:left}
.rt.in .rt-bar i{animation:rtFill 6s var(--e-inout) infinite}
@keyframes rtFill{0%{transform:scaleX(0);opacity:1}45%,85%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
.rt li:not(.rt-bar){text-align:center;padding:0 10px}
.rt-day{display:inline-block;margin-bottom:16px;padding:6px 12px;border-radius:99px;background:var(--mist);color:var(--forest);font:700 .74rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase}
.rt-ic{position:relative;z-index:1;display:grid;place-items:center;width:64px;height:64px;margin:0 auto 16px;border-radius:50%;background:var(--card);box-shadow:0 0 0 2px var(--line-2),var(--shadow);color:var(--forest)}
.rt-ic svg{width:26px;height:26px}
.rt li:last-child .rt-ic{background:var(--forest);color:var(--cream)}
.rt b{display:block;font:700 1.15rem/1.25 var(--f-display);color:var(--ink)}
.rt small{display:block;margin-top:4px;font-size:.92rem;color:var(--ink-3)}
.js .rt li:not(.rt-bar){opacity:0;transform:translateY(16px)}
.rt.in li:not(.rt-bar){opacity:1;transform:none;transition:opacity .5s var(--e-out),transform .6s var(--e-out);transition-delay:calc(.25s + var(--i,0) * .7s)}
@media (max-width:760px){ .rt{grid-template-columns:1fr;gap:34px} .rt .rt-bar{display:none} }
.plans.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px;margin-inline:auto}
@media (max-width:1000px){ .plans.two{grid-template-columns:1fr} }

/* ——— pricing hero floats ——— */
.price-floats{position:absolute;inset:0;pointer-events:none}
.pf{position:absolute;padding:12px 18px;border-radius:16px;background:rgba(17,24,20,.88);box-shadow:inset 0 0 0 1px rgba(232,237,227,.14),var(--shadow-lg);
  font:800 1.45rem/1 var(--f-display);color:var(--sage);animation:chipIn var(--t-slow) var(--e-back) both,float 7s var(--e-inout) infinite}
.pf small{margin-left:3px;font:600 .8rem var(--f-body);color:var(--cream-3)}
.p1{left:-21%;top:6%;rotate:-6deg;animation-delay:1s,0s}
.p2{right:-20%;top:32%;rotate:5deg;animation-delay:1.2s,-2s}
.p3{left:-12%;bottom:-8%;rotate:-3deg;animation-delay:1.4s,-4s}
@media (max-width:1240px){ .price-floats{display:none} }

/* ——— plan builder ——— */
.builder{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:24px;align-items:start}
.bl-in{display:grid;gap:14px}
.bl-row{display:grid;grid-template-columns:1fr auto;gap:16px 20px;align-items:center;padding:22px 24px;border-radius:22px;
  background:rgba(232,237,227,.04);box-shadow:inset 0 0 0 1px rgba(232,237,227,.1);transition:background-color var(--t-base),box-shadow var(--t-base)}
.bl-row.on{background:rgba(167,188,145,.08);box-shadow:inset 0 0 0 1.5px rgba(167,188,145,.45)}
.bl-head{display:flex;align-items:center;gap:14px}
.bl-head .ic{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(167,188,145,.12);color:var(--sage)}
.bl-head .ic svg{width:24px;height:24px}
.bl-head b{display:block;font:700 1.2rem/1.2 var(--f-display);color:var(--cream)}
.bl-head small{font-size:.85rem;color:var(--cream-3)}
.bl-row .bl-budget{grid-column:1/-1;animation:fadeUp .35s var(--e-out)}
.switch{position:relative;display:inline-block;width:60px;height:34px}
.switch input{position:absolute;inset:0;z-index:1;margin:0;opacity:0;cursor:pointer}
.switch span{position:absolute;inset:0;border-radius:99px;background:rgba(232,237,227,.18);transition:background-color var(--t-base)}
.switch span::after{content:"";position:absolute;top:4px;left:4px;width:26px;height:26px;border-radius:50%;background:#fff;transition:transform var(--t-base) var(--e-back)}
.switch input:checked+span{background:var(--sage)}
.switch input:checked+span::after{transform:translateX(26px)}
.switch input:focus-visible+span{outline:2px solid var(--sage);outline-offset:3px}
.bl-out{position:sticky;top:calc(var(--nav-h) + 24px);display:grid;gap:14px;padding:28px;border-radius:26px;background:var(--card);color:var(--ink-2);box-shadow:var(--shadow-lg)}
.bl-out>small{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.bl-total{font:800 clamp(3rem,5vw,4rem)/1 var(--f-display);letter-spacing:-.03em;color:var(--forest);font-variant-numeric:tabular-nums}
.bl-lines{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:.93rem}
.bl-lines li{display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px dashed var(--line-2);animation:fadeUp .35s var(--e-out) both}
.bl-lines li span{color:var(--ink-3)}
.bl-lines li b{color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.bl-lines li.ads b{color:var(--moss)}
.bl-split{position:relative;height:12px;border-radius:99px;overflow:hidden;background:var(--mist)}
.bl-split i{position:absolute;top:0;bottom:0;width:100%;transition:transform .5s var(--e-out)}
.to-us{left:0;transform-origin:left;transform:scaleX(var(--us,1));background:var(--forest)}
.to-ads{right:0;transform-origin:right;transform:scaleX(var(--ads,0));background:var(--sage)}
.bl-legend{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:.85rem;color:var(--ink-3)}
.bl-legend i{display:inline-block;width:10px;height:10px;margin-right:6px;border-radius:3px}
.k-us{background:var(--forest)}.k-ads{background:var(--sage)}
.bl-legend b{color:var(--ink)}
.bl-first{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 16px;border-radius:14px;background:var(--paper)}
.bl-first small{font-size:.85rem;font-weight:600;color:var(--ink-3)}
.bl-first b{font:800 1.35rem/1 var(--f-display);color:var(--ink);font-variant-numeric:tabular-nums}
.bl-out .fine-d{color:var(--ink-3)}
.bl-out .btn{width:100%}
@media (max-width:900px){ .builder{grid-template-columns:1fr} .bl-out{position:static} .bl-row{grid-template-columns:1fr} }

/* ——— work grid + lightbox ——— */
.ph-work{padding-bottom:0}
.wall-hero{margin-top:44px;height:clamp(200px,24vw,320px)}
.filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:40px}
.filters button{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border-radius:99px;font-weight:700;color:var(--ink-2);
  box-shadow:inset 0 0 0 1.5px var(--line-2);transition:background-color var(--t-fast),color var(--t-fast),transform var(--t-instant)}
.filters button:active{transform:scale(.96)}
.filters button span{padding:3px 8px;border-radius:99px;font-size:.78rem;background:var(--mist);color:var(--forest)}
.filters button.on{background:var(--forest);color:var(--cream);box-shadow:none}
.filters button.on span{background:rgba(232,237,227,.18);color:var(--cream)}
.work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,30px)}
.wcard{margin:0;transition:opacity .3s var(--e-out),scale .4s var(--e-out)}
.wcard.fading{opacity:0;scale:.95}
.wcard-btn{display:block;width:100%;position:relative;text-align:left;border-radius:16px}
.wcard .frame-shell{display:block;border-radius:16px;background:#fff;overflow:hidden;box-shadow:var(--shadow);transition:transform var(--t-base) var(--e-out),box-shadow var(--t-base)}
.wcard .chrome,.lb .chrome{height:30px;padding:0 12px;gap:6px}
.wcard .chrome i,.lb .chrome i{width:9px;height:9px}
.wcard .chrome .url,.lb .chrome .url{height:18px;margin-left:10px;padding:0 10px;gap:6px;font-size:.68rem;max-width:60%}
.lb .chrome .url svg{width:10px;height:10px}
.wthumb{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:#EEF0EA}
.wthumb img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .8s var(--e-out)}
.wcard-btn:hover .frame-shell{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.wcard-btn:hover .wthumb img{transform:scale(1.05)}
.wcard-btn:active .frame-shell{transform:scale(.98)}
.wplay{position:absolute;left:50%;top:58%;translate:-50% -50%;display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:99px;
  background:rgba(17,24,20,.92);color:var(--cream);font-weight:700;font-size:.9rem;white-space:nowrap;opacity:0;transform:translateY(10px);
  transition:opacity var(--t-base),transform var(--t-base) var(--e-out)}
.wplay svg{width:18px;height:18px;color:var(--sage)}
.wcard-btn:hover .wplay,.wcard-btn:focus-visible .wplay{opacity:1;transform:none}
@media (hover:none){ .wplay{opacity:1;transform:none;top:auto;bottom:12px;translate:-50% 0;padding:8px 12px;font-size:.8rem} }
.wcard figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:14px;padding-inline:4px}
.wcard figcaption b{font:700 1.05rem/1.2 var(--f-display);color:var(--ink)}
.wcard figcaption span{font-size:.82rem;font-weight:600;color:var(--ink-3);text-align:right}
@media (max-width:1000px){ .work-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:600px){ .work-grid{grid-template-columns:1fr} }
.lb{position:fixed;inset:0;z-index:150;display:grid;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr);place-items:center;padding:clamp(10px,3vw,40px)}
.lb-bg{position:absolute;inset:0;background:rgba(6,9,7,.84);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transition:opacity var(--t-base)}
.lb-panel{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;width:min(1100px,100%);height:100%;max-height:100%;
  opacity:0;transform:translateY(24px) scale(.97);transition:opacity var(--t-base),transform var(--t-slow) var(--e-out)}
.lb.open .lb-bg{opacity:1}
.lb.open .lb-panel{opacity:1;transform:none}
.lb-head{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--cream)}
.lb-head b{display:block;font:800 1.3rem/1.2 var(--f-display)}
.lb-head small{color:var(--cream-3)}
.lb-nav{display:flex;gap:8px}
.lb-nav button{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(232,237,227,.08);box-shadow:inset 0 0 0 1px rgba(232,237,227,.14);
  color:var(--cream);transition:background-color var(--t-fast),transform var(--t-instant)}
.lb-nav button:hover{background:rgba(232,237,227,.16)}
.lb-nav button:active{transform:scale(.94)}
.lb-nav svg{width:20px;height:20px}
.lb-frame{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--shadow-lg)}
.lb-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.lb-scroll img{display:block;width:100%;height:auto;transition:opacity .3s}
.lb-scroll img.loading{opacity:.2}
.lb-foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.85rem;color:var(--cream-3)}
html.lb-open{overflow:hidden}

/* ——— contact stepper ——— */
.cp-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(30px,5vw,70px);align-items:start}
.stepper-card{min-height:540px}
.st-top{display:flex;align-items:center;gap:16px;margin-bottom:6px}
.st-progress{flex:1;height:6px;border-radius:99px;background:rgba(232,237,227,.1);overflow:hidden}
.st-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--bar-1-lit),var(--bar-3-lit));transform-origin:left;transform:scaleX(var(--prog,.3333));transition:transform .5s var(--e-out)}
.st-count{margin:0;white-space:nowrap;font-size:.85rem;font-weight:700;color:var(--cream-3)}
.no-js .st-top{display:none}
fieldset.st{display:grid;gap:18px;min-width:0;margin:0;padding:0;border:0}
.js fieldset.st:not(.cur){display:none}
.st.cur{animation:stepIn .45s var(--e-out)}
.st.cur.back{animation-name:stepBack}
@keyframes stepIn{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes stepBack{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
.st legend{padding:0;margin-bottom:4px;font:800 clamp(1.4rem,2.4vw,1.8rem)/1.15 var(--f-display);color:var(--cream)}
.st legend span{display:block;margin-top:6px;font:500 .95rem/1.4 var(--f-body);color:var(--cream-3)}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opt{position:relative}
.opt:last-child{grid-column:1/-1}
.opt input{position:absolute;inset:0;z-index:1;margin:0;opacity:0;cursor:pointer}
.opt>span{display:grid;grid-template-columns:42px 1fr;column-gap:12px;align-items:center;padding:16px;border-radius:16px;background:rgba(232,237,227,.04);
  box-shadow:inset 0 0 0 1.5px rgba(232,237,227,.14);transition:background-color var(--t-fast),box-shadow var(--t-fast),transform var(--t-instant)}
.opt svg{grid-row:span 2;width:42px;height:42px;padding:10px;border-radius:12px;background:rgba(167,188,145,.12);color:var(--sage);transition:background-color var(--t-fast),color var(--t-fast)}
.opt b{color:var(--cream);font-size:1rem}
.opt small{color:var(--cream-3);font-size:.84rem}
.opt input:checked+span{background:rgba(167,188,145,.14);box-shadow:inset 0 0 0 2px var(--sage)}
.opt input:checked+span svg{background:var(--sage);color:var(--night)}
.opt input:focus-visible+span{outline:2px solid var(--sage);outline-offset:3px}
.opt:active>span{transform:scale(.98)}
.st-nav{display:flex;justify-content:space-between;gap:12px;margin-top:4px}
.st-nav .btn:only-child{margin-left:auto}
.cp-side{display:grid;gap:26px}
.cp .direct{margin-top:0}
.cp .hours-note{margin:16px 2px 0;font-size:.92rem;line-height:1.55;color:var(--cream-3)}
.cp .hours-note b{color:var(--cream)}
.next{padding:26px;border-radius:24px;background:rgba(232,237,227,.04);box-shadow:inset 0 0 0 1px rgba(232,237,227,.1)}
.next h3{font-size:1.25rem;margin-bottom:16px}
.next ol{list-style:none;counter-reset:n;padding:0;margin:0;display:grid;gap:14px}
.next li{counter-increment:n;position:relative;min-height:32px;padding:5px 0 0 46px;font-size:.95rem;color:var(--cream-2)}
.next li::before{content:counter(n);position:absolute;left:0;top:0;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--sage);color:var(--night);font:800 .9rem/1 var(--f-display);padding-top:.1em}
.next b{color:var(--cream)}
.bits-dark{display:grid;gap:12px;margin-top:26px}
.bits-dark p{margin:0;padding:16px 18px;border-radius:16px;background:rgba(232,237,227,.05);box-shadow:inset 0 0 0 1px rgba(232,237,227,.08);color:var(--cream-2)}
.bits-dark b{display:block;margin-bottom:2px;color:var(--cream)}
@media (max-width:960px){ .cp-grid{grid-template-columns:1fr} .stepper-card{min-height:0} }
@media (max-width:560px){ .opts{grid-template-columns:1fr} }

/* ——— about ——— */
.about-pol{justify-self:center}
.narrow{max-width:780px}
.story-text h2{margin:.35em 0 .5em}
.big-p{font:500 clamp(1.25rem,2.2vw,1.55rem)/1.45 var(--f-body);color:var(--ink)}
.story-text p{font-size:1.1rem;color:var(--ink-2)}
.story-text .sign{display:inline-block;margin-top:6px;font-size:2.6rem;line-height:1;color:var(--forest);rotate:-3deg}
.beliefs{background:var(--forest-deep)}
.belief-list{list-style:none;padding:0;margin:0;display:grid}
.belief-list li{display:grid;grid-template-columns:130px 1fr;gap:24px;align-items:start;padding:34px 0;border-top:1px solid rgba(232,237,227,.1)}
.bn{font:800 clamp(3rem,6vw,5rem)/.9 var(--f-display);color:transparent;-webkit-text-stroke:1.5px var(--sage)}
.belief-list h3{font-size:clamp(1.35rem,2.6vw,2rem);margin-bottom:8px}
.belief-list p{margin:0;font-size:1.05rem}
@media (max-width:620px){ .belief-list li{grid-template-columns:1fr;gap:10px} }
.about-honest{padding-top:0}
.about-honest .honest{margin-top:0}
.towns{padding-block:36px}
.towns-label{margin:0 0 18px;text-align:center;font:700 .8rem/1 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:var(--sage)}

/* ——— legal ——— */
.ph-legal .ph-title{font-size:clamp(2.2rem,4.4vw,3.6rem)}
.legal-body h2{font-size:clamp(1.3rem,2.2vw,1.6rem);margin:2em 0 .55em}
.legal-body h2:first-child{margin-top:0}
.legal-body p,.legal-body li{font-size:1.02rem;color:var(--ink-2)}
.legal-body ul{display:grid;gap:8px;margin:0 0 1em;padding-left:1.2em}
.legal-body a,.fine a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.legal-body a{color:var(--forest)}

/* ——— 404 ——— */
.nf{position:relative;display:grid;place-items:center;min-height:100svh;overflow:hidden;padding-top:var(--nav-h);padding-bottom:60px;
  background:radial-gradient(120% 80% at 50% 0%,#12281C 0%,var(--night) 60%)}
.nf-inner{position:relative;text-align:center}
.nf .hero-sub{margin-inline:auto}
.nf-links{justify-content:center}
.nf-bars{display:grid;grid-template-rows:repeat(3,24px);width:min(340px,70vw);margin:0 auto 30px}
.nf-bars i{display:block;transform-origin:left;animation:nfBar 2.6s var(--e-inout) infinite alternate}
.nf-bars i:nth-child(1){background:var(--bar-1-lit)}.nf-bars i:nth-child(2){background:var(--bar-2-lit);animation-delay:-.9s}.nf-bars i:nth-child(3){background:var(--bar-3-lit);animation-delay:-1.8s}
@keyframes nfBar{from{transform:scaleX(.25)}to{transform:scaleX(1)}}

/* ——— offer slide-in ——— */
.offer{position:fixed;left:20px;bottom:20px;z-index:96;width:min(360px,calc(100vw - 40px));padding:22px 22px 20px;border-radius:22px;
  background:rgba(17,24,20,.97);color:var(--cream-2);box-shadow:var(--shadow-lg),inset 0 0 0 1px rgba(232,237,227,.12);
  opacity:0;transform:translateY(130%);transition:transform var(--t-slow) var(--e-back),opacity var(--t-base)}
.offer.show{opacity:1;transform:none}
.offer b{display:block;margin:14px 0 6px;padding-right:28px;font:800 1.15rem/1.2 var(--f-display);color:var(--cream)}
.offer p{margin:0 0 14px;font-size:.9rem;line-height:1.5}
.offer-x{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:var(--cream-3);transition:color var(--t-fast),background-color var(--t-fast)}
.offer-x:hover{color:var(--cream);background:rgba(232,237,227,.08)}
.offer-x svg{width:18px;height:18px}
.offer-scan{position:relative;display:grid;place-items:center;width:56px;height:42px;border-radius:12px;background:var(--forest);overflow:hidden}
.offer-scan .bars{--bw:26px;--bh:14px}
.offer-line{position:absolute;left:0;right:0;top:0;height:2px;background:var(--sage-2);box-shadow:0 0 8px 2px rgba(201,216,182,.7);animation:offerScan 1.6s var(--e-inout) infinite alternate}
@keyframes offerScan{to{transform:translateY(40px)}}
@media (max-width:720px){ .offer{left:12px;right:12px;width:auto;bottom:88px} }

/* ——— form states ——— */
.success .s-fail{display:none}
.form-card.failed .success .s-ok{display:none}
.form-card.failed .success .s-fail{display:block}
.success .s-fail circle,.success .s-fail path{stroke:#EBC67E}
.s-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:6px}
.s-actions svg{width:18px;height:18px}
.btn.loading{opacity:.7;pointer-events:none}
.legal-links{display:flex;gap:18px}

/* ——— page transitions (browsers that support cross-document view transitions) ——— */
@view-transition{navigation:auto}
.nav{view-transition-name:site-nav}
::view-transition-old(root){animation:vtOut .26s var(--e-sharp) both}
::view-transition-new(root){animation:vtIn .5s var(--e-out) both}
@keyframes vtOut{to{opacity:0;transform:translateY(-12px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(16px)}}

/* ——— the reduced-motion rail, for everything on these pages ——— */
@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .js .scan-list li,.js .path .node,.js .rt li:not(.rt-bar),.js .compare-wrap tbody tr,.js .fl li{opacity:1!important;transform:none!important}
  .scan-list li{animation:none!important}
  .sw .screen img:first-child{opacity:1!important}
  .mf-track,.strip-track{transform:none!important}
  .hearts,.run,.scan-line,.offer-line{display:none!important}
  .blk{animation:none!important}
  .b-call{transform:translateY(19cqw)}.b-reviews{transform:translateY(38cqw)}.b-gallery{transform:translateY(57cqw)}
  .shuffle-label span{animation:none!important;opacity:0}.shuffle-label span:first-child{opacity:1}
  .js .rp-chart path{stroke-dashoffset:0!important}
}

/* ——— real sites (home + work) ——— */
.frames.four{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,3vw,40px)}
.frame.real .frame-shell,.frame.real .frame-screen{display:block}
.frame.real .wcard-btn{position:relative;display:block;width:100%;text-align:left;border-radius:16px}
.frame.real figcaption{display:grid;gap:6px;margin-top:16px;padding-inline:4px}
.real-name{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.real-name b{font:700 1.2rem/1.2 var(--f-display);color:var(--ink)}
.real-tag{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:99px;background:var(--forest);color:var(--cream);
  font:700 .7rem/1 var(--f-body);font-style:normal;letter-spacing:.08em;text-transform:uppercase}
.real-tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sage)}
.real-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;font-size:.9rem;font-weight:600;color:var(--ink-3)}
.real-live{color:var(--forest);font-weight:700;border-bottom:1.5px solid rgba(36,81,58,.3);transition:border-color var(--t-fast)}
.real-live:hover{border-color:var(--forest)}
.credit{font-size:.74rem;color:var(--ink-3)}
.real-sec{padding-bottom:clamp(30px,4vw,60px)}
.lb-actions{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:760px){ .frames.four{grid-template-columns:1fr;max-width:560px;margin-inline:auto} }

/* ——— SEO on the house (websites page) ——— */
.seo-sec{background:var(--card);border-block:1px solid var(--line)}
.seo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,90px);align-items:center}
.seo-grid h2{margin:.35em 0 .4em}
.seo-points{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:16px}
.seo-points li{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:start}
.seo-points .ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--mist);color:var(--forest)}
.seo-points .ic svg{width:24px;height:24px}
.seo-points b{display:block;font:700 1.1rem/1.3 var(--f-display);color:var(--ink)}
.seo-points span{font-size:.97rem;color:var(--ink-3)}
.kw{position:relative;justify-self:end;width:100%;max-width:520px;padding:28px;border-radius:26px;background:var(--forest-deep);color:var(--cream-2);box-shadow:var(--shadow-lg);rotate:-1deg;
  transition:rotate var(--t-slow) var(--e-out)}
.kw:hover{rotate:0deg}
.kw-head{display:flex;align-items:center;gap:14px;padding-bottom:18px;border-bottom:1px solid rgba(232,237,227,.12)}
.kw-ic{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--sage);color:var(--night)}
.kw-ic svg{width:22px;height:22px}
.kw-head b{display:block;font:700 1.1rem/1.2 var(--f-display);color:var(--cream)}
.kw-head small{color:var(--cream-3)}
.kw-list{list-style:none;padding:0;margin:18px 0;display:grid;gap:10px}
.kw-list li{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;gap:10px 12px;align-items:center;padding:12px 14px;border-radius:14px;background:rgba(232,237,227,.05)}
.kw-q{font-size:.95rem;font-weight:700;color:var(--cream)}
.kw-list em{padding:5px 10px;border-radius:99px;background:rgba(167,188,145,.16);color:var(--sage);font-size:.76rem;font-style:normal;font-weight:700;white-space:nowrap}
.kw-bar{grid-column:1/-1;display:block;height:6px;border-radius:99px;background:linear-gradient(90deg,var(--bar-2-lit),var(--bar-3-lit));transform-origin:left;transform:scaleX(var(--w))}
.js .kw .kw-bar{transform:scaleX(0)}
.kw.in .kw-bar{transform:scaleX(var(--w));transition:transform 1s var(--e-out) calc(.35s + var(--i) * .15s)}
.js .kw-list li{opacity:0;translate:-16px 0}
.kw.in .kw-list li{opacity:1;translate:0 0;transition:opacity .45s var(--e-out) calc(.2s + var(--i) * .12s),translate .55s var(--e-out) calc(.2s + var(--i) * .12s)}
.js .kw-list em{opacity:0;scale:.6}
.kw.in .kw-list em{opacity:1;scale:1;transition:scale .5s var(--e-back) calc(.9s + var(--i) * .15s),opacity .3s calc(.9s + var(--i) * .15s)}
.kw-list li::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(201,216,182,.14),transparent);
  transform:translateX(-100%);animation:kwSweep 5s var(--e-inout) infinite;animation-delay:calc(2s + var(--i) * .35s)}
@keyframes kwSweep{0%,60%{transform:translateX(-100%)}80%,100%{transform:translateX(100%)}}
.kw-foot{display:flex;align-items:center;gap:8px;margin:0;font-size:.9rem;font-weight:700;color:var(--sage)}
.kw-foot svg{width:20px;height:20px}
@media (max-width:900px){ .seo-grid{grid-template-columns:1fr} .kw{justify-self:center} }
@media (prefers-reduced-motion:reduce){
  .js .kw .kw-bar{transform:scaleX(var(--w))!important}
  .js .kw-list li,.js .kw-list em{opacity:1!important;translate:none!important;scale:none!important}
  .kw-list li::after{display:none}
}

/* ——— home: work → pricing spacing (both sections share the cream ground, so one padding each side is plenty) ——— */
.work{padding-bottom:clamp(40px,5vw,72px)}
.work + .pricing{padding-top:clamp(56px,6vw,96px)}
.work .wall{margin-top:clamp(18px,2.4vw,30px)}
.wall-label{display:flex;align-items:center;gap:12px;margin:clamp(44px,5vw,64px) 0 0;font:700 .74rem/1.3 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.wall-label::before{content:"";flex:none;width:28px;height:2px;background:var(--line-2)}

/* an odd card out on the last row sits in the middle, not hanging off the left */
@media (min-width:761px){ .frames.four > .frame:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;width:calc(50% - clamp(22px,3vw,40px) / 2)} }

/* ——— where your leads go (websites page) ——— */
.leads-sec{background:var(--paper)}
.lead-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px)}
.route{position:relative;padding:34px 28px 30px;border-radius:24px;background:var(--card);box-shadow:0 0 0 1px var(--line);
  transition:translate var(--t-base) var(--e-out),box-shadow var(--t-base)}
.route:hover{translate:0 -6px;box-shadow:0 0 0 1px var(--line),var(--shadow)}
.route.main{background:var(--forest-deep);color:var(--cream-2);box-shadow:var(--shadow-lg)}
.route.main h3{color:var(--cream)}
.route-tag{position:absolute;top:22px;right:22px;padding:6px 11px;border-radius:99px;background:var(--mist);color:var(--forest);font:800 .68rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase}
.route.main .route-tag{background:var(--sage);color:var(--night)}
.route .ic{display:grid;place-items:center;width:54px;height:54px;margin-bottom:22px;border-radius:16px;background:var(--mist);color:var(--forest);transition:transform var(--t-base) var(--e-back)}
.route.main .ic{background:rgba(167,188,145,.14);color:var(--sage)}
.route:hover .ic{transform:rotate(-6deg) scale(1.06)}
.route .ic svg{width:27px;height:27px}
.js .route .ic svg *{stroke-dasharray:1;stroke-dashoffset:1}
.route.in .ic svg *{animation:draw 1.1s var(--e-out) calc(.25s + var(--i,0) * 90ms) forwards}
.route h3{font-size:1.3rem;margin-bottom:10px}
.route p{margin:0;font-size:.97rem;color:var(--ink-3)}
.route.main p{color:var(--cream-2)}
@media (max-width:900px){ .lead-routes{grid-template-columns:1fr;max-width:560px;margin-inline:auto} }

/* ——— website intake form (/intake/) ——— */
.intake-sec .form-card{padding:clamp(22px,3vw,40px)}
.intake{display:grid;gap:clamp(28px,4vw,44px)}
.ik-step{border:0;padding:0;margin:0;display:grid;gap:18px}
.ik-step+.ik-step{padding-top:clamp(26px,3.6vw,40px);border-top:1px solid rgba(232,237,227,.12)}
.ik-step legend{display:flex;align-items:center;gap:12px;float:left;width:100%;margin-bottom:6px;
  font:800 1.35rem/1.15 var(--f-display);color:var(--cream)}
.ik-n{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--sage);color:var(--night);font-size:1rem}
.ik-hint{margin:0;font-size:.95rem;color:var(--cream-3)}
.req{display:inline-block;margin-left:6px;padding:2px 8px;border-radius:99px;background:rgba(167,188,145,.18);color:var(--sage);font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}
.ik-step .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field small{font-size:.82rem;line-height:1.45;color:var(--cream-3)}
.ik-picks{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pick{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border-radius:18px;cursor:pointer;
  background:rgba(232,237,227,.05);box-shadow:inset 0 0 0 1.5px rgba(232,237,227,.12);
  transition:background-color var(--t-fast),box-shadow var(--t-fast),transform var(--t-instant)}
.pick:hover{background:rgba(232,237,227,.08)}
.pick:active{transform:scale(.99)}
.pick input{flex:none;width:22px;height:22px;margin-top:2px;accent-color:var(--sage)}
.pick b{display:block;color:var(--cream);font-size:1rem}
.pick small{display:block;margin-top:4px;font-size:.85rem;line-height:1.45;color:var(--cream-3)}
.pick:has(input:checked){background:rgba(167,188,145,.14);box-shadow:inset 0 0 0 1.5px var(--sage)}
.ik-if{display:grid;gap:18px;padding:20px;border-radius:18px;background:rgba(167,188,145,.07);box-shadow:inset 0 0 0 1px rgba(167,188,145,.22);
  animation:ikIn .4s var(--e-out) both}
@keyframes ikIn{from{opacity:0;transform:translateY(-6px)}}
.ik-if h4{margin:0;font:800 1.02rem/1.2 var(--f-display);color:var(--sage)}
.ik-note{margin:-6px 0 0;font-size:.88rem;color:var(--cream-3)}
.ik-send{display:grid;gap:12px;justify-items:start}
.ik-send .fine{margin:0;font-size:.85rem;color:var(--cream-3)}
@media (prefers-reduced-motion:reduce){ .ik-if{animation:none} }
@media (max-width:760px){ .ik-step .grid-2,.ik-picks{grid-template-columns:1fr} }

/* ——— "what it replaces" value comparison ——— */
.worth{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
.worth-card{display:grid;align-content:start;gap:16px;padding:clamp(24px,3vw,36px);border-radius:26px;
  background:rgba(232,237,227,.05);box-shadow:inset 0 0 0 1px rgba(232,237,227,.12)}
.worth-tag{justify-self:start;padding:5px 12px;border-radius:99px;background:rgba(167,188,145,.16);color:var(--sage);font-size:.75rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.worth-card h3{margin:0;font-size:1.5rem;color:var(--cream)}
.worth-rows{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.worth-rows li{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding-bottom:12px;border-bottom:1px solid rgba(232,237,227,.1)}
.worth-rows span{color:var(--cream-2);font-size:.95rem}
.worth-rows b{color:var(--cream);font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.worth-rows em{grid-column:1/-1;font-style:normal;font-size:.82rem;color:var(--cream-3)}
.worth-note{margin:0;font-size:.84rem;line-height:1.5;color:var(--cream-3)}
.worth-vs{display:grid;gap:4px;padding:20px;border-radius:18px;background:rgba(167,188,145,.14);box-shadow:inset 0 0 0 1.5px rgba(167,188,145,.45)}
.worth-vs span{font-size:.9rem;font-weight:700;color:var(--cream)}
.worth-vs b{font:800 2.6rem/1 var(--f-display);color:var(--sage);font-variant-numeric:tabular-nums}
.worth-vs b small{font-size:1rem;font-weight:700}
.worth-vs em{font-style:normal;font-size:.88rem;color:var(--cream-2)}
.worth-fair{margin:0;font-size:.9rem;line-height:1.55;color:var(--cream-3)}
@media (max-width:900px){ .worth{grid-template-columns:1fr} }

/* ——— the two ways to pay ——— */
.pay-two{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:40px}
.pay-card{display:grid;align-content:start;gap:14px;padding:clamp(24px,3vw,34px);border-radius:26px;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow)}
.pay-card.best{box-shadow:0 0 0 2px var(--forest),var(--shadow-lg)}
.pay-tag{justify-self:start;padding:5px 12px;border-radius:99px;background:var(--mist);color:var(--forest);font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.pay-card.best .pay-tag{background:var(--forest);color:var(--cream)}
.pay-price{font:800 clamp(2.6rem,5vw,3.4rem)/1 var(--f-display);color:var(--ink);font-variant-numeric:tabular-nums}
.pay-price small{font-size:1rem;font-weight:700;color:var(--ink-3)}
.pay-sum{margin:0;color:var(--ink-2)}
.pay-card .btn{justify-self:start;margin-top:4px}
.pay-fine{margin:22px 0 0;font-size:.9rem;line-height:1.6;color:var(--ink-3)}
.later-row th em{font-weight:500;color:var(--ink-3)}
@media (max-width:820px){ .pay-two{grid-template-columns:1fr} }

/* ——— /start/ : pick a plan, agree, pay ——— */
.start-sec .wrap{max-width:780px}
.plan-switch{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:8px;border-radius:22px;background:var(--mist)}
.plan-switch button{display:grid;gap:2px;padding:14px 18px;border-radius:16px;text-align:left;color:var(--ink-2);transition:background-color var(--t-fast),box-shadow var(--t-fast),color var(--t-fast)}
.plan-switch button b{font:800 1.05rem/1.2 var(--f-display)}
.plan-switch button span{font-size:.86rem;color:var(--ink-3)}
.plan-switch button.on{background:var(--card);color:var(--ink);box-shadow:0 0 0 2px var(--forest),var(--shadow)}
.plan-switch button.on span{color:var(--forest);font-weight:700}
.plan-panel{margin-top:26px;padding:clamp(24px,3.4vw,38px);border-radius:28px;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow-lg)}
.plan-top{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.plan-tag{display:inline-block;padding:5px 12px;border-radius:99px;background:var(--forest);color:var(--cream);font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.plan-tag.alt{background:var(--mist);color:var(--forest)}
.plan-top h2{margin:12px 0 8px;font-size:clamp(1.7rem,3.4vw,2.3rem)}
.plan-sub{margin:0;color:var(--ink-2)}
.plan-figure{font:800 clamp(2.4rem,5vw,3.2rem)/1 var(--f-display);color:var(--forest);font-variant-numeric:tabular-nums;white-space:nowrap}
.plan-figure small{font-size:1rem}
.plan-h{margin:28px 0 14px;font-size:1.1rem}
.plan-perks{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.plan-perks li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;font-size:.98rem;line-height:1.6;color:var(--ink-2)}
.plan-perks svg{width:20px;height:20px;margin-top:3px;color:var(--forest);flex:none}
.plan-perks b{color:var(--ink)}
.plan-after{margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.plan-steps{margin:0;padding-left:1.2em;display:grid;gap:10px;color:var(--ink-2);line-height:1.6}
.plan-steps b{color:var(--ink)}
.warn{display:inline-block;padding:1px 8px;border-radius:8px;background:rgba(226,180,92,.22);color:#7A5A12;font-weight:700}
.start-agree{margin-top:26px;display:grid;gap:20px}
.hours-box{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;padding:20px;border-radius:20px;background:var(--mist)}
.hours-box .ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--forest);color:var(--cream)}
.hours-box .ic svg{width:22px;height:22px}
.hours-box p{margin:0;font-size:.95rem;line-height:1.6;color:var(--ink-2)}
.agree-check{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;padding:18px 20px;border-radius:18px;cursor:pointer;
  background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.agree-check:has(input:checked){box-shadow:inset 0 0 0 2px var(--forest);background:var(--mist)}
.agree-check input{width:24px;height:24px;margin-top:1px;accent-color:var(--forest)}
.agree-check span{font-size:.96rem;line-height:1.55;color:var(--ink-2)}
#startform{display:grid;gap:18px}
#startform .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.start-sec .field span{font-weight:700;color:var(--ink);font-size:.9rem}
.start-sec .field input{width:100%;min-height:54px;padding:14px 16px;border-radius:14px;border:1.5px solid var(--line-2);background:var(--card);color:var(--ink);font:inherit}
.start-sec .field input:focus{outline:none;border-color:var(--forest);box-shadow:0 0 0 4px rgba(110,140,90,.18)}
.start-sec .field.invalid input{border-color:#C4553A}
.start-sec .field small{font-size:.82rem;color:var(--ink-3)}
#gopay{justify-self:start}
#gopay:disabled{opacity:.45;cursor:not-allowed}
.pay-secure{display:flex;align-items:center;gap:8px;margin:0;font-size:.86rem;color:var(--ink-3)}
.pay-secure svg{width:16px;height:16px}
.test-note{display:inline;margin:0;color:#8A6A1E;font-weight:700}
.pay-fail{margin:0;padding:14px 16px;border-radius:14px;background:rgba(196,85,58,.1);color:#8A3A22;font-size:.92rem}
.start-q{margin:28px 0 0;text-align:center;color:var(--ink-3)}
@media (max-width:700px){ .plan-switch,#startform .grid-2{grid-template-columns:1fr} }

/* ——— /welcome/ ——— */
.welcome-steps{list-style:none;counter-reset:w;margin:36px 0 0;padding:0;display:grid;gap:16px}
.welcome-steps li{counter-increment:w;display:grid;grid-template-columns:auto 1fr;gap:18px;padding:22px;border-radius:22px;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow)}
.welcome-steps li::before{content:counter(w);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--forest);color:var(--cream);font:800 1.05rem/1 var(--f-display)}
.welcome-steps h3{margin:0 0 6px;font-size:1.15rem}
.welcome-steps p{margin:0;color:var(--ink-2);line-height:1.6}
.spam-box{margin-top:28px;padding:20px;border-radius:20px;background:rgba(226,180,92,.16);box-shadow:inset 0 0 0 1.5px rgba(226,180,92,.5)}
.spam-box p{margin:0;color:#6B4E10;line-height:1.6}
.spam-box b{color:#4A360A}

/* agreement version + fingerprint */
.version-box{margin:0 0 28px;padding:18px 20px;border-radius:18px;background:var(--mist)}
.version-box p{margin:0 0 6px}
.version-box p:last-child{margin-bottom:0}
.fingerprint{font-size:.82rem;color:var(--ink-3);word-break:break-all}
.fingerprint code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem}
.version-why{font-size:.88rem;line-height:1.6;color:var(--ink-3)}
.agree-note{display:block;margin-top:6px;font-size:.86rem;color:var(--ink-3)}

/* ——— /how-it-works/ : a tracked timeline with a stage that follows ——— */
.hiw{--hiw-max:1080px}
.hiw .head,.hiw-track{max-width:var(--hiw-max);margin-inline:auto}
.hiw-track{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,4vw,64px);align-items:start;margin-top:44px}
.hiw-steps{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:14px}
.hiw-rail{position:absolute;left:21px;top:22px;bottom:22px;width:2px;background:var(--line-2);overflow:hidden;padding:0}
.hiw-rail i{position:absolute;inset:0;transform-origin:top;transform:scaleY(var(--p,0));
  background:linear-gradient(180deg,var(--bar-1),var(--bar-2),var(--bar-3));transition:transform .5s var(--e-out)}
.hiw-step{position:relative;display:grid;grid-template-columns:auto 1fr;gap:18px;padding:clamp(18px,2.2vw,26px);border-radius:22px;
  background:var(--card);box-shadow:0 0 0 1px var(--line);transition:box-shadow var(--t-base),transform var(--t-base) var(--e-out)}
.hiw-step.on{box-shadow:0 0 0 1.5px var(--forest),var(--shadow-lg);transform:translateX(4px)}
.hiw-n{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:var(--mist);color:var(--forest);font:800 1.05rem/1 var(--f-display);
  transition:background-color var(--t-base),color var(--t-base),transform var(--t-base) var(--e-back)}
.hiw-step.on .hiw-n{background:var(--forest);color:var(--cream);transform:scale(1.08)}
.hiw-steps h3{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0 12px;font-size:1.18rem}
.hiw-who{padding:4px 10px;border-radius:99px;font-size:.68rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.hiw-who.you{background:rgba(226,180,92,.25);color:#7A5A12}
.hiw-who.me{background:var(--mist);color:var(--forest)}
.hiw-who.both{background:rgba(110,140,90,.2);color:var(--forest)}
.hiw-steps ul{margin:0;padding-left:1.15em;display:grid;gap:7px;color:var(--ink-2);line-height:1.55;font-size:.96rem}
.hiw-steps b{color:var(--ink)}
.hiw-note{margin:12px 0 0;padding:10px 14px;border-radius:12px;background:var(--mist);font-size:.88rem;color:var(--forest);font-weight:600}

/* the stage */
.hiw-stage{position:sticky;top:104px}
.hs-window{border-radius:20px;overflow:hidden;background:var(--night);box-shadow:var(--shadow-lg);aspect-ratio:4/3}
.hs-bar{display:flex;align-items:center;gap:7px;padding:12px 14px;background:rgba(232,237,227,.07)}
.hs-bar i{width:9px;height:9px;border-radius:50%;background:rgba(232,237,227,.25)}
.hs-url{margin-left:10px;padding:4px 12px;border-radius:99px;background:rgba(232,237,227,.08);color:var(--cream-3);font-size:.72rem}
.hs-body{position:relative;height:calc(100% - 41px);display:grid;place-items:center;padding:22px}
.hs-scene{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;padding:22px;
  opacity:0;transform:translateY(10px) scale(.98);transition:opacity var(--t-base),transform var(--t-base) var(--e-out);pointer-events:none}
.hiw-stage[data-active="0"] .hs-scene[data-scene="0"],.hiw-stage[data-active="1"] .hs-scene[data-scene="1"],
.hiw-stage[data-active="2"] .hs-scene[data-scene="2"],.hiw-stage[data-active="3"] .hs-scene[data-scene="3"],
.hiw-stage[data-active="4"] .hs-scene[data-scene="4"],.hiw-stage[data-active="5"] .hs-scene[data-scene="5"]{opacity:1;transform:none}
.hs-line{display:block;height:8px;border-radius:99px;background:rgba(232,237,227,.18)}
.hs-line.w80{width:80%}.hs-line.w70{width:70%}.hs-line.w60{width:60%}.hs-line.w50{width:50%}.hs-line.w40{width:40%}
.hs-card{display:grid;gap:10px;justify-items:start;width:min(280px,90%);padding:20px;border-radius:18px;background:rgba(232,237,227,.07);box-shadow:inset 0 0 0 1px rgba(232,237,227,.14)}
.hs-tag{padding:3px 10px;border-radius:99px;background:var(--sage);color:var(--night);font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.hs-card b{font:800 2.2rem/1 var(--f-display);color:var(--cream)}
.hs-card b small{font-size:.9rem}
.hs-tick{display:flex;align-items:center;gap:8px;margin-top:4px;color:var(--sage);font-size:.84rem;font-weight:700}
.hs-tick svg{width:18px;height:18px}
.hs-mail{display:grid;gap:10px;justify-items:center;width:min(240px,80%)}
.hs-mail svg{width:76px;height:52px;color:var(--sage)}
.hs-badge{padding:6px 14px;border-radius:99px;background:rgba(232,237,227,.1);color:var(--cream-2);font-size:.76rem;font-weight:700}
.hs-badge.live{background:var(--sage);color:var(--night)}
.hs-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(290px,92%)}
.hs-field{height:34px;border-radius:10px;background:rgba(232,237,227,.07);box-shadow:inset 0 0 0 1px rgba(232,237,227,.14);overflow:hidden}
.hs-field.wide{grid-column:1/-1}
.hs-field i{display:block;height:100%;width:0;background:rgba(167,188,145,.3)}
.hs-build{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(280px,90%)}
.hs-build .blk{border-radius:8px;background:rgba(232,237,227,.12);opacity:0}
.blk.b1{grid-column:1/-1;height:44px}.blk.b2,.blk.b3,.blk.b4{height:52px}.blk.b5{grid-column:1/-1;height:26px}
.hs-review{display:grid;gap:10px;justify-items:start;width:min(280px,90%);position:relative}
.hs-comment{margin-top:6px;padding:10px 14px;border-radius:14px 14px 14px 4px;background:var(--sage);color:var(--night);font-size:.84rem;font-weight:700}
.hs-live{display:grid;gap:14px;justify-items:center}
.hs-domain{display:flex;align-items:center;gap:8px;padding:10px 18px;border-radius:99px;background:rgba(232,237,227,.08);box-shadow:inset 0 0 0 1px rgba(167,188,145,.4);color:var(--cream);font-weight:700}
.hs-domain svg{width:18px;height:18px;color:var(--sage)}
.hs-pulse{width:14px;height:14px;border-radius:50%;background:var(--sage)}

/* motion, only when the stage is on screen and motion is welcome */
@media (prefers-reduced-motion:no-preference){
  .hiw-stage:not(.paused)[data-active="2"] .hs-field i{animation:hsFill .7s var(--e-out) forwards}
  .hiw-stage[data-active="2"] .hs-field:nth-child(2) i{animation-delay:.12s}
  .hiw-stage[data-active="2"] .hs-field:nth-child(3) i{animation-delay:.24s}
  .hiw-stage[data-active="2"] .hs-field:nth-child(4) i{animation-delay:.36s}
  .hiw-stage:not(.paused)[data-active="3"] .blk{animation:hsPop .45s var(--e-back) forwards}
  .hiw-stage[data-active="3"] .blk.b2{animation-delay:.1s}.hiw-stage[data-active="3"] .blk.b3{animation-delay:.2s}
  .hiw-stage[data-active="3"] .blk.b4{animation-delay:.3s}.hiw-stage[data-active="3"] .blk.b5{animation-delay:.4s}
  .hiw-stage:not(.paused)[data-active="1"] .hs-mail svg{animation:hsFloat 2.6s var(--e-inout) infinite}
  .hiw-stage:not(.paused)[data-active="5"] .hs-pulse{animation:hsPulse 1.8s var(--e-inout) infinite}
}
@keyframes hsFill{to{width:100%}}
@keyframes hsPop{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
@keyframes hsFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes hsPulse{0%,100%{box-shadow:0 0 0 0 rgba(167,188,145,.55)}70%{box-shadow:0 0 0 16px rgba(167,188,145,0)}}
@media (max-width:900px){
  .hiw-track{grid-template-columns:1fr}
  .hiw-stage{position:relative;top:0;order:-1;margin-bottom:8px}
  .hs-window{aspect-ratio:16/11}
}

.hiw-rules{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}
.rule{display:grid;align-content:start;gap:10px;padding:clamp(20px,2.6vw,28px);border-radius:22px;background:rgba(232,237,227,.05);box-shadow:inset 0 0 0 1px rgba(232,237,227,.12)}
.rule-tag{justify-self:start;padding:4px 12px;border-radius:99px;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.rule.good .rule-tag{background:var(--sage);color:var(--night)}
.rule.no{background:rgba(224,135,106,.1);box-shadow:inset 0 0 0 1px rgba(224,135,106,.35)}
.rule.no .rule-tag{background:#E0876A;color:var(--night)}
.rule h3{margin:0;font-size:1.2rem;color:var(--cream)}
.rule p{margin:0;font-size:.96rem;line-height:1.6}
.rule .btn{justify-self:start;margin-top:4px;word-break:break-all}
.rule-extra{padding-top:10px;border-top:1px solid rgba(232,237,227,.14);color:var(--cream-3);font-size:.9rem}
.hiw-hours{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;margin-top:22px;padding:24px;border-radius:22px;background:rgba(167,188,145,.12);box-shadow:inset 0 0 0 1.5px rgba(167,188,145,.4)}
.hiw-hours .ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--sage);color:var(--night)}
.hiw-hours .ic svg{width:24px;height:24px}
.hiw-hours h3{margin:0 0 6px;font-size:1.15rem;color:var(--cream)}
.hiw-hours p{margin:0;line-height:1.6}
.batch{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}
.batch-card{padding:clamp(20px,2.6vw,30px);border-radius:24px;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow)}
.batch-card h3{margin:0 0 14px;font-size:1.2rem}
.batch-why{margin:22px 0 0;padding:20px;border-radius:18px;background:var(--mist);line-height:1.65;color:var(--ink-2)}
.batch-why b{color:var(--ink)}
@media (max-width:820px){ .hiw-rules,.batch{grid-template-columns:1fr} }
.hours-list{margin:0 0 10px;padding-left:1.15em;display:grid;gap:8px;line-height:1.6}
.hours-list b{color:var(--cream)}
.ik-cant{background:rgba(224,135,106,.12);box-shadow:inset 0 0 0 1px rgba(224,135,106,.35);padding:14px 16px;border-radius:14px;color:var(--cream-2)}
.ik-cant b{color:var(--cream)}

/* ——— how-it-works hero stage ——— */
.hiw-hero-stage{position:relative;height:190px;max-width:620px;margin:34px auto 0}
.hh-thread{position:absolute;inset:0;width:100%;height:100%;color:rgba(167,188,145,.5)}
.hh-chip{position:absolute;display:grid;gap:2px;padding:12px 18px;border-radius:16px;background:rgba(232,237,227,.08);
  box-shadow:inset 0 0 0 1px rgba(232,237,227,.18);color:var(--cream);font-weight:800;font-size:.95rem;white-space:nowrap;
  translate:calc(var(--px,0) * 7px) calc(var(--py,0) * 7px);transition:translate var(--t-slow) var(--e-out)}
.hh-chip i{font-style:normal;font-weight:600;font-size:.76rem;color:var(--sage)}
.hh-chip.c1{left:0;top:56%}.hh-chip.c2{left:29%;top:2%}.hh-chip.c3{right:26%;top:62%}.hh-chip.c4{right:0;top:6%}
.js .hh-chip{opacity:0;transform:translateY(10px)}
.in .hh-chip,.hiw-hero-stage.in .hh-chip{opacity:1;transform:none;transition:opacity var(--t-slow) var(--e-out),transform var(--t-slow) var(--e-out),translate var(--t-slow) var(--e-out)}
.hiw-hero-stage.in .hh-chip.c2{transition-delay:.1s}.hiw-hero-stage.in .hh-chip.c3{transition-delay:.2s}.hiw-hero-stage.in .hh-chip.c4{transition-delay:.3s}
@media (prefers-reduced-motion:no-preference){
  .hiw-hero-stage:not(.paused) .hh-thread path{stroke-dashoffset:120;animation:hhDash 6s linear infinite}
}
@keyframes hhDash{to{stroke-dashoffset:0}}
@media (max-width:760px){ .hiw-hero-stage{height:230px} .hh-chip{font-size:.84rem;padding:9px 13px} }

/* ——— the batching week ——— */
.batch-week{margin-top:22px;padding:24px;border-radius:24px;background:var(--card);box-shadow:0 0 0 1px var(--line),var(--shadow)}
.bw-days{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;align-items:end}
.bw-day{display:grid;justify-items:center;gap:6px;padding:16px 8px 14px;border-radius:16px;background:var(--paper);min-height:96px;align-content:end}
.bw-day b{font-size:.78rem;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}
.bw-day .dot{width:12px;height:12px;border-radius:50%;background:var(--mist);box-shadow:inset 0 0 0 1.5px var(--forest)}
.bw-day.ship{background:var(--forest);min-height:118px}
.bw-day.ship b{color:rgba(232,237,227,.75)}
.bw-ship{color:var(--cream);font-weight:800;font-size:.9rem;text-align:center;line-height:1.25}
.bw-cap{margin:16px 0 0;text-align:center;font-size:.92rem;color:var(--ink-3)}
@media (prefers-reduced-motion:no-preference){
  .batch-week.in .dot{animation:bwDrop .5s var(--e-back) both}
  .batch-week.in .bw-day:nth-child(2) .dot{animation-delay:.1s}
  .batch-week.in .bw-day:nth-child(3) .dot{animation-delay:.2s}
  .batch-week.in .bw-day:nth-child(4) .dot{animation-delay:.3s}
  .batch-week.in .bw-day.ship{animation:bwShip .6s var(--e-back) .45s both}
}
@keyframes bwDrop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes bwShip{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:620px){ .bw-days{grid-template-columns:repeat(5,1fr);gap:6px} .bw-ship{font-size:.72rem} }


/* ═════════ GOOGLE ADS · motion additions (30 Oct 2026) ═════════
   Search marquee + animated email composer. Only transform/opacity move;
   prefers-reduced-motion gets a still version. */
.btn-lg{padding:1.15em 1.9em;font-size:1.06rem}
.btn svg:not(.arrow){width:1.1em;height:1.1em}

.gx-band{position:relative;background:var(--forest-deep);padding:clamp(26px,4vw,40px) 0;overflow:hidden}
.gx-row{overflow:hidden;padding:7px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.gx-track{display:flex;gap:14px;width:max-content;animation:gx-scroll 46s linear infinite}
.gx-row.r2 .gx-track{animation-duration:58s;animation-direction:reverse}
.gx-band:hover .gx-track{animation-play-state:paused}
.gx-q{display:inline-flex;align-items:center;gap:.55em;white-space:nowrap;padding:.62em 1.1em;border-radius:999px;
  background:rgba(232,237,227,.06);border:1px solid rgba(167,188,145,.22);color:var(--cream);font-weight:600;font-size:.98rem}
.gx-q svg{width:1em;height:1em;color:var(--sage)}
.gx-row.r2 .gx-q{background:rgba(167,188,145,.12);color:var(--sage-2)}
.gx-band-note{text-align:center;color:var(--sage);font-size:1.45rem;margin:12px 0 0;transform:rotate(-1.5deg)}
@keyframes gx-scroll{to{transform:translateX(-50%)}}

.gx-mail{position:relative;overflow:hidden}
.gx-glow{position:absolute;inset:auto -10% -40% auto;width:60vw;height:60vw;max-width:760px;max-height:760px;border-radius:50%;
  background:radial-gradient(circle,rgba(110,140,90,.35),transparent 65%);filter:blur(10px);animation:gx-breathe 9s var(--e-inout) infinite alternate;pointer-events:none}
@keyframes gx-breathe{from{transform:translate(0,0) scale(1)}to{transform:translate(-6%,-4%) scale(1.12)}}
.gx-mail-grid > *{min-width:0}
.gx-addr a{overflow-wrap:anywhere}
.gx-mail-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,6vw,80px);align-items:center}
.gx-mail-list{list-style:none;padding:0;margin:22px 0 28px;display:grid;gap:10px}
.gx-mail-list li{display:flex;gap:.6em;align-items:flex-start;color:var(--cream)}
.gx-mail-list li span{flex:1}
.gx-mail-list svg{width:1.15em;height:1.15em;flex:none;color:var(--sage);margin-top:.15em}
.gx-mail-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.gx-addr{margin:0;color:var(--cream-3);font-size:.95rem}
.gx-addr a{color:var(--sage-2);text-decoration:underline;text-underline-offset:3px}

.gx-compose{position:relative;min-height:400px}
.gx-win{position:relative;background:var(--card);color:var(--ink);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;
  animation:gx-float 7s var(--e-inout) infinite alternate}
@keyframes gx-float{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-10px) rotate(.5deg)}}
.gx-win-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:var(--paper-2);font-size:.82rem;font-weight:700;color:var(--ink-2)}
.gx-win-bar i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.gx-win-bar span{margin-left:8px}
.gx-field{display:flex;gap:12px;padding:11px 18px;border-bottom:1px solid var(--line);font-size:.95rem}
.gx-field small{width:58px;color:var(--ink-3);font-weight:600}
.gx-type{display:inline-block;overflow:hidden;white-space:nowrap;border-right:2px solid var(--forest);width:0;animation:gx-typing 10s steps(26,end) infinite}
@keyframes gx-typing{0%{width:0}22%,100%{width:26ch}}
.gx-body{padding:16px 18px 6px;min-height:118px}
.gx-l{margin:0 0 8px;opacity:0;transform:translateY(6px);animation:gx-line 10s var(--e-out) infinite}
.gx-l.l1{animation-delay:0s}.gx-l.l2{animation-delay:.6s}.gx-l.l3{animation-delay:1.2s}
@keyframes gx-line{0%,26%{opacity:0;transform:translateY(6px)}34%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
.gx-send{padding:0 18px 18px}
.gx-send span{display:inline-block;padding:.6em 1.4em;border-radius:999px;background:var(--forest);color:#F4F7EF;font-weight:700;animation:gx-press 10s var(--e-out) infinite}
@keyframes gx-press{0%,50%{transform:scale(1);box-shadow:0 0 0 0 rgba(36,81,58,.5)}54%{transform:scale(.92)}58%{transform:scale(1);box-shadow:0 0 0 14px rgba(36,81,58,0)}100%{transform:scale(1)}}
.gx-toast,.gx-ping{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:16px;background:var(--night-3);color:var(--cream);
  border:1px solid rgba(167,188,145,.25);box-shadow:var(--shadow-lg);font-weight:700;opacity:0}
.gx-toast small,.gx-ping small{display:block;font-weight:500;color:var(--cream-3);font-size:.8rem}
.gx-toast svg,.gx-ping svg{width:22px;height:22px;color:var(--sage);flex:none}
.gx-toast{left:-18px;bottom:-14px;animation:gx-pop 10s var(--e-back) infinite}
@keyframes gx-pop{0%,56%{opacity:0;transform:translateY(16px) scale(.9)}62%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
.gx-ping.p1{right:-14px;top:-22px;animation:gx-ping 10s var(--e-back) infinite;animation-delay:.4s}
.gx-ping.p2{right:8%;bottom:-48px;animation:gx-ping 10s var(--e-back) infinite;animation-delay:1.4s}
@keyframes gx-ping{0%,64%{opacity:0;transform:translateX(18px)}70%,92%{opacity:1;transform:none}98%,100%{opacity:0}}

@media (max-width:860px){
  .gx-mail-grid{grid-template-columns:minmax(0,1fr)}
  .gx-field span{overflow-wrap:anywhere}
  .gx-compose{min-height:0;margin:10px 12px 40px}
  .gx-ping.p1{right:-6px;top:-26px}.gx-toast{left:-6px}
  .gx-q{font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){
  .gx-track,.gx-glow,.gx-win,.gx-type,.gx-l,.gx-send span,.gx-toast,.gx-ping{animation:none}
  .gx-type{width:auto;border-right:0}.gx-l{opacity:1;transform:none}
  .gx-toast,.gx-ping{opacity:1}
}

/* ═════════ HOME HERO · service + price ladder (30 Oct 2026) ═════════ */
.hx-ladder{list-style:none;padding:0;margin:clamp(18px,2.4vw,26px) 0 14px;display:grid;gap:10px;max-width:560px}
.hx-ladder li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-radius:var(--r);
  background:rgba(232,237,227,.06);border:1px solid rgba(167,188,145,.22);color:var(--cream);
  opacity:0;transform:translateX(-14px);animation:hx-in .7s var(--e-out) forwards;animation-delay:calc(.45s + var(--i)*.14s)}
.hx-ladder li:hover{border-color:rgba(167,188,145,.5);background:rgba(232,237,227,.09)}
.hx-what{display:flex;align-items:center;gap:.7em;font-weight:600;line-height:1.3}
.hx-what svg{width:1.2em;height:1.2em;flex:none;color:var(--sage)}
.hx-price{white-space:nowrap;color:var(--cream-3);font-size:.95rem}
.hx-price b{font-family:var(--f-display);font-size:1.55rem;color:var(--sage-2);margin-right:2px}
@keyframes hx-in{to{opacity:1;transform:none}}
@media (max-width:560px){.hx-ladder li{padding:12px 14px}.hx-what{font-size:.95rem}.hx-price b{font-size:1.3rem}}
@media (prefers-reduced-motion:reduce){.hx-ladder li{animation:none;opacity:1;transform:none}}

/* ═════════ SEO PAGE (30 Oct 2026) · sx- ═════════ */
.plans-1{display:grid;grid-template-columns:minmax(0,560px);justify-content:center}
.sx-band .gx-row.r1 .gx-track{animation-duration:52s}

/* hero: your listing climbs the results */
.sx-serp{position:relative;background:var(--card);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:18px;color:var(--ink);width:min(460px,100%);justify-self:end}
.sx-sbar{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);border-radius:999px;padding:9px 14px;font-size:.9rem;margin-bottom:14px}
.sx-sbar svg{width:1em;height:1em;color:var(--ink-3)}
.sx-list{position:relative;height:276px}
.sx-row{position:absolute;left:0;right:0;height:62px;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--paper);transition:none}
.sx-row > div{flex:1;display:grid;gap:6px}
.sx-row i{display:block;height:7px;border-radius:4px;background:var(--line-2)}
.sx-row i.u{width:38%;height:6px;background:var(--sage-2)}.sx-row i.t{width:80%;height:9px;background:#9db3d6}.sx-row i.d{width:62%}
.sx-row b.t{font-size:.86rem;color:#1a4fb5;line-height:1.2}
.sx-rank{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--paper-2);font-weight:800;font-size:.8rem;color:var(--ink-3);position:relative;flex:none}
.sx-rank b{position:absolute;opacity:0}
.r-you{background:#fff;border:2px solid var(--sage);z-index:3;box-shadow:0 10px 30px -12px rgba(15,42,30,.35)}
.r-you .sx-rank{background:var(--forest);color:#fff}
.sx-up{color:var(--moss);font-size:.9rem;opacity:0}
/* 12s loop: you start at slot 4, rise to 2, then 1; others shuffle down */
.r-you{animation:sx-you 12s var(--e-inout) infinite}
.r-a{animation:sx-a 12s var(--e-inout) infinite}.r-b{animation:sx-b 12s var(--e-inout) infinite}.r-c{animation:sx-c 12s var(--e-inout) infinite}
@keyframes sx-you{0%,18%{transform:translateY(214px)}38%,55%{transform:translateY(71px)}72%,92%{transform:translateY(0)}100%{transform:translateY(214px)}}
@keyframes sx-a{0%,55%{transform:translateY(0)}72%,92%{transform:translateY(71px)}100%{transform:translateY(0)}}
@keyframes sx-b{0%,18%{transform:translateY(71px)}38%,92%{transform:translateY(142px)}100%{transform:translateY(71px)}}
@keyframes sx-c{0%,18%{transform:translateY(142px)}38%,92%{transform:translateY(214px)}100%{transform:translateY(142px)}}
.r-you .n7{animation:sx-n7 12s steps(1) infinite}.r-you .n3{animation:sx-n3 12s steps(1) infinite}.r-you .n1{animation:sx-n1 12s steps(1) infinite}
@keyframes sx-n7{0%,30%{opacity:1}31%,100%{opacity:0}}
@keyframes sx-n3{0%,30%{opacity:0}31%,64%{opacity:1}65%,100%{opacity:0}}
@keyframes sx-n1{0%,64%{opacity:0}65%,97%{opacity:1}98%,100%{opacity:0}}
.r-you .sx-up{animation:sx-upa 12s var(--e-out) infinite}
@keyframes sx-upa{0%,20%{opacity:0;transform:translateY(6px)}28%,40%{opacity:1;transform:none}46%,56%{opacity:0}62%,74%{opacity:1;transform:none}82%,100%{opacity:0}}
.sx-note{position:absolute;right:6px;bottom:-40px;color:var(--sage);font-size:1.35rem;transform:rotate(-3deg);margin:0}

/* four cards */
.sx-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:clamp(28px,4vw,48px)}
.sx-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 18px 22px;box-shadow:var(--shadow)}
.sx-card h3{margin:16px 0 8px;font-size:1.12rem}
.sx-card p{margin:0;color:var(--ink-2);font-size:.95rem}
.sx-vis{position:relative;height:150px;border-radius:var(--r);background:var(--night-2);overflow:hidden}
/* rank chart */
.sx-v-rank svg{position:absolute;inset:16px 14px 14px;width:calc(100% - 28px);height:calc(100% - 30px)}
.sx-grid{stroke:rgba(232,237,227,.08);stroke-width:1;fill:none}
.sx-line{fill:none;stroke:var(--sage);stroke-width:4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:sx-draw 5s var(--e-out) infinite}
@keyframes sx-draw{0%{stroke-dashoffset:1;opacity:1}55%,88%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.sx-chip{position:absolute;right:12px;top:10px;background:var(--sage);color:var(--night);font-weight:800;font-size:.75rem;padding:4px 10px;border-radius:999px;animation:sx-chip 5s var(--e-back) infinite}
@keyframes sx-chip{0%,50%{opacity:0;transform:scale(.6)}58%,90%{opacity:1;transform:none}100%{opacity:0}}
/* blog */
.sx-doc{position:absolute;inset:14px 18px;background:var(--card);border-radius:12px;padding:12px;display:grid;gap:7px;align-content:start}
.sx-doc .h{font-weight:800;font-size:.72rem;color:var(--ink);line-height:1.25;overflow:hidden;white-space:nowrap;border-right:2px solid var(--forest);width:0;animation:sx-ty 6s steps(30,end) infinite}
@keyframes sx-ty{0%{width:0}35%,100%{width:100%;border-color:transparent}}
.sx-doc i{display:block;height:6px;border-radius:3px;background:var(--line-2);transform-origin:left;transform:scaleX(0);animation:sx-grow 6s var(--e-out) infinite}
.sx-doc i:nth-of-type(2){animation-delay:.3s}.sx-doc i:nth-of-type(3){animation-delay:.6s}.sx-doc i.s{width:55%;animation-delay:.9s}
@keyframes sx-grow{0%,35%{transform:scaleX(0)}55%,100%{transform:scaleX(1)}}
.sx-pub{position:absolute;right:12px;bottom:10px;background:var(--forest);color:#F4F7EF;font-weight:700;font-size:.75rem;padding:5px 10px;border-radius:999px;animation:sx-chip 6s var(--e-back) infinite;animation-delay:.6s}
/* gbp */
.sx-tiles{position:absolute;inset:14px 14px 56px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.sx-tiles i{border-radius:8px;background:linear-gradient(135deg,var(--moss),var(--forest));opacity:0;transform:scale(.7);animation:sx-tile 6s var(--e-back) infinite}
.sx-tiles i:nth-child(2){background:linear-gradient(135deg,var(--sage),var(--moss));animation-delay:.25s}
.sx-tiles i:nth-child(3){background:linear-gradient(135deg,#c9a46a,#8a6a3c);animation-delay:.5s}
.sx-tiles i:nth-child(4){background:linear-gradient(135deg,var(--sage-2),var(--sage));animation-delay:.75s}
@keyframes sx-tile{0%,8%{opacity:0;transform:scale(.7)}20%,85%{opacity:1;transform:none}100%{opacity:0}}
.sx-post{position:absolute;left:14px;right:14px;bottom:10px;background:var(--card);border-radius:10px;padding:7px 10px;display:grid;font-size:.78rem;color:var(--ink);
  animation:sx-slide 6s var(--e-out) infinite}
.sx-post small{color:var(--ink-3)}
@keyframes sx-slide{0%,30%{opacity:0;transform:translateY(14px)}42%,88%{opacity:1;transform:none}100%{opacity:0}}
/* reviews */
.sx-stars{position:absolute;left:14px;top:12px;display:flex;gap:3px;font-size:1.15rem}
.sx-stars span{color:rgba(232,237,227,.2);animation:sx-star 6s steps(1) infinite}
.sx-stars span:nth-child(2){animation-delay:.15s}.sx-stars span:nth-child(3){animation-delay:.3s}.sx-stars span:nth-child(4){animation-delay:.45s}.sx-stars span:nth-child(5){animation-delay:.6s}
@keyframes sx-star{0%,5%{color:rgba(232,237,227,.2)}10%,92%{color:#f2c14e}100%{color:rgba(232,237,227,.2)}}
.sx-bub{position:absolute;font-size:.72rem;line-height:1.3;padding:7px 10px;border-radius:12px;max-width:80%}
.sx-bub.c{left:14px;top:44px;background:rgba(232,237,227,.1);color:var(--cream);animation:sx-slide 6s var(--e-out) infinite;animation-delay:-1.6s}
.sx-bub.o{right:12px;bottom:10px;background:var(--sage);color:var(--night);font-weight:600;animation:sx-slide 6s var(--e-out) infinite}

/* map */
.sx-map-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,80px);align-items:center}
.sx-map{position:relative;height:420px;border-radius:var(--r-lg);background:#dfe6d4;overflow:hidden;box-shadow:var(--shadow-lg)}
.sx-roads i{position:absolute;background:#fff;opacity:.85}
.sx-roads i:nth-child(1){left:0;right:0;top:34%;height:10px;transform:rotate(-6deg)}
.sx-roads i:nth-child(2){top:0;bottom:0;left:40%;width:12px;transform:rotate(8deg)}
.sx-roads i:nth-child(3){left:0;right:0;top:70%;height:7px;transform:rotate(4deg)}
.sx-roads i:nth-child(4){top:0;bottom:0;left:76%;width:7px;transform:rotate(-10deg)}
.sx-pin{position:absolute;width:22px;height:22px;border-radius:50% 50% 50% 0;background:#9aa69a;transform:rotate(-45deg);animation:sx-drop 7s var(--e-back) infinite}
.sx-pin.p1{left:18%;top:20%;animation-delay:.2s}.sx-pin.p2{left:80%;top:12%;animation-delay:.4s}.sx-pin.p3{left:30%;top:42%;animation-delay:.6s}
.sx-pin.you{left:50%;top:22%;width:34px;height:34px;background:var(--forest);animation-delay:1s;z-index:2}
.sx-pin.you b{position:absolute;inset:0;display:grid;place-items:center;transform:rotate(45deg);color:#fff;font-size:.62rem}
.sx-pin.you::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px solid var(--forest);animation:sx-ring 2s var(--e-out) infinite}
@keyframes sx-drop{0%,4%{opacity:0;translate:0 -40px}14%,92%{opacity:1;translate:0 0}100%{opacity:0}}
@keyframes sx-ring{from{opacity:.7;transform:scale(.6)}to{opacity:0;transform:scale(1.8)}}
.sx-pack{position:absolute;left:16px;right:16px;bottom:16px;background:var(--card);border-radius:var(--r);padding:10px;display:grid;gap:8px;box-shadow:var(--shadow-lg)}
.sx-li{display:grid;gap:5px;padding:8px 10px;border-radius:12px}
.sx-li i{display:block;height:8px;width:60%;border-radius:4px;background:var(--line-2)}.sx-li i.s{width:40%;height:6px}
.sx-li.you{background:var(--mist);color:var(--ink);animation:sx-hi 7s var(--e-out) infinite}
.sx-li.you .st{color:#d29b16;font-size:.9rem}.sx-li.you .st small,.sx-li.you > small{color:var(--ink-3)}
@keyframes sx-hi{0%,20%{box-shadow:0 0 0 0 rgba(36,81,58,0)}30%{box-shadow:0 0 0 4px rgba(36,81,58,.35)}45%,100%{box-shadow:0 0 0 0 rgba(36,81,58,0)}}

/* website included */
.sx-site-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(30px,6vw,80px);align-items:center}
.sx-browser{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;animation:gx-float 8s var(--e-inout) infinite alternate}
.sx-browser .chrome{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--paper-2)}
.sx-browser .chrome i{width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.sx-browser .url{margin-left:10px;display:flex;gap:6px;align-items:center;font-size:.78rem;color:var(--ink-3)}
.sx-browser .url svg{width:.9em;height:.9em}
.sx-page{position:relative;padding:16px;display:grid;gap:9px;min-height:300px}
.sx-hero-b{display:block;height:110px;border-radius:12px;background:linear-gradient(135deg,var(--forest),var(--moss));animation:sx-swap 9s steps(1) infinite}
@keyframes sx-swap{0%,40%{background:linear-gradient(135deg,var(--forest),var(--moss))}41%,100%{background:linear-gradient(135deg,#8a6a3c,#c9a46a)}}
.sx-txt{display:block;height:9px;border-radius:5px;background:var(--line-2)}.sx-txt.w1{width:70%}.sx-txt.w2{width:48%}
.sx-btnb{display:block;width:120px;height:26px;border-radius:999px;background:var(--forest)}
.sx-edits{position:absolute;right:12px;bottom:12px;display:grid;gap:6px}
.sx-edits p{margin:0;display:flex;gap:6px;align-items:center;background:var(--night-3);color:var(--cream);font-size:.76rem;font-weight:600;padding:7px 10px;border-radius:10px;opacity:0;animation:sx-edit 9s var(--e-back) infinite}
.sx-edits svg{width:1em;height:1em;color:var(--sage)}
.sx-edits .e1{animation-delay:.6s}.sx-edits .e2{animation-delay:2.2s}.sx-edits .e3{animation-delay:3.8s}
@keyframes sx-edit{0%{opacity:0;transform:translateX(18px)}8%,62%{opacity:1;transform:none}70%,100%{opacity:0}}

/* timeline */
.sx-time{list-style:none;padding:0;margin:clamp(26px,4vw,44px) 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;position:relative}
.sx-rail{position:absolute;left:18px;right:18px;top:18px;height:3px;background:rgba(232,237,227,.1);overflow:hidden;grid-column:1/-1}
.sx-rail i{display:block;height:100%;width:30%;background:linear-gradient(90deg,transparent,var(--sage),transparent);animation:sx-run 3.5s linear infinite}
@keyframes sx-run{from{transform:translateX(-100%)}to{transform:translateX(400%)}}
.sx-time li:not(.sx-rail){position:relative;padding-top:52px}
.sx-dot{position:absolute;top:0;left:0;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--forest);color:#fff;font-weight:800;box-shadow:0 0 0 6px var(--night)}
.sx-time h3{color:var(--cream);font-size:1.05rem;margin:0 0 6px}
.sx-time p{margin:0;color:var(--cream-2);font-size:.95rem}

@media (max-width:1000px){.sx-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.sx-time{grid-template-columns:repeat(2,minmax(0,1fr))}.sx-rail{display:none}}
@media (max-width:860px){.sx-map-grid,.sx-site-grid{grid-template-columns:minmax(0,1fr)}.sx-serp{justify-self:stretch;width:100%}.sx-map{height:360px}}
@media (max-width:560px){.sx-cards,.sx-time{grid-template-columns:minmax(0,1fr)}.sx-note{display:none}}
@media (prefers-reduced-motion:reduce){
  .sx-serp *,.sx-card *,.sx-map *,.sx-browser,.sx-browser *,.sx-rail i{animation:none!important}
  .r-you{transform:none}.r-a{transform:translateY(71px)}.r-b{transform:translateY(142px)}.r-c{transform:translateY(214px)}
  .r-you .n1,.sx-chip,.sx-pub,.sx-tiles i,.sx-post,.sx-bub,.sx-edits p,.sx-pin{opacity:1;transform:none}
  .sx-line{stroke-dashoffset:0}.sx-doc i{transform:none}.sx-doc .h{width:100%;border:0}
  .sx-stars span{color:#f2c14e}
}
.hx-what{color:inherit;text-decoration:none}a.hx-what:hover{text-decoration:underline;text-underline-offset:4px}

/* email address shown under every "Email me" button (Gage, 30 Oct 2026) */
.em-wrap{display:inline-flex;flex-direction:column;align-items:center;gap:7px;vertical-align:top;max-width:100%}
.em-under{font-size:.86rem;font-weight:600;letter-spacing:.01em;color:inherit;opacity:.8;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.em-under:hover{opacity:1}
.dark .em-under,.on-dark .em-under,.hero .em-under,.ph .em-under,.cta-band .em-under,.gx-mail .em-under{color:var(--cream-2)}
.on-light .em-under,.plan .em-under{color:var(--ink-2)}
.plan.feature .em-under{color:var(--cream-2)}
.plan .em-wrap{display:flex}

/* ═════════ SOCIAL MEDIA PAGE (7 Nov 2026, v2: real-app visuals) · sm- ig- sch- ═════════ */
.sm-band .gx-row.r1 .gx-track{animation-duration:48s}
.sm-mid-cta{display:flex;flex-wrap:wrap;gap:14px 18px;justify-content:center;align-items:flex-start;margin-top:clamp(26px,4vw,40px)}
.sm-mid-cta.left{justify-content:flex-start}
.sm-hero .hero-ctas{align-items:flex-start}
.sm-dm-cta,.sm-faq-cta{margin-top:22px}
.sm-or{margin-top:18px;color:var(--cream-2)}.sm-or a{color:var(--sage-2)}
.plan .sm-plan-mail{margin-top:10px}
.plan.feature > .btn{display:flex;justify-content:center}
:root{--ig-grad:linear-gradient(45deg,#feda75,#fa7e1e 25%,#d62976 50%,#962fbf 75%,#4f5bd5)}

/* ── shared phone chrome ── */
.ig-phone{position:relative;width:300px;height:690px;background:#fff;color:#111;border-radius:44px;overflow:hidden;
  box-shadow:0 0 0 9px #0d1014,0 0 0 10px #2a2f36,0 40px 80px -20px rgba(0,0,0,.6);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:12px;line-height:1.35;display:flex;flex-direction:column}
.ig-phone svg{width:22px;height:22px;flex:none}
.ig-status{display:flex;align-items:center;justify-content:space-between;padding:12px 22px 4px;font-size:12px;position:relative}
.ig-isl{position:absolute;left:50%;top:9px;width:86px;height:24px;border-radius:14px;background:#000;transform:translateX(-50%)}
.ig-sys{display:flex;align-items:center;gap:5px}
.ig-sys .sgn{display:flex;align-items:flex-end;gap:1.5px;height:10px}.ig-sys .sgn i{width:3px;background:#111;border-radius:1px}
.ig-sys .sgn i:nth-child(1){height:4px}.ig-sys .sgn i:nth-child(2){height:6px}.ig-sys .sgn i:nth-child(3){height:8px}.ig-sys .sgn i:nth-child(4){height:10px}
.ig-sys .bt{width:22px;height:11px;border:1.5px solid #111;border-radius:3px;position:relative}.ig-sys .bt::after{content:"";position:absolute;inset:1.5px 4px 1.5px 1.5px;background:#111;border-radius:1px}
.ig-bar{display:flex;align-items:center;justify-content:space-between;padding:6px 14px 8px}
.ig-handle{display:flex;align-items:center;gap:2px;font-size:17px;letter-spacing:-.2px}.ig-handle svg{width:14px;height:14px}
.ig-ico{display:flex;gap:16px;position:relative}
.ig-badge{position:absolute;right:-6px;top:-5px;min-width:16px;height:16px;border-radius:8px;background:#ff3040;color:#fff;font-style:normal;font-size:10px;font-weight:700;display:grid;place-items:center;border:2px solid #fff;animation:ig-badge 12s var(--e-back) infinite}
@keyframes ig-badge{0%,60%{transform:scale(0)}66%,96%{transform:scale(1)}100%{transform:scale(0)}}
.ig-av{width:30px;height:30px;border-radius:50%;flex:none;background:linear-gradient(135deg,#24513a,#a7bc91);box-shadow:0 0 0 2px #fff,0 0 0 3.5px #d62976}
.ig-stories{display:flex;gap:11px;padding:2px 12px 10px;border-bottom:1px solid #efefef}
.ig-stories .sty{display:grid;justify-items:center;gap:3px;font-size:10px;color:#333}
.ig-stories .sty i{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#c9a46a,#8a6a3c);box-shadow:0 0 0 2px #fff,0 0 0 4px #d62976;margin:4px}
.ig-stories .sty i.c2{background:linear-gradient(135deg,#f6b4c1,#b85a7a)}.ig-stories .sty i.c3{background:linear-gradient(135deg,#9fc3f0,#3b6aa8)}
.ig-stories .sty i.c4{background:linear-gradient(135deg,#f5c96b,#d06b2a)}.ig-stories .sty i.c5{background:linear-gradient(135deg,#9bd3ae,#2f7a52)}
.ig-stories .sty.me i{background:linear-gradient(135deg,#24513a,#a7bc91);box-shadow:0 0 0 2px #fff,0 0 0 3px #dbdbdb;position:relative}
.ig-stories .sty.me i::after{content:"+";position:absolute;right:-3px;bottom:-3px;width:17px;height:17px;border-radius:50%;background:#0095f6;color:#fff;font-weight:700;font-size:14px;line-height:15px;text-align:center;border:2px solid #fff}
.ig-stories .sty:not(.me) i{animation:ig-ring 3s linear infinite}
@keyframes ig-ring{0%,100%{box-shadow:0 0 0 2px #fff,0 0 0 4px #d62976}50%{box-shadow:0 0 0 2px #fff,0 0 0 4px #fa7e1e}}
.ig-post{flex:1;overflow:hidden}
.ig-ph{display:flex;align-items:center;gap:9px;padding:9px 12px}.ig-ph b{font-size:12.5px}.ig-ph small{display:block;font-size:10.5px;color:#555}
.ig-more{margin-left:auto;font-weight:800;letter-spacing:1px}
.ig-media{position:relative;width:100%;aspect-ratio:6/5;overflow:hidden;background:#111}
.ig-track{display:flex;width:300%;height:100%;animation:ig-swipe 12s cubic-bezier(.7,0,.2,1) infinite}
.ig-track > .pg{width:33.3334%;height:100%}
@keyframes ig-swipe{0%,30%{transform:translateX(0)}36%,63%{transform:translateX(-33.3334%)}69%,94%{transform:translateX(-66.6667%)}100%{transform:translateX(0)}}
.ig-count{position:absolute;right:10px;top:10px;background:rgba(0,0,0,.6);color:#fff;font-size:11px;font-weight:600;padding:3px 8px;border-radius:12px;display:flex}
.ig-count b{grid-area:1/1;font-weight:600;opacity:0}
.ig-count{display:grid;grid-template-columns:auto auto}
.ig-count .n1{animation:ig-n1 12s steps(1) infinite}.ig-count .n2{animation:ig-n2 12s steps(1) infinite}.ig-count .n3{animation:ig-n3 12s steps(1) infinite}
@keyframes ig-n1{0%,33%{opacity:1}34%,97%{opacity:0}98%,100%{opacity:1}}
@keyframes ig-n2{0%,33%{opacity:0}34%,66%{opacity:1}67%,100%{opacity:0}}
@keyframes ig-n3{0%,66%{opacity:0}67%,97%{opacity:1}98%,100%{opacity:0}}
.ig-burst{position:absolute;left:50%;top:50%;color:#fff;transform:translate(-50%,-50%) scale(0);filter:drop-shadow(0 6px 18px rgba(0,0,0,.35));animation:ig-burst 12s var(--e-back) infinite}
.ig-burst svg{width:96px;height:96px}
@keyframes ig-burst{0%,8%{transform:translate(-50%,-50%) scale(0);opacity:0}11%{transform:translate(-50%,-50%) scale(1.2);opacity:1}14%{transform:translate(-50%,-50%) scale(1)}20%,100%{transform:translate(-50%,-50%) scale(.4);opacity:0}}
.ig-acts{display:flex;align-items:center;gap:14px;padding:9px 12px 4px}
.ig-acts .lk{position:relative;width:22px;height:22px}.ig-acts .lk svg{position:absolute;inset:0}
.ig-acts .lk .f{color:#ff3040;transform:scale(0);animation:ig-like 12s var(--e-back) infinite}
@keyframes ig-like{0%,9%{transform:scale(0)}12%{transform:scale(1.25)}15%,97%{transform:scale(1)}100%{transform:scale(0)}}
.ig-dots{display:flex;gap:3px;margin:0 auto;padding-right:30px}.ig-dots i{width:6px;height:6px;border-radius:50%;background:#c7c7c7}
.ig-dots i:nth-child(1){animation:ig-d1 12s steps(1) infinite}.ig-dots i:nth-child(2){animation:ig-d2 12s steps(1) infinite}.ig-dots i:nth-child(3){animation:ig-d3 12s steps(1) infinite}
@keyframes ig-d1{0%,33%{background:#0095f6}34%,97%{background:#c7c7c7}98%{background:#0095f6}}
@keyframes ig-d2{0%,33%{background:#c7c7c7}34%,66%{background:#0095f6}67%,100%{background:#c7c7c7}}
@keyframes ig-d3{0%,66%{background:#c7c7c7}67%,97%{background:#0095f6}98%,100%{background:#c7c7c7}}
.ig-post p{margin:0;padding:2px 12px}
.ig-likes{font-size:12px}
.ig-num{display:inline-grid}.ig-num span{grid-area:1/1;opacity:0}
.ig-num .k1{animation:ig-k1 12s steps(1) infinite}.ig-num .k2{animation:ig-k2 12s steps(1) infinite}.ig-num .k3{animation:ig-k3 12s steps(1) infinite}
@keyframes ig-k1{0%,10%{opacity:1}11%,100%{opacity:0}}
@keyframes ig-k2{0%,10%{opacity:0}11%,45%{opacity:1}46%,100%{opacity:0}}
@keyframes ig-k3{0%,45%{opacity:0}46%,99%{opacity:1}100%{opacity:0}}
.ig-cap{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ig-view{color:#737373}
.ig-cm{opacity:0;max-height:0;overflow:hidden}
.ig-cm.c1{animation:ig-cm1 12s var(--e-out) infinite}.ig-cm.c2{animation:ig-cm2 12s var(--e-out) infinite}
.ig-cm .at{color:#00376b}
@keyframes ig-cm1{0%,24%{opacity:0;max-height:0}30%,96%{opacity:1;max-height:40px}100%{opacity:0;max-height:0}}
@keyframes ig-cm2{0%,44%{opacity:0;max-height:0;background:transparent}50%{opacity:1;max-height:60px;background:#fff6d9}62%,96%{opacity:1;max-height:60px;background:transparent}100%{opacity:0;max-height:0}}
.ig-nav{display:flex;justify-content:space-around;align-items:center;padding:10px 8px 18px;border-top:1px solid #efefef;background:#fff}
.ig-nav svg{width:24px;height:24px}
.ig-me{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#24513a,#a7bc91);box-shadow:0 0 0 1.5px #111}

/* ── post graphics (what the client's posts look like) ── */
.pg{position:relative;overflow:hidden;color:#fff;font-family:var(--f-display,inherit)}
.pg-promo{background:radial-gradient(circle at 80% 15%,#3d7a55,transparent 45%),linear-gradient(150deg,#0f2a1e,#24513a);display:grid;align-content:center;padding:0 22px;gap:4px}
.pg-promo small{font-family:inherit;font-size:10px;letter-spacing:2px;color:#a7bc91;font-weight:800}
.pg-promo b{font-size:40px;line-height:.9;letter-spacing:-1px}
.pg-promo .pg-price{position:absolute;right:16px;bottom:44px;width:78px;height:78px;border-radius:50%;background:#f2c14e;color:#0f2a1e;display:grid;place-items:center;font-size:28px;font-weight:800;transform:rotate(-12deg)}
.pg-promo em{font-style:normal;font-size:11px;color:#dfe8d6;margin-top:6px}
.pg-ba{display:flex}
.pg-ba > span{flex:1;position:relative;overflow:hidden}
.pg-ba .ba-l{background:linear-gradient(180deg,#8d7f6d 0 62%,#5a5046 62%)}
.pg-ba .ba-r{background:linear-gradient(180deg,#9fd0f5 0 62%,#3d4a57 62%)}
.pg-ba u{position:absolute;left:8%;width:180%;bottom:28%;height:30%;border-radius:40% 40% 14% 14%/60% 60% 14% 14%;text-decoration:none}
.pg-ba .ba-l u{background:radial-gradient(circle at 20% 40%,#3b322a 0 6%,transparent 7%),radial-gradient(circle at 45% 70%,#3b322a 0 5%,transparent 6%),radial-gradient(circle at 30% 25%,#4a4036 0 8%,transparent 9%),#6b5d4f;box-shadow:inset 0 -12px 0 #4a4036}
.pg-ba .ba-r u{left:-88%;background:linear-gradient(180deg,#d6242f,#8f1219);box-shadow:inset 0 -12px 0 #6d0e14,inset 30px 8px 0 -18px rgba(255,255,255,.55)}
.pg-ba u::before,.pg-ba u::after{content:"";position:absolute;bottom:-26%;width:24%;aspect-ratio:1;border-radius:50%;background:#111;box-shadow:inset 0 0 0 5px #333,inset 0 0 0 9px #aaa}
.pg-ba u::before{left:12%}.pg-ba u::after{right:22%}
.pg-ba .ba-r u::before{left:auto;right:68%}.pg-ba .ba-r u::after{right:12%}
.pg-ba i{position:absolute;left:10px;bottom:10px;z-index:2;font-style:normal;font-size:10px;font-weight:800;letter-spacing:1.5px;background:rgba(0,0,0,.6);padding:3px 7px;border-radius:4px}
.pg-ba .ba-r i{left:auto;right:10px}
.pg-ba em{position:absolute;font-style:normal;color:#fff;font-size:20px;right:22%;top:34%;text-shadow:0 0 8px #fff;animation:ba-tw 2s ease-in-out infinite}
.pg-ba em.e2{right:58%;top:46%;font-size:13px;animation-delay:.7s}
@keyframes ba-tw{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1.1)}}
.pg-ba .ba-bar{position:absolute;left:50%;top:0;bottom:0;width:3px;background:#fff;flex:none;transform:translateX(-50%);z-index:3;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.pg-ba .ba-bar::after{content:"‹ ›";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:28px;height:28px;border-radius:50%;background:#fff;color:#111;font:800 12px/28px Arial,sans-serif;text-align:center}
.pg-tip{background:linear-gradient(170deg,#2b4c7e,#0f1e33);display:grid;align-content:end;padding:18px;gap:6px}
.pg-tip b{font-size:22px;line-height:1.05}
.pg-tip small{font-family:-apple-system,Arial,sans-serif;font-size:11px;opacity:.85}
.pg-tip .pg-play{position:absolute;left:50%;top:38%;width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.25);display:grid;place-items:center;transform:translate(-50%,-50%);backdrop-filter:blur(4px)}
.pg-tip .pg-play svg{width:26px;height:26px;color:#fff}

/* ── hero stage + floating notifications ── */
.sm-stage{position:relative;justify-self:center;padding:10px 0 40px}
.sm-stage .ig-phone{animation:gx-float 8s var(--e-inout) infinite alternate}
.sm-ping{position:absolute;display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:16px;background:var(--night-3);color:var(--cream);border:1px solid rgba(167,188,145,.25);box-shadow:var(--shadow-lg);font-weight:700;font-size:.86rem;opacity:0;white-space:nowrap;z-index:3}
.sm-ping small{display:block;font-weight:500;color:var(--cream-3);font-size:.76rem}
.sm-ping svg{width:20px;height:20px;color:var(--sage);flex:none}
.sm-ping.p1{left:-120px;top:70px;animation:sm-ping 12s var(--e-back) infinite;animation-delay:.4s}
.sm-ping.p2{right:-110px;top:44%;animation:sm-ping 12s var(--e-back) infinite;animation-delay:4.4s}
.sm-ping.p3{left:-110px;bottom:90px;animation:sm-ping 12s var(--e-back) infinite;animation-delay:6.4s}
@keyframes sm-ping{0%{opacity:0;transform:translateY(14px) scale(.92)}6%,30%{opacity:1;transform:none}36%,100%{opacity:0;transform:translateY(-8px)}}
.sm-note{position:absolute;right:-30px;bottom:0;color:var(--sage);font-size:1.35rem;transform:rotate(-3deg);margin:0}

/* ── four cards: real app screens ── */
.sm-cards .sx-vis{height:196px;background:#0d1014}
.sm-v-edit{display:grid;grid-template-rows:1fr auto auto;gap:6px;padding:10px}
.ed-prev{position:relative;display:grid;place-items:center;background:#1b1f25;border-radius:8px}
.ed-frame{position:relative;width:56px;height:96px;border-radius:6px;background:linear-gradient(170deg,#2b4c7e,#0f1e33);overflow:hidden;animation:ed-zoom 6s var(--e-inout) infinite}
@keyframes ed-zoom{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.ed-sub{position:absolute;left:4px;right:4px;bottom:16px;font-style:normal;font-size:7px;font-weight:800;color:#fff;text-align:center;line-height:1.1;background:rgba(0,0,0,.45);padding:2px;border-radius:2px;opacity:0;animation:ed-sub 6s steps(1) infinite}
@keyframes ed-sub{0%,30%{opacity:0}31%,96%{opacity:1}97%,100%{opacity:0}}
.ed-ratio{position:absolute;right:6px;top:6px;font-size:9px;color:#aaa;border:1px solid #444;border-radius:4px;padding:1px 4px}
.ed-tools{display:flex;gap:4px;font-size:9px;color:#9aa}
.ed-tools span{padding:2px 7px;border-radius:999px;background:#1b1f25}.ed-tools span.on{background:var(--sage);color:var(--night);font-weight:700;animation:ed-on 6s steps(1) infinite}
@keyframes ed-on{0%,25%{background:#1b1f25;color:#9aa}26%,100%{background:var(--sage);color:var(--night)}}
.ed-tl{position:relative;display:grid;gap:3px}
.ed-strip{display:flex;gap:2px;height:22px}.ed-strip i{flex:1;border-radius:3px;background:linear-gradient(135deg,#3b6aa8,#1d3557)}
.ed-strip i:nth-child(2n){background:linear-gradient(135deg,#c9a46a,#8a6a3c)}.ed-strip i:nth-child(3n){background:linear-gradient(135deg,#a7bc91,#24513a)}
.ed-wave{height:12px;border-radius:3px;background:repeating-linear-gradient(90deg,#5f87c4 0 2px,transparent 2px 4px);mask:linear-gradient(180deg,transparent 0,#000 30%,#000 70%,transparent);opacity:.7}
.ed-head{position:absolute;top:-3px;bottom:-3px;width:2px;background:#fff;box-shadow:0 0 8px #fff;animation:ed-play 6s linear infinite}
@keyframes ed-play{from{left:0}to{left:100%}}
.sm-cap{position:absolute;right:10px;top:10px;background:var(--sage);color:var(--night);font-weight:800;font-size:.7rem;padding:3px 9px;border-radius:999px;animation:sx-chip 6s var(--e-back) infinite;animation-delay:.6s}
.sm-v-q{padding:10px;display:grid;gap:6px;align-content:start;background:#fff!important;color:#111}
.q-head{display:flex;justify-content:space-between;font-size:.78rem}.q-head small{color:#888}
.q-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid #eee;border-radius:10px;font-size:.72rem;opacity:0;animation:q-in 8s var(--e-out) infinite}
.q-row.r2{animation-delay:.3s}.q-row.r3{animation-delay:.6s}
@keyframes q-in{0%{opacity:0;transform:translateX(12px)}8%,94%{opacity:1;transform:none}100%{opacity:0}}
.q-row small{display:block;color:#888}
.q-th,.th{width:30px;height:30px;border-radius:6px;flex:none;display:grid;place-items:center;color:#fff}
.th svg{width:12px!important;height:12px!important}
.t1{background:linear-gradient(150deg,#0f2a1e,#24513a)}.t2{background:linear-gradient(90deg,#4a3e32 50%,#7aa7d6 50%)}.t3{background:linear-gradient(170deg,#2b4c7e,#0f1e33)}
.t4{background:linear-gradient(150deg,#d06b2a,#f5c96b)}.t5{background:linear-gradient(150deg,#b85a7a,#f6b4c1)}.t6{background:linear-gradient(150deg,#2f7a52,#9bd3ae)}
.q-st{margin-left:auto;position:relative;display:grid}
.q-st em{grid-area:1/1;font-style:normal;font-weight:700;font-size:.66rem;padding:2px 7px;border-radius:999px;white-space:nowrap}
.q-st .s{background:#e7f0ff;color:#1a4fb5}
.q-st .p{background:#e3f4e8;color:#1f7a3f;opacity:0}
.q-row.r1 .q-st .p{animation:q-pub 8s steps(1) infinite}.q-row.r2 .q-st .p{animation:q-pub2 8s steps(1) infinite}
.q-row.r1 .q-st .s{animation:q-hide 8s steps(1) infinite}.q-row.r2 .q-st .s{animation:q-hide2 8s steps(1) infinite}
@keyframes q-pub{0%,30%{opacity:0}31%,95%{opacity:1}96%{opacity:0}}@keyframes q-hide{0%,30%{opacity:1}31%,95%{opacity:0}96%{opacity:1}}
@keyframes q-pub2{0%,60%{opacity:0}61%,95%{opacity:1}96%{opacity:0}}@keyframes q-hide2{0%,60%{opacity:1}61%,95%{opacity:0}96%{opacity:1}}
.sm-v-rep{background:#fff!important;color:#111;padding:12px;display:grid;gap:8px;align-content:start;font-size:.72rem;line-height:1.3}
.cm-row{display:flex;gap:8px;align-items:flex-start;opacity:0;animation:cm-in 8s var(--e-out) infinite}
.cm-row p{margin:0;flex:1;font-size:.72rem;line-height:1.3;color:#111}.cm-row small{display:block;color:#888;margin-top:2px}
.cm-reply{margin-left:22px;animation:cm-in2 8s var(--e-out) infinite}
.cm-av{width:24px;height:24px;border-radius:50%;flex:none;background:linear-gradient(135deg,#9fc3f0,#3b6aa8)}
.cm-av.biz{background:linear-gradient(135deg,#24513a,#a7bc91)}
.cm-h{width:14px!important;height:14px!important;color:#888}
.cm-liked{color:#ff3040}
.cm-typing{display:flex;gap:4px;align-items:center;margin-left:22px;opacity:0;animation:cm-ty 8s steps(1) infinite}
.cm-typing i{width:5px;height:5px;border-radius:50%;background:#999;animation:sm-dot 1s ease-in-out infinite}
.cm-typing i:nth-child(3){animation-delay:.15s}.cm-typing i:nth-child(4){animation-delay:.3s}
@keyframes cm-in{0%{opacity:0;transform:translateY(8px)}8%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes cm-in2{0%,40%{opacity:0;transform:translateY(8px)}48%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes cm-ty{0%,15%{opacity:0}16%,40%{opacity:1}41%,100%{opacity:0}}
@keyframes sm-dot{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-3px);opacity:1}}
.sm-v-both{display:flex;gap:8px;padding:10px 10px 34px;background:#e9ebee!important}
.bo-fb,.bo-ig{flex:1;background:#fff;border-radius:8px;overflow:hidden;display:flex;flex-direction:column;color:#111;font-size:.62rem;animation:bo-up 6s var(--e-back) infinite}
.bo-ig{animation-delay:.25s}
@keyframes bo-up{0%,8%{opacity:0;transform:translateY(14px)}18%,92%{opacity:1;transform:none}100%{opacity:0}}
.bo-h{display:flex;align-items:center;gap:5px;padding:5px}
.bo-h small{display:flex;align-items:center;gap:2px;color:#65676b}.bo-h small svg{width:9px!important;height:9px!important}
.bo-av{width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,#24513a,#a7bc91);flex:none}.bo-av.ig{box-shadow:0 0 0 1.5px #d62976}
.bo-img{flex:1;background:radial-gradient(circle at 80% 15%,#3d7a55,transparent 45%),linear-gradient(150deg,#0f2a1e,#24513a);position:relative}
.bo-img::after{content:"$99";position:absolute;right:6px;bottom:6px;background:#f2c14e;color:#0f2a1e;font-weight:800;font-size:.6rem;padding:2px 5px;border-radius:8px}
.bo-act{display:flex;gap:6px;padding:4px 5px;color:#65676b;font-weight:600}
.bo-act svg{width:12px!important;height:12px!important;color:#111}
.bo-fb .bo-h b{color:#050505}
.sm-out{position:absolute;left:0;right:0;margin:0 auto;width:max-content;bottom:8px;background:var(--forest);color:#F4F7EF;font-weight:700;font-size:.72rem;padding:4px 10px;border-radius:999px;white-space:nowrap;animation:sx-chip 6s var(--e-back) infinite;animation-delay:.5s}

/* ── scheduling: the content planner ── */
.sm-sched-sec{overflow:hidden}
.sch-fit{position:relative;margin-top:clamp(28px,4vw,48px);overflow:hidden;border-radius:18px}
.sch-app{position:relative;transform-origin:top left;background:#fff;color:#1c1e21;border-radius:18px;box-shadow:0 30px 80px -24px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.06);overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:13px}
.sch-top{display:flex;align-items:center;gap:18px;padding:14px 18px;border-bottom:1px solid #e4e6eb;flex-wrap:wrap}
.sch-title{display:flex;align-items:center;gap:14px}.sch-title b{font-size:15px}
.sch-tabs{display:flex;background:#f0f2f5;border-radius:8px;padding:3px}.sch-tabs i{font-style:normal;padding:4px 12px;border-radius:6px;color:#65676b;font-weight:600}.sch-tabs i.on{background:#fff;color:#1c1e21;box-shadow:0 1px 2px rgba(0,0,0,.1)}
.sch-range{display:flex;align-items:center;gap:8px}.sch-range svg{width:16px;height:16px;color:#65676b}
.sch-pages{margin-left:auto;display:flex;align-items:center;gap:6px;color:#65676b}
.sch-pf{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;color:#fff;font-weight:800;font-family:Arial,sans-serif;font-size:14px;flex:none}
.sch-pf.fb{background:#1877f2}.sch-pf.ig{background:var(--ig-grad)}.sch-pf.ig svg{width:13px;height:13px}
.sch-new{margin-left:8px;background:#1877f2;color:#fff;font-weight:700;padding:7px 12px;border-radius:8px;animation:sch-press 10s var(--e-out) infinite}
@keyframes sch-press{0%,4%,100%{transform:none}6%{transform:scale(.94)}8%{transform:none}}
.sch-body{position:relative;display:grid;grid-template-columns:210px minmax(0,1fr)}
.sch-drafts{padding:14px;border-right:1px solid #e4e6eb;background:#f7f8fa;display:grid;gap:9px;align-content:start}
.sch-h{font-size:12px;color:#65676b;text-transform:uppercase;letter-spacing:.6px}
.sch-card{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #e4e6eb;border-radius:10px;padding:8px;font-size:12px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.sch-card small{display:block;color:#65676b;font-size:11px}
.sch-card.d1{animation:sch-src 10s steps(1) infinite}
@keyframes sch-src{0%,9%{opacity:1}10%,92%{opacity:.25;border-style:dashed}93%,100%{opacity:1}}
.sch-hint{margin:4px 0 0;font-size:11px;color:#8a8d91}
.sch-week{position:relative;display:grid;grid-template-columns:56px repeat(7,minmax(0,1fr));grid-template-rows:auto repeat(3,74px);gap:0;padding:0 10px 10px 0}
.sch-corner{grid-column:1;grid-row:1}
.sch-day{grid-row:1;text-align:center;padding:10px 0 8px;color:#65676b;font-size:11px;font-weight:600;text-transform:uppercase}
.sch-day b{display:block;font-size:18px;color:#1c1e21;text-transform:none}
.sch-day.today b{display:inline-grid;place-items:center;width:32px;height:32px;margin-top:2px;border-radius:50%;background:#1877f2;color:#fff}
.sch-time{grid-column:1;font-size:11px;color:#8a8d91;padding:6px 8px 0 0;text-align:right}
.sch-cell{border-top:1px solid #eef0f3;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(100%/7 - 1px),#f2f3f5 calc(100%/7 - 1px),#f2f3f5 calc(100%/7))}
.sch-post{position:relative;z-index:1;margin:6px 4px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:6px;row-gap:3px;align-content:start;background:#fff;border:1px solid #dfe3ea;border-left:3px solid #1877f2;border-radius:8px;padding:6px;font-size:11px;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.sch-post .th{width:26px;height:26px;grid-row:1/3}
.sch-post b{font-size:11px;align-self:center}
.sch-post .pfs{display:flex;gap:3px}.sch-post .pfs i{width:10px;height:10px;border-radius:3px}.pfs .fb{background:#1877f2}.pfs .ig{background:var(--ig-grad)}
.sch-post em{grid-column:1/-1;font-style:normal;font-size:10px;font-weight:700;padding:2px 6px;border-radius:999px;justify-self:start}
.sch-post .s{background:#e7f0ff;color:#1a4fb5}.sch-post .p{background:#e3f4e8;color:#1f7a3f;opacity:0}
.sch-post em{grid-row:3}
.sch-post.pub1{animation:sch-pubc1 10s steps(1) infinite}.sch-post.pub1 .s{animation:sch-s1 10s steps(1) infinite}.sch-post.pub1 .p{animation:sch-p1 10s steps(1) infinite}
.sch-post.pub2{animation:sch-pubc2 10s steps(1) infinite}.sch-post.pub2 .s{animation:sch-s2 10s steps(1) infinite}.sch-post.pub2 .p{animation:sch-p2 10s steps(1) infinite}
@keyframes sch-s1{0%,24%{opacity:1}25%,100%{opacity:0}}@keyframes sch-p1{0%,24%{opacity:0}25%,100%{opacity:1}}
@keyframes sch-s2{0%,59%{opacity:1}60%,100%{opacity:0}}@keyframes sch-p2{0%,59%{opacity:0}60%,100%{opacity:1}}
@keyframes sch-pubc1{0%,24%{border-left-color:#1877f2}25%,100%{border-left-color:#31a24c}}
@keyframes sch-pubc2{0%,59%{border-left-color:#1877f2}60%,100%{border-left-color:#31a24c}}
.sch-post.drop{opacity:0;animation:sch-drop 10s var(--e-back) infinite}
@keyframes sch-drop{0%,41%{opacity:0;transform:scale(.85)}45%,95%{opacity:1;transform:none;box-shadow:0 0 0 3px rgba(24,119,242,.35)}60%,95%{box-shadow:0 2px 6px rgba(0,0,0,.06)}100%{opacity:0}}
.sch-now{position:relative;z-index:2;pointer-events:none;margin:0 2px}
.sch-now::before{content:"";position:absolute;left:0;right:0;height:2px;background:#e41e3f;top:0;animation:sch-now 10s linear infinite}
.sch-now::after{content:"";position:absolute;left:-4px;width:9px;height:9px;border-radius:50%;background:#e41e3f;top:-3.5px;animation:sch-now 10s linear infinite}
@keyframes sch-now{from{transform:translateY(8px)}to{transform:translateY(210px)}}
.sch-ghost{position:absolute;z-index:5;display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #1877f2;border-radius:10px;padding:8px;font-size:12px;box-shadow:0 18px 40px -10px rgba(0,0,0,.35);opacity:0;pointer-events:none;animation:sch-drag 10s cubic-bezier(.6,0,.25,1) infinite}
.sch-ghost small{display:block;color:#65676b;font-size:11px}
@keyframes sch-drag{0%,6%{opacity:0;transform:translate(0,0) rotate(0)}10%{opacity:1;transform:translate(0,0) rotate(-3deg) scale(1.04)}38%{opacity:1;transform:translate(var(--dx,300px),var(--dy,120px)) rotate(2deg) scale(.82)}43%,100%{opacity:0;transform:translate(var(--dx,300px),var(--dy,120px)) scale(.8)}}
.sch-cursor{position:absolute;right:-6px;bottom:-10px;width:18px;height:22px;background:#111;clip-path:polygon(0 0,0 80%,26% 60%,44% 100%,58% 94%,40% 56%,76% 56%);filter:drop-shadow(0 0 1px #fff) drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.sch-toast{position:absolute;right:16px;bottom:16px;z-index:6;display:flex;align-items:center;gap:10px;background:#1c1e21;color:#fff;border-radius:12px;padding:10px 14px;font-weight:700;box-shadow:0 12px 30px -8px rgba(0,0,0,.5);opacity:0;animation:sch-toast 10s var(--e-back) infinite}
.sch-toast small{display:block;font-weight:500;color:#b0b3b8;font-size:11px}
.sch-toast svg{width:18px;height:18px;color:#31a24c}
@keyframes sch-toast{0%,44%{opacity:0;transform:translateY(12px)}49%,80%{opacity:1;transform:none}86%,100%{opacity:0;transform:translateY(6px)}}
.sch-foot{display:flex;align-items:center;gap:16px;padding:12px 18px;border-top:1px solid #e4e6eb;color:#65676b;font-size:12px;flex-wrap:wrap}
.sch-foot b{color:#1c1e21}
.sch-bar{flex:1;min-width:120px;height:6px;border-radius:3px;background:#e4e6eb;overflow:hidden}
.sch-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#1877f2,#31a24c);transform-origin:left;animation:sch-bar 10s var(--e-out) infinite}
@keyframes sch-bar{0%{transform:scaleX(.55)}45%,95%{transform:scaleX(1)}100%{transform:scaleX(.55)}}
.sch-points{list-style:none;padding:0;margin:clamp(24px,3vw,36px) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sch-points li{display:flex;gap:12px;align-items:flex-start;color:var(--cream-2);font-size:.95rem}
.sch-points b{display:block;color:var(--cream);margin-bottom:3px}
.sch-points svg{width:22px;height:22px;color:var(--sage);flex:none;margin-top:2px}

/* ── auto-DM: a real Instagram DM thread ── */
.sm-dm{position:relative;display:grid;justify-items:center;gap:14px}
.dm-notif{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.95);color:#111;border-radius:16px;padding:10px 14px;font-size:.8rem;box-shadow:var(--shadow-lg);font-family:-apple-system,Arial,sans-serif;animation:dm-n 10s var(--e-back) infinite}
.dm-notif small{display:block;color:#737373}
@keyframes dm-n{0%{opacity:0;transform:translateY(-14px)}6%,94%{opacity:1;transform:none}100%{opacity:0}}
.dm-phone{height:560px}
.dm-bar{display:flex;align-items:center;gap:9px;padding:6px 12px 10px;border-bottom:1px solid #efefef}
.dm-bar .bk{width:20px!important;height:20px!important}.dm-bar small{display:block;color:#737373;font-size:10.5px}.dm-bar b{font-size:13px}
.ig-av.j{background:linear-gradient(135deg,#9fc3f0,#3b6aa8);box-shadow:none}
.dm-ic{margin-left:auto;display:flex;gap:14px}
.dm-body{flex:1;display:flex;flex-direction:column;gap:5px;padding:12px;overflow:hidden}
.dm-ctx{margin:0 0 2px;text-align:center;font-size:10.5px;color:#737373}
.dm-postref{align-self:flex-end;display:flex;align-items:center;gap:6px;font-size:11px;color:#737373;margin-bottom:4px}
.pg-promo.mini{width:56px;height:56px;border-radius:8px;padding:0 6px}.pg-promo.mini b{font-size:12px}.pg-promo.mini .pg-price{width:22px;height:22px;font-size:8px;right:3px;bottom:3px}
.dm-m{margin:0;max-width:78%;padding:8px 12px;border-radius:18px;font-size:12.5px;opacity:0}
.dm-m.me{align-self:flex-end;background:linear-gradient(135deg,#7b4cff,#3797f0);color:#fff}
.dm-m.them{align-self:flex-start;background:#efefef;color:#111}
.dm-m.m1{animation:dm-a 10s var(--e-out) infinite}.dm-m.m2{animation:dm-b 10s var(--e-out) infinite}.dm-m.m3{animation:dm-c 10s var(--e-out) infinite}
.dm-m.typing{display:flex;gap:4px;padding:11px 12px;animation:dm-t 10s steps(1) infinite}
.dm-m.typing i{width:6px;height:6px;border-radius:50%;background:#8e8e8e;animation:sm-dot 1s ease-in-out infinite}
.dm-m.typing i:nth-child(2){animation-delay:.15s}.dm-m.typing i:nth-child(3){animation-delay:.3s}
.dm-m.m4{animation:dm-d 10s var(--e-out) infinite}
.dm-card{display:grid;gap:2px;background:#fff!important;color:#111!important;border:1px solid #dbdbdb;border-radius:14px!important}
.dm-card small{color:#737373}.dm-card span{margin-top:6px;text-align:center;background:#0095f6;color:#fff;font-weight:700;border-radius:8px;padding:6px}
@keyframes dm-a{0%,10%{opacity:0;transform:translateY(10px)}14%,95%{opacity:1;transform:none}100%{opacity:0}}
@keyframes dm-b{0%,20%{opacity:0;transform:translateY(10px)}24%,95%{opacity:1;transform:none}100%{opacity:0}}
@keyframes dm-c{0%,32%{opacity:0;transform:translateY(10px)}36%,95%{opacity:1;transform:none}100%{opacity:0}}
@keyframes dm-t{0%,52%{opacity:0;max-height:0;padding:0 12px}53%,66%{opacity:1;max-height:40px;padding:11px 12px}67%,100%{opacity:0;max-height:0;padding:0 12px}}
@keyframes dm-d{0%,67%{opacity:0;transform:translateY(10px)}71%,95%{opacity:1;transform:none}100%{opacity:0}}
.dm-input{display:flex;align-items:center;gap:10px;margin:8px 10px 18px;padding:8px 10px;border-radius:22px;background:#efefef;color:#8e8e8e}
.dm-input .cam{width:26px;height:26px;border-radius:50%;background:#0095f6}
.dm-input i{font-style:normal}
.sm-dm-toast{position:absolute;right:-30px;top:44%;z-index:4;display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:16px;background:var(--forest);color:#F4F7EF;font-weight:700;font-size:.86rem;box-shadow:var(--shadow-lg);opacity:0;animation:sm-dm6 10s var(--e-back) infinite}
.sm-dm-toast small{display:block;font-weight:500;opacity:.8;font-size:.76rem}
.sm-dm-toast svg{width:20px;height:20px;color:#f2c14e}
@keyframes sm-dm6{0%,16%{opacity:0;transform:translateX(16px) scale(.92)}22%,56%{opacity:1;transform:none}62%,100%{opacity:0}}

/* ── the month calendar (approval) ── */
.sm-cal{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:18px;animation:gx-float 8s var(--e-inout) infinite alternate}
.sm-cal-bar{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;font-size:.9rem}
.sm-cal-bar b{font-family:var(--f-display);font-size:1.3rem}.sm-cal-bar span{color:var(--ink-3);font-size:.8rem}
.sm-cal-days,.sm-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.sm-cal-days span{font-size:.7rem;color:var(--ink-3);text-align:center;font-weight:700}
.sm-cal-grid{margin-top:6px}
.sm-cal-grid i{aspect-ratio:1;border-radius:9px;background:var(--paper-2)}
.sm-cal-grid i.p{background:var(--paper-2);animation:sm-cal 9s var(--e-back) infinite}
.sm-cal-grid i.p.r{--c:#e1306c}.sm-cal-grid i.p.s{--c:#d29b16}
@keyframes sm-cal{0%,6%{background:var(--paper-2);transform:scale(.7)}14%,90%{background:var(--c,var(--forest));transform:none}100%{background:var(--paper-2)}}
.sm-cal-grid i:nth-child(4){animation-delay:.25s}.sm-cal-grid i:nth-child(6){animation-delay:.5s}.sm-cal-grid i:nth-child(9){animation-delay:.75s}.sm-cal-grid i:nth-child(11){animation-delay:1s}.sm-cal-grid i:nth-child(13){animation-delay:1.25s}.sm-cal-grid i:nth-child(16){animation-delay:1.5s}.sm-cal-grid i:nth-child(18){animation-delay:1.75s}.sm-cal-grid i:nth-child(20){animation-delay:2s}.sm-cal-grid i:nth-child(23){animation-delay:2.25s}.sm-cal-grid i:nth-child(25){animation-delay:2.5s}
.sm-cal-key{display:flex;gap:14px;margin-top:12px;font-size:.75rem;color:var(--ink-3)}
.sm-cal-key span{display:flex;align-items:center;gap:5px}
.sm-cal-key i{width:10px;height:10px;border-radius:3px;background:var(--forest)}.sm-cal-key i.r{background:#e1306c}.sm-cal-key i.s{background:#d29b16}

/* ── responsive ── */
@media (max-width:1180px){.sm-ping.p1,.sm-ping.p3{left:-60px}.sm-ping.p2{right:-50px}.sm-dm-toast{right:-6px}}
@media (max-width:1000px){.sch-points{grid-template-columns:minmax(0,1fr)}}
@media (max-width:960px){.sm-ping.p1,.sm-ping.p3{left:-14px}.sm-ping.p2{right:-14px}.sm-note{right:0}}
@media (max-width:699px){
  .js .sch-fit{margin-left:-12px;margin-right:-12px;border-radius:12px}
  .js .sch-body{grid-template-columns:160px minmax(0,1fr)}
  .js .sch-week{grid-template-columns:48px repeat(7,minmax(0,1fr))}
  .js .sch-drafts{padding:12px 10px}
  .js .sch-post{column-gap:4px;padding:5px;margin:5px 3px}
  .js .sch-post .th{width:20px;height:20px}
  .js .sch-post b{white-space:nowrap;font-size:10.5px}
  .js .sch-post em{font-size:9.5px;padding:2px 5px}
}
@media (max-width:860px){
  .no-js .sch-body{grid-template-columns:minmax(0,1fr)}
  .no-js .sch-drafts,.no-js .sch-ghost{display:none}
  .no-js .sch-fit{overflow-x:auto}
}
@media (max-width:420px){.ig-phone{width:280px;height:670px}.dm-phone{height:540px}.sm-ping{font-size:.78rem;padding:9px 11px}.sm-note{display:none}.sm-cards .sx-vis{height:190px}}
@media (prefers-reduced-motion:reduce){
  .sm-stage *,.sm-stage .ig-phone,.sm-cards *,.sch-app *,.sm-dm *,.sm-cal,.sm-cal *{animation:none!important}
  .ig-cm,.sm-ping.p1,.cm-row,.q-row,.bo-fb,.bo-ig,.sm-cap,.sm-out,.dm-m,.sm-dm-toast,.sch-post.drop,.ed-sub{opacity:1!important;max-height:none!important;transform:none!important}
  .ig-num .k3,.ig-count .n1{opacity:1}.ig-count .n1{display:inline}.ig-acts .lk .f{transform:none}.dm-m.typing,.cm-typing,.sch-ghost,.sch-toast,.ig-burst,.sm-ping.p2,.sm-ping.p3{display:none!important}
  .sm-cal-grid i.p{background:var(--c,var(--forest))}
}

/* ═════════ CRM PAGE (7 Nov 2026) · cr- pp- wf- ib- ═════════ */
.cr-band .gx-row.r1 .gx-track{animation-duration:50s}
.cr-hero .hero-ctas{align-items:flex-start}
.fit{position:relative;margin-top:clamp(28px,4vw,48px);overflow:hidden;border-radius:18px}
.fit > *{transform-origin:top left}
.no-js .fit{overflow-x:auto}
.sms{margin:0;max-width:82%;padding:7px 11px;border-radius:16px;font-size:.74rem;line-height:1.3;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
.cr-vis .sms,.cr-ph-body .sms{font-size:.72rem!important;line-height:1.3!important}
.sms.me{align-self:flex-end;background:#0a84ff;color:#fff;border-bottom-right-radius:5px}
.sms.them{align-self:flex-start;background:#e9e9eb;color:#111;border-bottom-left-radius:5px}

/* hero: dashboard window + phone */
.cr-fit{justify-self:end;width:min(560px,100%);min-width:0;max-width:100%;margin-top:0;overflow:visible;border-radius:0}
.cr-stage{position:relative;padding:10px 0 60px;width:100%}
.cr-win{background:#fff;color:#1c1e21;border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -24px rgba(0,0,0,.6);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;animation:gx-float 9s var(--e-inout) infinite alternate}
.cr-chrome{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#f0f2f5}
.cr-chrome i{width:9px;height:9px;border-radius:50%;background:#d0d4da}.cr-chrome i:nth-child(1){background:#ff5f57}.cr-chrome i:nth-child(2){background:#febc2e}.cr-chrome i:nth-child(3){background:#28c840}
.cr-chrome .url{margin-left:10px;display:flex;gap:5px;align-items:center;font-size:.72rem;color:#65676b;background:#fff;border-radius:6px;padding:3px 10px}
.cr-chrome .url svg{width:.9em;height:.9em}
.cr-app{display:grid;grid-template-columns:132px minmax(0,1fr);min-height:330px}
.cr-side{background:#0f2a1e;color:#cfd9c8;padding:12px 8px;display:grid;gap:3px;align-content:start;font-size:.7rem}
.cr-logo{display:flex;align-items:center;gap:6px;color:#fff;padding:2px 6px 10px}.cr-logo b{font-size:.8rem;letter-spacing:.5px}
.cr-logo .bars{display:grid;gap:2px;width:16px}.cr-logo .bars i{height:3px;border-radius:2px;background:var(--sage)}.cr-logo .bars i:nth-child(2){background:var(--sage-2)}.cr-logo .bars i:nth-child(3){background:#e8ede3}
.cr-side > span:not(.cr-logo){display:flex;align-items:center;gap:7px;padding:6px 7px;border-radius:7px;position:relative}
.cr-side svg{width:14px;height:14px;flex:none}
.cr-side .on{background:rgba(167,188,145,.18);color:#fff}
.cr-dot{margin-left:auto;font-style:normal;background:#e41e3f;color:#fff;font-size:.6rem;font-weight:700;border-radius:8px;padding:0 5px;animation:ig-badge 10s var(--e-back) infinite}
.cr-main{padding:12px 14px;display:grid;gap:10px;align-content:start;background:#f7f8fa}
.cr-hi b{font-size:.92rem}.cr-hi small{display:block;color:#65676b;font-size:.7rem}
.cr-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cr-stat{background:#fff;border:1px solid #e4e6eb;border-radius:10px;padding:8px}
.cr-stat small{display:block;color:#65676b;font-size:.64rem}
.cr-stat b{display:grid;font-size:1.05rem;margin:2px 0}.cr-stat b span{grid-area:1/1}
.cr-stat b .b{opacity:0;animation:cr-swapb 10s steps(1) infinite}.cr-stat b .a{animation:cr-swapa 10s steps(1) infinite}
@keyframes cr-swapa{0%,44%{opacity:1}45%,97%{opacity:0}98%{opacity:1}}
@keyframes cr-swapb{0%,44%{opacity:0}45%,97%{opacity:1}98%{opacity:0}}
.cr-stat .up{font-style:normal;font-size:.62rem;color:#1f7a3f;font-weight:700}
.cr-chart{height:64px;background:#fff;border:1px solid #e4e6eb;border-radius:10px;padding:6px}
.cr-chart svg{width:100%;height:100%}
.cr-chart .ar{fill:rgba(36,81,58,.12)}
.cr-chart .ln{fill:none;stroke:#24513a;stroke-width:2.5;stroke-dasharray:1;stroke-dashoffset:1;animation:sx-draw 10s var(--e-out) infinite}
.cr-feed{display:grid;gap:5px}
.cr-feed p{margin:0;display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e4e6eb;border-radius:9px;padding:6px 8px;font-size:.68rem;opacity:0;animation:cr-feed 10s var(--e-out) infinite}
.cr-feed em{font-style:normal;color:#1f7a3f;font-weight:700}
.cr-feed .f2{animation-delay:1.2s}.cr-feed .f3{animation-delay:2.4s}
@keyframes cr-feed{0%{opacity:0;transform:translateY(8px)}6%,90%{opacity:1;transform:none}100%{opacity:0}}
.cr-feed .ic{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex:none;color:#fff}
.cr-feed .ic svg{width:13px;height:13px}.cr-feed .ic.g{background:#e41e3f}.cr-feed .ic.b{background:#1877f2}.cr-feed .ic.p{background:#24513a}
.cr-phone{position:absolute;right:-26px;bottom:0;width:190px;background:#fff;color:#111;border-radius:28px;padding:12px 10px 14px;box-shadow:0 0 0 6px #0d1014,0 30px 60px -16px rgba(0,0,0,.6);font-family:-apple-system,Arial,sans-serif;animation:gx-float 7s var(--e-inout) infinite alternate-reverse}
.cr-ph-top{display:flex;align-items:center;gap:6px;font-size:.66rem;padding-bottom:8px;border-bottom:1px solid #eee}
.cr-ph-top svg{width:14px;height:14px;color:#0a84ff}
.cr-ph-av{width:22px;height:22px;border-radius:50%;background:#9aa3ad;color:#fff;font-size:.55rem;font-weight:700;display:grid;place-items:center}
.cr-ph-body{display:flex;flex-direction:column;gap:5px;padding-top:8px;min-height:190px}
.cr-ph-body .sms{font-size:.66rem;opacity:0}
.cr-miss{margin:0;align-self:center;display:flex;align-items:center;gap:4px;font-size:.6rem;color:#e41e3f;font-weight:600}
.cr-miss svg{width:11px;height:11px}
.cr-ph-body .s1{animation:cr-s 10s var(--e-out) infinite;animation-delay:.8s}
.cr-ph-body .s2{animation:cr-s2 10s var(--e-out) infinite}
.cr-ph-body .s3{animation:cr-s3 10s var(--e-out) infinite}
@keyframes cr-s{0%{opacity:0;transform:translateY(8px)}5%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
@keyframes cr-s2{0%,30%{opacity:0;transform:translateY(8px)}35%,96%{opacity:1;transform:none}100%{opacity:0}}
@keyframes cr-s3{0%,50%{opacity:0;transform:translateY(8px)}55%,96%{opacity:1;transform:none}100%{opacity:0}}
.cr-p1{left:-40px;top:-6px;animation:sm-ping 10s var(--e-back) infinite!important;animation-delay:1.2s!important}
.cr-note{right:auto;left:10px;bottom:6px}

/* six cards */
.cr-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:clamp(28px,4vw,48px)}
.cr-vis{position:relative;height:190px;border-radius:var(--r);overflow:hidden;background:#f0f2f5;color:#111;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
.v-funnel .vf-page{position:absolute;inset:14px 22px;background:#fff;border-radius:10px;box-shadow:0 8px 20px -8px rgba(0,0,0,.2);padding:12px;display:grid;gap:7px;align-content:start}
.v-funnel .vf-page b{font-size:.82rem}
.vf-in{height:24px;border:1px solid #dadde1;border-radius:6px;padding:0 8px;display:flex;align-items:center;font-size:.7rem;overflow:hidden}
.vf-in em{font-style:normal;white-space:nowrap;overflow:hidden;width:0;border-right:1.5px solid #111;animation:vf-type 8s steps(14,end) infinite}
.vf-in.i2 em{animation-name:vf-type2}
@keyframes vf-type{0%,8%{width:0}28%,92%{width:100%;border-color:transparent}100%{width:0}}
@keyframes vf-type2{0%,30%{width:0}50%,92%{width:100%;border-color:transparent}100%{width:0}}
.vf-btn{justify-self:start;background:#24513a;color:#fff;font-weight:700;font-size:.72rem;padding:6px 12px;border-radius:7px;animation:vf-press 8s var(--e-out) infinite}
@keyframes vf-press{0%,55%,62%,100%{transform:none}58%{transform:scale(.92)}}
.vf-toast{position:absolute;right:10px;bottom:10px;background:#1c1e21;color:#fff;font-weight:700;font-size:.72rem;padding:6px 11px;border-radius:999px;opacity:0;animation:vf-t 8s var(--e-back) infinite}
@keyframes vf-t{0%,60%{opacity:0;transform:translateY(10px)}66%,92%{opacity:1;transform:none}100%{opacity:0}}
.v-text{display:flex;flex-direction:column;gap:7px;padding:16px;background:#fff}
.vt-miss{margin:0;align-self:center;display:flex;gap:5px;align-items:center;color:#e41e3f;font-size:.72rem;font-weight:700}.vt-miss svg{width:14px;height:14px}
.v-text .sms{opacity:0}.v-text .vt1{animation:cr-s 8s var(--e-out) infinite;animation-delay:.6s}.v-text .vt2{animation:cr-s2 8s var(--e-out) infinite}
.v-seq{display:grid;gap:7px;padding:14px;align-content:start}
.vs-step{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e4e6eb;border-left:3px solid #1877f2;border-radius:8px;padding:7px 9px;font-size:.7rem;opacity:.35;animation:vs-on 8s steps(1) infinite}
.vs-step i{font-style:normal;font-weight:800;font-size:.62rem;color:#1877f2;min-width:42px}
.vs-step.s2{animation-name:vs-on2}.vs-step.s3{animation-name:vs-on3}
@keyframes vs-on{0%,10%{opacity:.35}11%,95%{opacity:1}}
@keyframes vs-on2{0%,32%{opacity:.35}33%,95%{opacity:1}}
@keyframes vs-on3{0%,54%{opacity:.35}55%,95%{opacity:1}}
.vs-done{justify-self:start;background:#e3f4e8;color:#1f7a3f;font-weight:800;font-size:.7rem;padding:4px 10px;border-radius:999px;opacity:0;animation:vf-t 8s var(--e-back) infinite;animation-delay:.6s}
.v-cal{padding:14px;display:grid;gap:9px;align-content:start;background:#fff}
.vc-head b{font-size:.8rem}.vc-head small{display:block;color:#65676b;font-size:.68rem}
.vc-slots{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.vc-slots span{border:1px solid #1877f2;color:#1877f2;font-weight:700;font-size:.74rem;text-align:center;padding:7px;border-radius:8px}
.vc-slots .pick{animation:vc-pick 8s steps(1) infinite}
@keyframes vc-pick{0%,30%{background:#fff;color:#1877f2}31%,95%{background:#1877f2;color:#fff}}
.vc-conf{justify-self:start;background:#e3f4e8;color:#1f7a3f;font-weight:800;font-size:.7rem;padding:5px 10px;border-radius:999px;opacity:0;animation:vf-t 8s var(--e-back) infinite;animation-delay:-2s}
.v-rev{display:flex;flex-direction:column;gap:10px;padding:16px;background:#fff}
.v-rev .vr1{opacity:0;animation:cr-s 8s var(--e-out) infinite}
.vr-card{align-self:flex-start;display:flex;align-items:center;gap:8px;border:1px solid #e4e6eb;border-radius:12px;padding:8px 12px;box-shadow:0 6px 16px -8px rgba(0,0,0,.2)}
.vr-card svg{width:22px;height:22px}.vr-card small{color:#65676b;font-size:.66rem}
.vr-stars i{font-style:normal;color:#dadce0;font-size:1.1rem;animation:vr-star 8s steps(1) infinite}
.vr-stars i:nth-child(2){animation-delay:.12s}.vr-stars i:nth-child(3){animation-delay:.24s}.vr-stars i:nth-child(4){animation-delay:.36s}.vr-stars i:nth-child(5){animation-delay:.48s}
@keyframes vr-star{0%,40%{color:#dadce0}41%,95%{color:#fbbc05}}
.v-blast{padding:14px;display:grid;gap:12px;align-content:start;background:#fff}
.vb-top b{font-size:.8rem}.vb-top small{display:block;color:#65676b;font-size:.68rem}
.vb-bar{height:8px;border-radius:4px;background:#e4e6eb;overflow:hidden}
.vb-bar i{display:block;height:100%;background:linear-gradient(90deg,#24513a,#a7bc91);transform-origin:left;animation:vb-fill 8s var(--e-out) infinite}
@keyframes vb-fill{0%{transform:scaleX(0)}45%,92%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.vb-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.vb-nums span{background:#f0f2f5;border-radius:8px;padding:7px;text-align:center;font-size:.64rem;color:#65676b;opacity:0;animation:q-in 8s var(--e-out) infinite}
.vb-nums span:nth-child(2){animation-delay:.6s}.vb-nums span:nth-child(3){animation-delay:1.2s}
.vb-nums b{display:block;font-size:1rem;color:#111}

/* pipeline board */
.pp-app{position:relative;background:#fff;color:#1c1e21;border-radius:18px;overflow:hidden;box-shadow:0 30px 80px -24px rgba(0,0,0,.6);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:13px}
.pp-top{display:flex;align-items:center;gap:16px;padding:14px 18px;border-bottom:1px solid #e4e6eb}
.pp-top > b{font-size:15px}
.pp-sel{background:#f0f2f5;border-radius:8px;padding:5px 10px;font-weight:600;color:#444}
.pp-sum{margin-left:auto;color:#65676b}.pp-val{display:inline-grid;color:#1f7a3f}.pp-val span{grid-area:1/1}
.pp-val .a{animation:cr-swapa 12s steps(1) infinite}.pp-val .b{opacity:0;animation:cr-swapb 12s steps(1) infinite}
.pp-new{background:#24513a;color:#fff;font-weight:700;padding:7px 12px;border-radius:8px}
.pp-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:14px;background:#f7f8fa;min-height:330px}
.pp-col{background:#eef0f3;border-radius:12px;padding:8px;display:grid;gap:8px;align-content:start}
.pp-col.won{background:#e6f2ea}
.pp-ch{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 2px;font-size:12px}
.pp-ch i{font-style:normal;background:#fff;border-radius:999px;padding:1px 8px;color:#65676b;font-weight:700}
.pp-card{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;background:#fff;border:1px solid #e4e6eb;border-radius:10px;padding:9px;box-shadow:0 1px 2px rgba(0,0,0,.05);font-size:12px}
.pp-card small{display:block;color:#65676b;font-size:11px}
.pp-card em{font-style:normal;font-weight:800;color:#1f7a3f}
.pp-tag{grid-column:1/-1;justify-self:start;background:#e7f0ff;color:#1a4fb5;font-weight:700;font-size:10px;padding:2px 7px;border-radius:999px}
.pp-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:10.5px;flex:none}
.a1{background:#d06b2a}.a2{background:#3b6aa8}.a3{background:#2f7a52}.a4{background:#7b4cff}.a5{background:#b85a7a}.a6{background:#24513a}
.pp-card.mover{animation:pp-src 12s steps(1) infinite}
@keyframes pp-src{0%,8%{opacity:1}9%,96%{opacity:.25}97%{opacity:1}}
.pp-ghost{position:absolute;z-index:4;top:113px;left:22px;width:calc((100% - 28px - 36px)/4 - 16px);display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;background:#fff;border:1.5px solid #24513a;border-radius:10px;padding:9px;font-size:12px;box-shadow:0 18px 40px -10px rgba(0,0,0,.35);opacity:0;animation:pp-move 12s cubic-bezier(.6,0,.25,1) infinite}
.pp-ghost small{display:block;font-size:11px;color:#65676b;grid-area:2/1}
.pp-ghost div{display:grid}
.pp-ghost .g1,.pp-ghost .g2,.pp-ghost .g3{opacity:0}
.pp-ghost .g1{animation:pp-g1 12s steps(1) infinite}.pp-ghost .g2{animation:pp-g2 12s steps(1) infinite}.pp-ghost .g3{animation:pp-g3 12s steps(1) infinite}
.pp-ghost em{font-style:normal;font-weight:800;color:#1f7a3f}
/* column step = (board width - padding)/4 + gap; expressed with the same calc as the width */
@keyframes pp-move{
 0%,8%{opacity:0;transform:translateX(0)}
 10%,22%{opacity:1;transform:translateX(0)}
 32%,44%{opacity:1;transform:translateX(calc(100% + 28px))}
 54%,66%{opacity:1;transform:translateX(calc(200% + 56px))}
 76%,92%{opacity:1;transform:translateX(calc(300% + 84px));border-color:#1f7a3f}
 97%,100%{opacity:0;transform:translateX(calc(300% + 84px))}}
@keyframes pp-g1{0%,30%{opacity:1}31%,100%{opacity:0}}
@keyframes pp-g2{0%,30%{opacity:0}31%,63%{opacity:1}64%,100%{opacity:0}}
@keyframes pp-g3{0%,63%{opacity:0}64%,97%{opacity:1}98%,100%{opacity:0}}
.pp-toast{position:absolute;right:16px;bottom:16px;z-index:5;display:flex;align-items:center;gap:10px;background:#1c1e21;color:#fff;border-radius:12px;padding:10px 14px;font-weight:700;box-shadow:0 12px 30px -8px rgba(0,0,0,.5);opacity:0;animation:pp-toast 12s var(--e-back) infinite}
.pp-toast small{display:block;font-weight:500;color:#b0b3b8;font-size:11px}
.pp-toast svg{width:18px;height:18px;color:#31a24c}
@keyframes pp-toast{0%,24%{opacity:0;transform:translateY(12px)}28%,42%{opacity:1;transform:none}46%,100%{opacity:0}}

/* workflow builder */
.cr-flow-sec .fit{box-shadow:0 30px 70px -30px rgba(15,42,30,.45)}
.wf-app{position:relative;background:#fff;color:#1c1e21;border:1px solid #e4e6eb;border-radius:18px;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:13px}
.wf-top{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid #e4e6eb}
.wf-top > b{font-size:15px}
.wf-on{display:flex;align-items:center;gap:6px;background:#e3f4e8;color:#1f7a3f;font-weight:700;font-size:12px;padding:4px 10px;border-radius:999px}
.wf-on i{width:7px;height:7px;border-radius:50%;background:#31a24c;animation:wf-pulse 2s ease-in-out infinite}
@keyframes wf-pulse{0%,100%{box-shadow:0 0 0 0 rgba(49,162,76,.5)}50%{box-shadow:0 0 0 5px rgba(49,162,76,0)}}
.wf-stat{margin-left:auto;color:#65676b}
.wf-canvas{position:relative;display:flex;flex-direction:column;align-items:center;padding:22px 20px 26px;background-color:#f7f8fa;background-image:radial-gradient(#d6d9de 1px,transparent 1px);background-size:18px 18px}
.wf-node{position:relative;z-index:1;width:300px;background:#fff;border:1px solid #dfe3ea;border-left:4px solid #1877f2;border-radius:10px;padding:9px 12px;box-shadow:0 4px 12px -6px rgba(0,0,0,.15);animation:wf-lit 10s steps(1) infinite}
.wf-node small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:#8a8d91;font-weight:700}
.wf-node b{display:block;font-size:13px}.wf-node span{display:block;color:#65676b;font-size:12px}
.wf-node.trig{border-left-color:#f59e0b}.wf-node.wait{border-left-color:#8a8d91}.wf-node.if{border-left-color:#7b4cff}.wf-node.good{border-left-color:#31a24c}
.wf-line{display:block;width:2px;height:22px;background:#c4c9d0;position:relative}
.wf-branch{display:grid;grid-template-columns:1fr 1fr;gap:28px;width:100%;max-width:720px;position:relative;padding-top:22px}
.wf-branch::before{content:"";position:absolute;top:0;left:25%;right:25%;height:2px;background:#c4c9d0}
.wf-branch::after{content:"";position:absolute;top:-22px;left:50%;width:2px;height:22px;background:#c4c9d0}
.wf-arm{display:flex;flex-direction:column;align-items:center}
.wf-arm > .wf-line{margin-top:-22px}
.wf-arm em{font-style:normal;font-weight:800;font-size:11px;padding:2px 9px;border-radius:999px;margin:4px 0 8px}
.wf-arm.yes em{background:#e3f4e8;color:#1f7a3f}.wf-arm.no em{background:#fde8ea;color:#c0263b}
.wf-node.n1{animation-name:wf-l1}.wf-node.n2{animation-name:wf-l2}.wf-node.n3{animation-name:wf-l3}.wf-node.n4{animation-name:wf-l4}.wf-node.n5{animation-name:wf-l5}.wf-node.n6{animation-name:wf-l6}.wf-node.n7{animation-name:none}
@keyframes wf-l1{0%,2%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}3%,14%{box-shadow:0 0 0 3px rgba(245,158,11,.45)}15%,100%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}}
@keyframes wf-l2{0%,15%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}16%,28%{box-shadow:0 0 0 3px rgba(24,119,242,.4)}29%,100%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}}
@keyframes wf-l3{0%,29%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}30%,42%{box-shadow:0 0 0 3px rgba(24,119,242,.4)}43%,100%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}}
@keyframes wf-l4{0%,43%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}44%,58%{box-shadow:0 0 0 3px rgba(138,141,145,.45)}59%,100%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}}
@keyframes wf-l5{0%,59%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}60%,72%{box-shadow:0 0 0 3px rgba(123,76,255,.4)}73%,100%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}}
@keyframes wf-l6{0%,73%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}74%,95%{box-shadow:0 0 0 3px rgba(49,162,76,.45)}96%,100%{box-shadow:0 4px 12px -6px rgba(0,0,0,.15)}}
.wf-line::after{content:"";position:absolute;left:-3px;top:-4px;width:8px;height:8px;border-radius:50%;background:#1877f2;opacity:0}
.wf-line.l1::after{animation:wf-dot 10s linear infinite;animation-delay:1.3s}
.wf-line.l2::after{animation:wf-dot 10s linear infinite;animation-delay:2.7s}
.wf-line.l3::after{animation:wf-dot 10s linear infinite;animation-delay:4.1s}
.wf-line.l4::after{animation:wf-dot 10s linear infinite;animation-delay:5.7s}
.wf-line.l5::after{background:#31a24c;animation:wf-dot 10s linear infinite;animation-delay:7.1s}
@keyframes wf-dot{0%{opacity:1;top:-4px}6%{opacity:1;top:calc(100% - 4px)}7%,100%{opacity:0}}
.wf-token{display:none}

/* one inbox */
.cr-inbox{position:relative;display:grid;justify-items:center}
.ib-phone{height:600px}
.ib-head{padding:6px 14px 8px}
.ib-head b{display:block;font-size:20px;letter-spacing:-.3px;margin-bottom:8px}
.ib-tabs{display:flex;gap:6px}.ib-tabs i{font-style:normal;font-size:11px;font-weight:600;padding:5px 11px;border-radius:999px;background:#f0f2f5;color:#444}.ib-tabs i.on{background:#0f2a1e;color:#fff}
.ib-list{display:grid;align-content:start}
.ib-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid #f2f2f2}
.ib-row b{font-size:12.5px}.ib-row small{display:block;color:#65676b;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-row time{font-size:10.5px;color:#8a8d91;align-self:start}
.ib-row.new b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#1877f2;margin-left:6px;vertical-align:middle}
.ib-row.new small{color:#111;font-weight:600}
.ib-av{position:relative;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:11.5px}
.ib-av .ch{position:absolute;right:-5px;bottom:-3px;font-style:normal;font-size:7.5px;font-weight:800;color:#fff;padding:1px 3px;border-radius:5px;border:1.5px solid #fff;font-family:Arial,sans-serif}
.ch.sms{background:#31a24c}.ch.fb{background:#1877f2;font-size:9px;padding:0 4px}.ch.ig{background:linear-gradient(45deg,#fa7e1e,#d62976,#962fbf)}.ch.gg{background:#4285f4}.ch.web{background:#444}
.ib-row.r1,.ib-row.r2,.ib-row.r3{animation:ib-in 10s var(--e-out) infinite}
.ib-row.r2{animation-delay:-.6s}.ib-row.r1{animation-delay:-1.2s}
@keyframes ib-in{0%{opacity:0;transform:translateY(-14px)}6%,94%{opacity:1;transform:none}100%{opacity:0}}
.ib-push{position:absolute;left:10px;right:10px;top:40px;z-index:3;display:flex;align-items:center;gap:10px;background:rgba(245,245,247,.97);border-radius:16px;padding:10px 12px;box-shadow:0 12px 30px -10px rgba(0,0,0,.35);font-size:11.5px;opacity:0;animation:ib-push 10s var(--e-back) infinite}
.ib-push small{display:block;color:#444}
.ib-push .bars{display:grid;gap:2px;width:28px;height:28px;border-radius:7px;background:#0f2a1e;padding:7px 6px;align-content:center;flex:none}
.ib-push .bars i{height:3px;border-radius:2px;background:#a7bc91}.ib-push .bars i:nth-child(3){background:#e8ede3}
@keyframes ib-push{0%,8%{opacity:0;transform:translateY(-20px)}13%,34%{opacity:1;transform:none}40%,100%{opacity:0;transform:translateY(-20px)}}

.cr-time .sx-time h3{color:var(--ink)}.cr-time .sx-time p{color:var(--ink-2)}
.cr-time .sx-dot{box-shadow:0 0 0 6px var(--paper)}
.cr-time .sx-rail{background:var(--line)}
.cr-fine{max-width:620px;margin:22px auto 0;text-align:center;color:var(--cream-3);font-size:.88rem}

@media (max-width:1180px){.cr-phone{right:-6px}.cr-p1{left:-10px}}
@media (max-width:1000px){.cr-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:960px){.cr-fit{justify-self:stretch;width:100%;margin-top:14px}}
@media (max-width:560px){.cr-cards{grid-template-columns:minmax(0,1fr)}.ib-phone{height:580px}}
@media (max-width:699px){.cr-fit .cr-phone{right:0}.cr-fit .cr-p1{left:0}}
@media (max-width:699px){.js .fit{margin-left:-12px;margin-right:-12px;border-radius:12px}}
@media (prefers-reduced-motion:reduce){
  .cr-stage *,.cr-cards *,.pp-app *,.wf-app *,.cr-inbox *{animation:none!important}
  .cr-feed p,.cr-ph-body .sms,.v-text .sms,.v-rev .vr1,.vf-toast,.vs-done,.vc-conf,.vb-nums span,.ib-row{opacity:1!important;transform:none!important}
  .vs-step{opacity:1}.vf-in em{width:100%;border:0}.vb-bar i{transform:none}.pp-ghost,.pp-toast,.ib-push,.cr-p1{display:none}
  .cr-chart .ln{stroke-dashoffset:0}.vr-stars i{color:#fbbc05}
}

/* ═════════ AUDIT PAGE (8 Nov 2026) · au- ═════════ */
.au-band .gx-row.r1 .gx-track{animation-duration:52s}
.au-hero .hero-ctas{align-items:flex-start}
.au-fit{justify-self:end;width:min(560px,100%);min-width:0;max-width:100%;margin-top:0;overflow:visible;border-radius:0}
.au-stage{position:relative;padding:16px 0 70px;width:100%}
.au-meet{background:#202124;color:#e8eaed;border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -24px rgba(0,0,0,.65);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:12px;animation:gx-float 9s var(--e-inout) infinite alternate}
.au-mtop{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;font-size:11px;color:#bdc1c6}
.au-rec{display:flex;align-items:center;gap:6px;color:#e8eaed;font-weight:600}.au-rec i{width:8px;height:8px;border-radius:50%;background:#ea4335;animation:wf-pulse 2s ease-in-out infinite}
.au-share{margin:0 10px;border-radius:10px;overflow:hidden;background:#fff;color:#202124}
.au-sbar{display:flex;justify-content:space-between;background:#e8f0fe;color:#174ea6;font-size:10.5px;padding:5px 10px}
.au-ads{position:relative;padding:10px}
.au-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px}
.au-kpis span{border:1px solid #dadce0;border-radius:8px;padding:6px 8px}
.au-kpis small{display:block;color:#5f6368;font-size:9.5px}.au-kpis b{font-size:14px}
.au-kpis .bad{border-color:#f28b82;background:#fce8e6;animation:au-flash 8s steps(1) infinite}
@keyframes au-flash{0%,60%{border-color:#dadce0;background:#fff}61%,96%{border-color:#f28b82;background:#fce8e6}}
.au-rows p{margin:0;display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:center;padding:7px 6px;border-top:1px solid #f1f3f4;font-size:11px}
.au-rows i{width:8px;height:8px;border-radius:50%;background:#34a853}
.au-rows em{font-style:normal;color:#5f6368}
.au-rows b{font-size:10px;padding:2px 6px;border-radius:999px}.au-rows .g{background:#e6f4ea;color:#137333}.au-rows .r{background:#fce8e6;color:#c5221f}
.au-rows .hl{position:relative;animation:au-hl 8s steps(1) infinite}
@keyframes au-hl{0%,30%{background:transparent}31%,96%{background:#fef7e0}}
.au-cursor{position:absolute;width:16px;height:20px;background:#111;clip-path:polygon(0 0,0 80%,26% 60%,44% 100%,58% 94%,40% 56%,76% 56%);filter:drop-shadow(0 0 1px #fff);left:70%;top:20%;animation:au-cur 8s cubic-bezier(.6,0,.3,1) infinite}
@keyframes au-cur{0%,10%{left:70%;top:20%}28%,55%{left:58%;top:62%}70%,100%{left:86%;top:12%}}
.au-circle{position:absolute;left:3%;right:3%;top:calc(52% + 6px);height:30px;border:2.5px solid #ea4335;border-radius:12px;opacity:0;animation:au-ring 8s var(--e-back) infinite}
@keyframes au-ring{0%,30%{opacity:0;transform:scale(1.08)}36%,90%{opacity:1;transform:none}96%,100%{opacity:0}}
.au-tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 10px}
.au-tiles span{position:relative;height:64px;border-radius:9px;background:#3c4043;display:grid;place-items:center}
.au-tiles i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;color:#fff;background:#8430ce}
.au-tiles .t2 i{background:#24513a;box-shadow:0 0 0 3px #8ab4f8;animation:au-talk 1.4s ease-in-out infinite}
@keyframes au-talk{0%,100%{box-shadow:0 0 0 2px #8ab4f8}50%{box-shadow:0 0 0 5px rgba(138,180,248,.5)}}
.au-tiles small{position:absolute;left:8px;bottom:5px;font-size:10px;color:#e8eaed}
.au-ctrl{display:flex;justify-content:center;gap:10px;padding:6px 0 12px}
.au-ctrl i{width:30px;height:30px;border-radius:50%;background:#3c4043}.au-ctrl .share{background:#8ab4f8}.au-ctrl .end{width:44px;border-radius:15px;background:#ea4335}
.au-find{position:absolute;z-index:3;display:grid;gap:2px;background:#fff;color:#202124;border-radius:12px;padding:9px 12px;box-shadow:0 16px 36px -12px rgba(0,0,0,.5);font-size:12px;max-width:220px;opacity:0;animation:au-find 9s var(--e-back) infinite}
.au-find small{color:#5f6368;font-size:11px}
.au-find b{font-size:12.5px}.au-find .r{color:#c5221f}.au-find .y{color:#b06000}.au-find .g{color:#137333}
.au-find.f1{right:-34px;top:120px}.au-find.f2{left:-40px;top:300px;animation-delay:2.4s}.au-find.f3{right:-20px;bottom:22px;animation-delay:4.8s}
@keyframes au-find{0%{opacity:0;transform:translateY(12px) scale(.94)}6%,40%{opacity:1;transform:none}48%,100%{opacity:0;transform:translateY(-6px)}}
.au-note{right:auto;left:0;bottom:4px}
.au-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:clamp(28px,4vw,48px)}
.au-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow)}
.au-card h3{margin:14px 0 10px;font-size:1.15rem}
.au-card ul{margin:0;padding:0;list-style:none;display:grid;gap:7px}
.au-card li{position:relative;padding-left:20px;color:var(--ink-2);font-size:.95rem}
.au-card li::before{content:"";position:absolute;left:0;top:.45em;width:9px;height:9px;border-radius:3px;background:var(--sage)}
.au-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--mist);color:var(--forest)}
.au-ico svg{width:22px;height:22px}
.au-grade{position:absolute;right:18px;top:18px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:1.3rem;color:#fff;transform:scale(0) rotate(-20deg)}
.au-card.in .au-grade{animation:au-stamp .7s var(--e-back) forwards;animation-delay:calc(.35s + var(--i,0)*120ms)}
@keyframes au-stamp{to{transform:none}}
.g-b{background:#2f7a52}.g-c{background:#d29b16}.g-d{background:#c0392b}
.au-docfit{width:min(460px,100%);justify-self:center;min-width:0;margin-top:0;overflow:visible;border-radius:0}
.au-doc{background:#fff;color:#1c1e21;border-radius:14px;padding:20px;box-shadow:0 30px 70px -24px rgba(0,0,0,.6);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:13px;transform-origin:top left}
.au-dh{display:flex;gap:10px;align-items:center;padding-bottom:12px;border-bottom:2px solid #0f2a1e;margin-bottom:12px}
.au-dh .bars{display:grid;gap:3px;width:26px;height:26px;border-radius:6px;background:#0f2a1e;padding:6px 5px;align-content:center}
.au-dh .bars i{height:3px;border-radius:2px;background:#a7bc91}.au-dh small{display:block;color:#65676b;font-size:11px}
.au-score{display:grid;gap:8px}
.au-score p{margin:0;display:grid;grid-template-columns:100px 1fr 22px;gap:10px;align-items:center;font-size:12px}
.au-score i{height:9px;border-radius:5px;background:#eef0f3;overflow:hidden}
.au-score em{display:block;height:100%;width:var(--w);border-radius:5px;transform-origin:left;animation:au-bar 8s var(--e-out) infinite}
.au-score em.r{background:#c0392b}.au-score em.y{background:#d29b16}.au-score em.g{background:#2f7a52}
@keyframes au-bar{0%{transform:scaleX(0)}25%,94%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.au-score b{text-align:center}
.au-money{margin:14px 0;padding:10px 12px;border-radius:10px;background:#fce8e6;display:flex;justify-content:space-between;align-items:center}
.au-money small{color:#a50e0e;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.5px}.au-money b{font-size:20px;color:#a50e0e}.au-money span{font-size:12px;font-weight:600}
.au-fixes{margin:0;padding:0 0 0 22px;display:grid;gap:8px}
.au-fixes li{font-size:12px;opacity:0;animation:q-in 8s var(--e-out) infinite}
.au-fixes li small{display:block;color:#65676b;font-size:11px}
.au-fixes .x2{animation-delay:.4s}.au-fixes .x3{animation-delay:.8s}.au-fixes .x4{animation-delay:1.2s}
.au-book-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,80px);align-items:center}
.au-pick{background:rgba(255,255,255,.04);border:1px solid rgba(167,188,145,.22);border-radius:var(--r-lg);padding:clamp(20px,3vw,30px);display:grid;gap:16px}
.au-pick-h{margin:0;color:var(--cream);font-weight:700}
.au-chips{display:flex;flex-wrap:wrap;gap:10px}
.au-chips label{cursor:pointer}
.au-chips input{position:absolute;opacity:0;pointer-events:none}
.au-chips span{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1.5px solid rgba(232,237,227,.25);color:var(--cream-2);font-weight:600;font-size:.95rem;transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast)}
.au-chips svg{width:17px;height:17px}
.au-chips input:checked + span{background:var(--sage);border-color:var(--sage);color:var(--night)}
.au-chips input:focus-visible + span{outline:2px solid var(--sage-2);outline-offset:2px}
.au-total{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid rgba(232,237,227,.15);color:var(--cream-2)}
.au-price{font-family:var(--f-display);font-size:2rem;color:var(--cream)}
.au-pay{justify-content:center}.au-pay.off{opacity:.5;pointer-events:none}
.au-secure{margin:0;display:flex;align-items:center;gap:6px;justify-content:center;color:var(--cream-3);font-size:.85rem}.au-secure svg{width:14px;height:14px}
.au-or{margin:0;text-align:center;color:var(--cream-3);font-size:.9rem}.au-or a{color:var(--sage-2)}
.au-done-in{text-align:left}
.au-done-steps{margin:34px 0 18px;padding:0;list-style:none;display:grid;gap:14px;counter-reset:s}
.au-done-steps li{counter-increment:s;position:relative;padding:14px 16px 14px 56px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(167,188,145,.2);color:var(--cream-2)}
.au-done-steps li::before{content:counter(s);position:absolute;left:14px;top:14px;width:28px;height:28px;border-radius:50%;background:var(--forest);color:#fff;display:grid;place-items:center;font-weight:800}
.au-done-steps b{display:block;color:var(--cream);margin-bottom:3px}
@media (max-width:1000px){.au-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:960px){.au-fit{justify-self:stretch;width:100%;margin-top:14px}}
@media (max-width:860px){.au-book-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:699px){.au-fit .au-find.f1,.au-fit .au-find.f3{right:0}.au-fit .au-find.f2{left:0}}
@media (max-width:560px){.au-cards{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.au-stage *,.au-doc *,.au-stage .au-meet{animation:none!important}.au-find,.au-fixes li{opacity:1!important;transform:none!important}.au-grade{transform:none}.au-score em{transform:none}.au-cursor,.au-circle{display:none}}
body[data-page="audit"] .callbar{display:none!important}

/* ═════════ PACKAGES PAGE (8 Nov 2026) · pk- ═════════ */
.pk-fit{justify-self:end;width:min(520px,100%);min-width:0;max-width:100%;margin-top:0;overflow:visible;border-radius:0}
.pk-stage{position:relative;padding:10px 0 50px;width:100%}
.pk-blocks{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pk-b{position:relative;display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:14px;background:var(--night-3);border:1px solid rgba(167,188,145,.22);color:var(--cream);font-weight:700;font-size:.92rem;box-shadow:var(--shadow-lg);animation:pk-lit 9s steps(1) infinite}
.pk-b svg{width:18px;height:18px;color:var(--sage);flex:none}
.pk-b em{margin-left:auto;font-style:normal;font-weight:600;color:var(--cream-3);font-size:.82rem}
.pk-b::after{content:"✓";position:absolute;right:-7px;top:-7px;width:20px;height:20px;border-radius:50%;background:var(--sage);color:var(--night);font-size:12px;font-weight:900;display:grid;place-items:center;transform:scale(0);animation:pk-tick 9s var(--e-back) infinite}
.pk-b.b2,.pk-b.b2::after{animation-delay:.5s}.pk-b.b3,.pk-b.b3::after{animation-delay:1s}.pk-b.b4,.pk-b.b4::after{animation-delay:1.5s}.pk-b.b5,.pk-b.b5::after{animation-delay:2s}.pk-b.b6,.pk-b.b6::after{animation-delay:2.5s}
@keyframes pk-lit{0%,4%{border-color:rgba(167,188,145,.22)}5%,92%{border-color:var(--sage)}93%,100%{border-color:rgba(167,188,145,.22)}}
@keyframes pk-tick{0%,4%{transform:scale(0)}8%,92%{transform:scale(1)}96%,100%{transform:scale(0)}}
.pk-box{position:relative;margin-top:26px;border-radius:20px;padding:20px 22px;background:linear-gradient(150deg,var(--forest),var(--deep,#0F2A1E));border:1px solid rgba(167,188,145,.35);box-shadow:0 30px 60px -20px rgba(0,0,0,.6);color:var(--cream);animation:pk-box 9s var(--e-back) infinite}
@keyframes pk-box{0%,40%{transform:none;box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}46%{transform:scale(1.03);box-shadow:0 0 0 3px var(--sage),0 30px 60px -20px rgba(0,0,0,.6)}54%,100%{transform:none;box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}}
.pk-box-top{display:flex;align-items:center;gap:10px;font-size:1.05rem}
.pk-box-top .bars{display:grid;gap:3px;width:22px}.pk-box-top .bars i{height:4px;border-radius:2px;background:var(--sage)}.pk-box-top .bars i:nth-child(2){background:var(--sage-2)}.pk-box-top .bars i:nth-child(3){background:#e8ede3}
.pk-sum{display:flex;align-items:baseline;gap:14px;margin-top:10px}
.pk-sum .was{color:var(--cream-3);text-decoration:line-through;font-size:1.2rem;animation:pk-was 9s steps(1) infinite}
.pk-sum .now{font-family:var(--f-display);font-size:2.6rem;line-height:1;animation:pk-now 9s var(--e-back) infinite}
.pk-sum .now small{font-family:var(--f-body,inherit);font-size:.9rem;color:var(--cream-2);margin-left:3px}
@keyframes pk-now{0%,50%{opacity:0;transform:translateY(10px)}56%,96%{opacity:1;transform:none}100%{opacity:0}}
@keyframes pk-was{0%,48%{text-decoration:none}49%,100%{text-decoration:line-through}}
.pk-save{display:inline-block;margin-top:10px;background:#f2c14e;color:#0f2a1e;font-weight:800;font-size:.85rem;padding:5px 12px;border-radius:999px;animation:sx-chip 9s var(--e-back) infinite;animation-delay:5.2s}
.pk-note{right:0;bottom:4px}
.pk-full{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);margin-top:clamp(26px,4vw,44px);padding:clamp(24px,4vw,44px);border-radius:28px;background:linear-gradient(150deg,var(--forest),#0F2A1E);color:var(--cream);box-shadow:0 40px 80px -30px rgba(15,42,30,.6);position:relative;overflow:hidden}
.pk-full::after{content:"";position:absolute;right:-120px;top:-120px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(167,188,145,.25),transparent 70%)}
.pk-tag{display:inline-block;background:#f2c14e;color:#0f2a1e;font-weight:800;font-size:.8rem;padding:5px 12px;border-radius:999px}
.pk-full h3{color:var(--cream);font-size:clamp(1.6rem,3vw,2.2rem);margin:16px 0 6px}
.pk-full .price{color:var(--cream)}
.pk-was{color:var(--cream-2);margin:6px 0 20px}.pk-was b{color:#f2c14e}
.pk-full-l .btn-lg{margin-bottom:12px}
.pk-full-r{list-style:none;margin:0;padding:0;display:grid;gap:12px;position:relative;z-index:1}
.pk-full-r li{display:flex;gap:14px;align-items:flex-start;padding:14px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(167,188,145,.18)}
.pk-full-r b{display:block;color:var(--cream)}.pk-full-r small{color:var(--cream-2);font-size:.9rem}
.pk-i{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--sage);color:var(--night);flex:none}.pk-i svg{width:20px;height:20px}
.pk-why{max-width:860px;margin:22px auto 0;text-align:center;color:var(--ink-2);font-size:1.02rem}
.pk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:clamp(28px,4vw,48px)}
.pk-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:22px;background:rgba(255,255,255,.04);border:1px solid rgba(167,188,145,.2);color:var(--cream-2);transition:transform var(--t-base) var(--e-out),border-color var(--t-base)}
.pk-card:hover{transform:translateY(-4px);border-color:var(--sage)}
.pk-card.hot{border-color:var(--sage);box-shadow:0 0 0 1px var(--sage),0 30px 60px -30px rgba(167,188,145,.35)}
.pk-goal{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:var(--sage-2);background:rgba(167,188,145,.12);padding:5px 11px;border-radius:999px}
.pk-goal svg{width:15px;height:15px}
.pk-card h3{color:var(--cream);font-size:1.4rem;margin:2px 0 0}
.pk-price{display:flex;align-items:baseline;gap:6px}.pk-price b{font-family:var(--f-display);font-size:2.2rem;color:var(--cream)}.pk-price span{color:var(--cream-3)}.pk-price s{margin-left:auto;color:var(--cream-3)}
.pk-card .ticks{margin:0}.pk-card .ticks li{color:var(--cream-2)}
.pk-best,.pk-rec{margin:0;font-size:.93rem;line-height:1.55}.pk-best b,.pk-rec b{color:var(--cream)}
.pk-card .btn{margin-top:auto;justify-content:center}
.pk-saveb{position:absolute;right:18px;top:-12px;box-shadow:0 6px 14px -6px rgba(0,0,0,.5);background:#f2c14e;color:#0f2a1e;font-weight:800;font-size:.75rem;padding:4px 10px;border-radius:999px}
.pk-audit{background:transparent;border-style:dashed}
.pk-tablewrap{margin-top:clamp(24px,3vw,40px);overflow-x:auto;border-radius:18px;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow)}
.pk-table{width:100%;min-width:720px;border-collapse:collapse;font-size:.95rem}
.pk-table th,.pk-table td{padding:13px 12px;text-align:center;border-bottom:1px solid var(--line)}
.pk-table th:first-child,.pk-table td:first-child{text-align:left;font-weight:700;color:var(--ink)}
.pk-table thead th{font-size:.85rem;color:var(--ink-2)}
.pk-table .hi{background:var(--mist);font-weight:800;color:var(--forest)}
.pk-table td.y{color:var(--forest);font-weight:800;font-size:1.1rem}
.pk-table tr.pr td{font-weight:800;color:var(--ink)}.pk-table tr.sv td{color:#a06d00;font-weight:700}
.pk-fine{max-width:760px;margin:16px auto 0;text-align:center;color:var(--ink-3);font-size:.9rem}
.pk-chosen{margin:0 0 14px;padding:10px 14px;border-radius:12px;background:rgba(167,188,145,.14);color:var(--cream)}
@media (max-width:1000px){.pk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:960px){.pk-fit{justify-self:stretch;width:100%;margin-top:14px}}
@media (max-width:860px){.pk-full{grid-template-columns:minmax(0,1fr)}}
@media (max-width:620px){.pk-grid{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.pk-stage *{animation:none!important}.pk-sum .now,.pk-save{opacity:1;transform:none}}

.pk-full .price .per,.pk-full .price .cur{color:var(--cream-2)}
.pk-full .em-under{color:var(--cream-2)!important;opacity:.85}
.pk-full .em-wrap{display:inline-flex}

/* home hero: packages call-to-action (8 Nov 2026) */
.hx-pk{display:flex;align-items:center;gap:14px;margin:16px 0 0;padding:12px 14px 12px 16px;border-radius:16px;background:linear-gradient(100deg,rgba(242,193,78,.16),rgba(167,188,145,.12));border:1px solid rgba(242,193,78,.45);color:var(--cream);text-decoration:none;max-width:560px;animation:hx-in .6s var(--e-out) .9s both;transition:transform var(--t-fast),border-color var(--t-fast)}
.hx-pk:hover{transform:translateY(-2px);border-color:#f2c14e}
.hx-pk .tag{flex:none;background:#f2c14e;color:#0f2a1e;font-weight:800;font-size:.78rem;padding:4px 10px;border-radius:999px}
.hx-pk span.t{flex:1;font-weight:700;line-height:1.3}.hx-pk span.t small{display:block;font-weight:500;color:var(--cream-2);font-size:.85rem}
.hx-pk svg{width:20px;height:20px;flex:none;color:#f2c14e}
@media (max-width:560px){.hx-pk{flex-wrap:wrap;gap:8px 10px;padding:12px 14px}.hx-pk span.t{flex:1 1 calc(100% - 40px);font-size:.95rem}}