/* ==========================================================================
   CutWatt inner pages (services, cold storage, results, about, contact, thanks)
   Owner: pages agent. Reads the shared --cw-* tokens from cutwatt.css, with
   fallbacks so the sheet still renders if they are missing.
   Logical properties everywhere except the real/thermal comparer (forced LTR).
   ========================================================================== */

.pg{
    --pg-red:var(--cw-red,#ff2a2a);
    --pg-orange:var(--cw-orange,#ff7a1a);
    --pg-yellow:var(--cw-yellow,#d4f01a);
    --pg-mint:var(--cw-mint,#14f0a0);
    --pg-ice:var(--cw-ice,#73d1ff);
    --pg-fg:var(--cw-fg,#eef3f8);
    --pg-mut:var(--cw-mut,#a9b6c8);
    --pg-dim:var(--cw-dim,#8393ad);
    --pg-line:var(--cw-line,rgba(255,255,255,.14));
    --pg-line-soft:var(--cw-line-soft,rgba(255,255,255,.08));
    --pg-bg2:var(--cw-bg-2,#053a66);
    --pg-r:var(--cw-radius,16px);
    --pg-rl:var(--cw-radius-l,22px);
    --pg-gut:var(--cw-gutter,clamp(16px,4vw,28px));
    --pg-ramp:linear-gradient(100deg,var(--pg-red),var(--pg-orange) 55%,var(--pg-yellow));
    --pg-save:linear-gradient(100deg,var(--pg-yellow),var(--pg-mint) 70%);
    color:var(--pg-fg);
    overflow-x:clip;
    position:relative;
}
.pg *,.pg *::before,.pg *::after{box-sizing:border-box}
.pg-sprite{position:absolute;width:0;height:0;overflow:hidden}
.pg-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- layout ---------- */
.pg-wrap{width:100%;max-width:var(--cw-wrap,1200px);margin-inline:auto;padding-inline:var(--pg-gut)}
.pg-wrap--narrow{max-width:900px}
.pg-sec{padding-block:clamp(44px,6.5vw,84px);position:relative}
.pg-sec--alt{background:linear-gradient(180deg,transparent,rgba(115,209,255,.04) 12%,rgba(115,209,255,.04) 88%,transparent)}
.pg-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.pg-grid{display:grid;gap:16px}
.pg-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pg-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pg-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pg-mt{margin-top:clamp(20px,3vw,32px)}
.pg-mb{margin-bottom:16px}
.pg-gallery{align-items:stretch}

/* ---------- type ---------- */
.pg-h1,.pg-h2,.pg-h3{font-family:var(--fd);margin:0;text-wrap:balance}
.pg-h1{font-size:clamp(34px,5.6vw,62px);font-weight:800;letter-spacing:-.03em;line-height:1.05}
.pg-h1 span{display:inline-block}
.pg-h1--m{font-size:clamp(30px,4.6vw,48px)}
.pg-h2{font-size:clamp(26px,3.7vw,44px);font-weight:800;letter-spacing:-.025em;line-height:1.1}
.pg-h2--s{font-size:clamp(22px,2.6vw,30px)}
.pg-h2 a{color:inherit}
.pg-h2 a:hover{color:var(--pg-mint)}
.pg-h3{font-size:clamp(17px,1.7vw,20px);font-weight:700;letter-spacing:-.01em;line-height:1.25}
.pg-h3--l{margin-bottom:6px}
[dir="rtl"] .pg-h1{line-height:1.3}
[dir="rtl"] .pg-h2{line-height:1.35}
[dir="rtl"] .pg-h3{line-height:1.45}
.pg-lead{font-size:clamp(16px,1.35vw,18.5px);color:var(--pg-mut);max-width:62ch;margin:18px 0 0}
.pg-eyebrow{display:flex;align-items:center;gap:12px;font:500 12px/1.4 var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-orange);margin:0 0 18px}
.pg-eyebrow::before{content:"";width:28px;height:1px;background:currentColor;flex:none}
.pg-mono{font:500 12.5px/1.4 var(--fm);letter-spacing:.06em;color:var(--pg-dim);margin:2px 0 0}
.pg-note{font-size:13.5px;color:var(--pg-dim);margin:16px 0 0;max-width:80ch}
.pg-note--c{text-align:center;margin-inline:auto}
.pg-grad-heat{background:var(--pg-ramp);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-grad-save{background:var(--pg-save);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-head{max-width:760px;margin-bottom:clamp(24px,4vw,44px)}
.pg-head .pg-lead{margin-top:14px}
.pg-card p,.pg-step p,.pg-chain__step p,.pg-plan p,.pg-ind p{color:var(--pg-mut);font-size:15px;line-height:1.6;margin:0}
.pg-card .pg-h3+p,.pg-step .pg-h3+p,.pg-chain__step .pg-h3+p{margin-top:8px}

/* ---------- breadcrumbs ---------- */
.pg-crumbs ol{display:flex;flex-wrap:wrap;gap:0 4px;list-style:none;margin:0 0 14px;padding:0;font:500 12.5px/1.4 var(--fm);color:var(--pg-dim)}
.pg-crumbs li{display:inline-flex;align-items:center}
.pg-crumbs li+li::before{content:"/";margin-inline-end:4px;opacity:.5}
.pg-crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--pg-mut)}
.pg-crumbs a:hover{color:var(--pg-fg)}
.pg-crumbs [aria-current]{color:var(--pg-fg);display:inline-flex;align-items:center;min-height:44px}

/* ---------- hero ---------- */
.pg-hero{position:relative;padding-block:clamp(12px,3vw,40px) clamp(40px,6vw,84px);isolation:isolate}
.pg-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:none}
.pg-hero__grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(24px,4vw,64px);align-items:center}
.pg-hero__copy{min-width:0}
.pg-hero__art{min-width:0}
.pg-hero--center .pg-hero__grid{display:block}
.pg-hero--center{padding-block:clamp(40px,7vw,96px) clamp(24px,4vw,48px)}
.pg-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.pg-actions--c{justify-content:center}
.pg-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:18px 0 0;padding:0}
.pg-chips--lg{gap:10px}
.pg-chip{display:inline-flex;align-items:center;font:500 12.5px/1.3 var(--fm);letter-spacing:.04em;color:var(--pg-mut);border:1px solid var(--pg-line);border-radius:999px;padding:8px 14px;background:rgba(255,255,255,.03)}
.pg-chips--lg .pg-chip{font-size:14px;padding:10px 18px}
.pg-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--pg-mint);font-weight:700;font-size:15px}
.pg-link svg,.pg-next__arr{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.pg-link:hover svg{transform:translateX(4px)}
[dir="rtl"] .pg-link svg,[dir="rtl"] .pg-next__arr{transform:scaleX(-1)}
[dir="rtl"] .pg-link:hover svg{transform:scaleX(-1) translateX(4px)}
.pg .btn svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- hero art / svg text ---------- */
.pg-art,.pg-loop,.pg-viz{margin:0}
.pg-art__svg,.pg-loop__svg,.pg-viz__svg{direction:ltr;width:100%;height:auto;max-width:600px;margin-inline:auto}
.pg-art__num{font:700 22px var(--fm);fill:#fff}
.pg-art__num--s{font-size:14px}
.pg-art__tiny{font:500 12px var(--fm);fill:#a9b6c8;letter-spacing:.04em}
.pg-art__ico,.pg-loop__ico{fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pg-loop__card{fill:rgba(0,28,54,.88);stroke:rgba(255,255,255,.2)}
.pg-loop__name{font:700 16px var(--fd);fill:#eef3f8}
.pg-loop__mid{font:700 18px var(--fd);fill:#eef3f8}
.pg-loop__tiny{font:500 11px var(--fm);fill:#a9b6c8;letter-spacing:.04em}
.pg-loop__pin{font:700 13px var(--fd);fill:#fff}
.pg-viz__t{font:600 13px var(--fm);letter-spacing:.02em}
.pg-viz__t--red{fill:#ff6b5b}.pg-viz__t--mint{fill:#14f0a0}.pg-viz__t--yel{fill:#e5ff5a}
.pg-viz__ax{font:500 12px var(--fm);fill:#8393ad}
.pg-viz__cap{font:500 12.5px var(--fm);color:var(--pg-dim);margin-top:10px;text-align:center}

/* ---------- animation ---------- */
@keyframes pgflow{to{stroke-dashoffset:-240}}
@keyframes pgdraw{to{stroke-dashoffset:0}}
@keyframes pgneedle{from{transform:rotate(62deg)}to{transform:rotate(-48deg)}}
@keyframes pgpulse{0%,100%{opacity:.85}50%{opacity:1;transform:scale(1.04)}}
@keyframes pgring{0%{transform:scale(.7);opacity:0}30%{opacity:1}100%{transform:scale(1.15);opacity:0}}
.pg-flow,.pg-flow2{animation:pgflow 12s linear infinite}
.pg-draw{stroke-dasharray:1;stroke-dashoffset:1;animation:pgdraw 1.8s ease .2s forwards}
.pg-draw--2{animation-delay:1.2s}
.pg-needle{transform-origin:240px 230px;animation:pgneedle 2.2s cubic-bezier(.2,.8,.2,1) .3s both}
.pg-pulse{transform-origin:262px 154px;animation:pgpulse 3.6s ease-in-out infinite}
.pg-ring{transform-box:fill-box;transform-origin:center;animation:pgring 4s ease-out infinite}
.pg-ring--2{animation-delay:1.3s}.pg-ring--3{animation-delay:2.6s}
@media (prefers-reduced-motion:reduce){
    .pg-flow,.pg-flow2,.pg-needle,.pg-pulse,.pg-ring{animation:none}
    .pg-draw{animation:none;stroke-dashoffset:0}
    .pg-needle{transform:none}
}

/* ---------- icon chip ---------- */
.pg-ico{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:14px;border:1px solid;--t:var(--pg-orange);color:var(--t);border-color:color-mix(in srgb,var(--t) 38%,transparent);background:color-mix(in srgb,var(--t) 11%,transparent)}
.pg-ico svg{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pg-ico--lg{width:56px;height:56px;border-radius:18px}
.pg-ico--lg svg{width:28px;height:28px}
.pg-ico--heat{--t:var(--pg-red)}
.pg-ico--warm{--t:var(--pg-orange)}
.pg-ico--mint{--t:var(--pg-mint)}
.pg-ico--ice{--t:var(--pg-ice)}
.pg-ico--mute{--t:var(--pg-mut)}

/* ---------- cards ---------- */
.pg-card{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid var(--pg-line);border-radius:var(--pg-rl);padding:clamp(20px,2.6vw,28px);min-width:0}
.pg-tile{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.pg-tile .pg-h3{margin-top:2px}
.pg-card--pic{padding:0;overflow:hidden;display:flex;flex-direction:column}
.pg-card--pic .pg-cmp__stage{border:0;border-radius:0}
.pg-card__txt{padding:clamp(18px,2.2vw,24px)}
.pg-card__txt p{margin-top:8px}
.pg-badge{align-self:flex-start;font:600 11px/1 var(--fm);letter-spacing:.08em;text-transform:uppercase;color:var(--pg-orange);border:1px solid color-mix(in srgb,var(--pg-orange) 45%,transparent);border-radius:999px;padding:6px 10px;white-space:nowrap}
.pg-next{display:flex;align-items:center;gap:16px;transition:border-color .2s,transform .2s}
.pg-next:hover{border-color:rgba(255,255,255,.3);transform:translateY(-2px)}
.pg-next__arr{margin-inline-start:auto;color:var(--pg-mint);width:20px;height:20px}
.pg-callout{display:flex;gap:16px;align-items:flex-start;padding:20px;border:1px solid color-mix(in srgb,var(--pg-mint) 28%,transparent);border-radius:18px;background:color-mix(in srgb,var(--pg-mint) 5%,transparent)}
.pg-callout p{margin:6px 0 0;color:var(--pg-mut);font-size:15px}
.pg-callout--bare{padding:0;border:0;background:none}
.pg-aside .pg-chain,.pg-two .pg-chain{grid-template-columns:minmax(0,1fr)}
.pg-aside .pg-chain__step:not(:last-child)::after,.pg-two .pg-chain__step:not(:last-child)::after{display:none}

/* ---------- ticks ---------- */
.pg-ticks{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.pg-ticks li{display:flex;gap:10px;align-items:flex-start;color:var(--pg-mut);font-size:15px;line-height:1.55}
.pg-ticks svg{width:18px;height:18px;flex:none;margin-top:3px;fill:none;stroke:var(--pg-mint);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pg-ticks--lg li{font-size:16px;color:var(--pg-fg)}
.pg-receive .pg-h3{font-size:clamp(20px,2.2vw,26px)}

/* ---------- KPI strip ---------- */
.pg-band{border-block:1px solid var(--pg-line-soft);background:rgba(255,255,255,.02);padding-block:clamp(22px,3vw,34px)}
.pg-band__h{font:500 12px/1.4 var(--fm);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-dim);margin:0 0 16px;text-align:center}
.pg-kpis{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--pg-line);border-radius:var(--pg-rl);overflow:hidden;background:rgba(0,28,54,.5)}
.pg-kpi{padding:clamp(16px,2.2vw,26px);display:flex;flex-direction:column;gap:6px;border-inline-start:1px solid var(--pg-line-soft)}
.pg-kpi:first-child{border-inline-start:0}
.pg-kpi__v{font:800 clamp(24px,3.2vw,38px)/1.1 var(--fd);background:var(--pg-save);-webkit-background-clip:text;background-clip:text;color:transparent;overflow-wrap:anywhere}
.pg-kpi__l{font-size:14px;color:var(--pg-mut);line-height:1.45}

/* ---------- process: chain & steps ---------- */
.pg-chain,.pg-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.pg-chain__step,.pg-step{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid var(--pg-line);border-radius:var(--pg-rl);padding:clamp(18px,2.2vw,26px);display:flex;flex-direction:column;gap:2px;min-width:0}
.pg-chain__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.pg-chain__n,.pg-step__n{font:500 13px var(--fm);color:var(--pg-dim);letter-spacing:.08em}
.pg-step__n{margin-bottom:10px}
.pg-step .pg-ico{margin-bottom:12px}
.pg-chain__out{margin-top:12px!important;padding-top:12px;border-top:1px dashed var(--pg-line);font-size:13.5px!important;color:var(--pg-fg)!important}
.pg-chain__out b{display:block;font:500 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-mint);margin-bottom:2px}
.pg-chain__step:not(:last-child)::after{content:"";position:absolute;top:46px;inset-inline-start:calc(100% + 1px);width:14px;height:2px;background:linear-gradient(90deg,var(--pg-orange),var(--pg-mint))}
[dir="rtl"] .pg-chain__step:not(:last-child)::after{background:linear-gradient(270deg,var(--pg-orange),var(--pg-mint))}
.pg-chain__step.is-current{border-color:color-mix(in srgb,var(--pg-mint) 60%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--pg-mint) 25%,transparent),0 20px 50px -28px rgba(20,240,160,.5)}
.pg-step{--bar:var(--pg-orange)}
.pg-step::before{content:"";position:absolute;top:-1px;inset-inline:22px;height:3px;border-radius:0 0 3px 3px;background:var(--bar)}
.pg-steps .pg-step:nth-child(2){--bar:var(--pg-yellow)}
.pg-steps .pg-step:nth-child(3){--bar:#a8f06a}
.pg-steps .pg-step:nth-child(4){--bar:var(--pg-mint)}
.pg-card .pg-steps{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}

/* ---------- refrigeration loop ---------- */
.pg-loopwrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(20px,3vw,40px);align-items:start}
.pg-loopwrap__fig{position:sticky;top:calc(var(--cw-nav-h,64px) + 16px)}
.pg-loopcards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pg-loopcard{display:flex;flex-direction:column;gap:10px}
.pg-loopcard__head{display:flex;align-items:center;gap:10px}
.pg-loopcard__head .pg-h3{min-width:0}
.pg-loopcard__role{font:500 13px var(--fm)!important;color:var(--pg-dim)!important;letter-spacing:.02em}
.pg-loopcard__fix{margin-top:auto!important;padding-top:12px;border-top:1px dashed var(--pg-line);color:var(--pg-fg)!important;font-size:14px!important}
.pg-loopcard__fix b{display:block;font:500 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-mint);margin-bottom:2px}
.pg-pin{display:grid;place-items:center;width:26px;height:26px;flex:none;border-radius:50%;background:var(--pg-red);color:#fff;font:700 13px var(--fd)}

/* ---------- waste cards ---------- */
.pg-waste{display:flex;flex-direction:column;gap:14px}
.pg-waste__head{display:flex;align-items:center;gap:12px}
.pg-waste dl{margin:0;display:grid;gap:10px}
.pg-waste dt{font:500 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-dim)}
.pg-waste dd{margin:2px 0 0;color:var(--pg-mut);font-size:14.5px;line-height:1.55}
.pg-waste__impact{margin-top:auto!important;padding-top:12px;border-top:1px dashed var(--pg-line);font-size:14px!important;color:var(--pg-fg)!important}
.pg-waste__impact b{display:block;font:500 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-orange);margin-bottom:2px}

/* ---------- plans ---------- */
.pg-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.pg-plan{position:relative;display:flex;flex-direction:column;gap:14px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid var(--pg-line);border-radius:var(--pg-rl);padding:clamp(22px,2.6vw,30px)}
.pg-plan.is-featured{border-color:color-mix(in srgb,var(--pg-mint) 55%,transparent);box-shadow:0 30px 70px -40px rgba(20,240,160,.5)}
.pg-plan__badge{position:absolute;top:-12px;inset-inline-start:24px;background:var(--pg-mint);color:var(--cw-ink-on-mint,#031a10);font:700 11.5px/1 var(--fm);letter-spacing:.06em;text-transform:uppercase;padding:7px 12px;border-radius:999px}
.pg-plan__head{display:flex;gap:14px;align-items:center}
.pg-plan__blurb{color:var(--pg-fg)!important;font-size:16px!important}
.pg-plan__for{font-size:14px!important}
.pg-plan__for b{color:var(--pg-fg)}
.pg-plan .pg-ticks{margin-top:4px;flex:1}
.pg-plan .btn{margin-top:8px;width:100%}

/* ---------- industries ---------- */
.pg-inds{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.pg-ind{display:flex;flex-direction:column;gap:12px;align-items:flex-start;padding:22px;border:1px solid var(--pg-line);border-radius:var(--pg-rl);background:linear-gradient(180deg,rgba(115,209,255,.07),rgba(255,255,255,.01))}

/* ---------- services index ---------- */
.pg-svc-list{display:grid;gap:clamp(18px,2.4vw,28px)}
.pg-svc{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:center;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));border:1px solid var(--pg-line);border-radius:var(--pg-rl);padding:clamp(18px,2.6vw,34px)}
.pg-svc:nth-child(even) .pg-svc__pic{order:2}
.pg-svc__pic{min-width:0;background:rgba(3,8,16,.7);border:1px solid var(--pg-line-soft);border-radius:var(--pg-r);padding:clamp(10px,1.6vw,18px)}
.pg-svc__pic .pg-cmp__stage{border-radius:12px}
.pg-svc__body{min-width:0}
.pg-svc__top{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.pg-svc__tag{margin:0;color:var(--pg-orange)}
.pg-svc__body .pg-lead{margin-top:12px}

/* ---------- compare (forced LTR; physical props intended) ---------- */
.pg-cmp{margin:0;position:relative;min-width:0}
.pg-cmp__stage{position:relative;--pos:50%;aspect-ratio:1077/720;border:1px solid var(--pg-line);border-radius:var(--pg-r);overflow:hidden;background:#001f3b}
.pg-cmp__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pg-cmp__img--top{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.pg-cmp__range{position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}
.pg-cmp__bar{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.6);pointer-events:none;z-index:2}
.pg-cmp__knob{position:absolute;top:50%;left:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:rgba(1,37,71,.82);border:2px solid #fff;display:grid;place-items:center;transition:box-shadow .2s}
.pg-cmp__knob svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pg-cmp__range:focus-visible~.pg-cmp__bar .pg-cmp__knob{box-shadow:0 0 0 3px #14f0a0}
.pg-cmp__tag{position:absolute;bottom:10px;z-index:2;font:600 11px/1 var(--fm);letter-spacing:.06em;color:#fff;background:rgba(1,37,71,.8);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:6px 10px;pointer-events:none}
.pg-cmp__tag--l{left:10px}.pg-cmp__tag--r{right:10px}
.pg-cmp__cap{font:500 12.5px var(--fm);color:var(--pg-dim);margin-top:10px;text-align:center}

/* ---------- before/after bars ---------- */
.pg-bars{display:grid;gap:4px;padding:clamp(18px,2.4vw,28px);border:1px solid var(--pg-line);border-radius:var(--pg-rl);background:rgba(0,28,54,.55)}
.pg-bars__key{display:flex;gap:8px;align-items:center;font:500 12px var(--fm);color:var(--pg-mut);margin-bottom:12px}
.pg-bars__key i{width:10px;height:10px;border-radius:3px;display:inline-block}
.pg-bars__key i+*{}
.pg-bars__key .k-b{background:var(--pg-orange)}
.pg-bars__key .k-a{background:var(--pg-mint);margin-inline-start:12px}
.pg-bar{display:grid;gap:5px;margin-bottom:16px}
.pg-bar__l{font-size:14.5px;font-weight:600;color:var(--pg-fg)}
.pg-bar__track{height:12px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.pg-bar__track i{display:block;height:100%;border-radius:inherit}
.pg-bar__b{background:linear-gradient(90deg,var(--pg-orange),var(--pg-red))}
.pg-bar__a{background:linear-gradient(90deg,var(--pg-yellow),var(--pg-mint))}
.pg-bar__v{font:500 13px var(--fm);color:var(--pg-mut)}
.pg-bar__v b{color:var(--pg-mint)}
.pg-bars .pg-note{margin-top:4px}
.pg-js .pg-bars:not(.is-in) .pg-bar__track i,.pg-js .pg-case__bars:not(.is-in) .pg-bar__track i,.pg-js .pg-split:not(.is-in) .pg-split__seg{transform:scaleX(0)}
.pg-bar__track i,.pg-split__seg{transform-origin:left center;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
[dir="rtl"] .pg-bar__track i,[dir="rtl"] .pg-split__seg{transform-origin:right center}
@media (prefers-reduced-motion:reduce){.pg-bar__track i,.pg-split__seg{transition:none}.pg-js .pg-bars:not(.is-in) .pg-bar__track i,.pg-js .pg-case__bars:not(.is-in) .pg-bar__track i,.pg-js .pg-split:not(.is-in) .pg-split__seg{transform:none}}

/* energy split */
.pg-split{display:flex;gap:3px;height:52px;border-radius:14px;overflow:hidden}
.pg-split__seg{display:grid;place-items:center;flex:0 1 auto;font:700 13px var(--fm);color:#012547;min-width:0}
.pg-split--red{background:#ff4a3d}.pg-split--orange{background:#ff8a2e}.pg-split--yellow{background:#d4f01a}.pg-split--ice{background:#73d1ff}.pg-split--mute{background:#8393ad}
.pg-split__key{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;color:var(--pg-mut)}
.pg-split__key li{display:flex;align-items:center;gap:8px}
.pg-split__key i{width:12px;height:12px;border-radius:4px;flex:none}
.pg-split__key b{color:var(--pg-fg);font-family:var(--fm);font-weight:500}

/* ---------- strips (starts per hour) ---------- */
.pg-strip{display:grid;gap:6px;margin-bottom:14px}
.pg-strip svg{width:100%;height:40px;display:block}
.pg-strip__l{display:flex;justify-content:space-between;align-items:baseline;margin:0;font:600 13px var(--fm)}
.pg-strip__l--bad{color:#ff9a4d}.pg-strip__l--good{color:#14f0a0}
.pg-strip__l b{font-size:20px}
.pg-strip__axis{display:flex;justify-content:space-between;font:500 11.5px var(--fm);color:var(--pg-dim)}
.pg-viz--starts{padding:clamp(16px,2vw,24px);border:1px solid var(--pg-line);border-radius:var(--pg-rl);background:rgba(0,28,54,.55)}

/* ---------- story chapters ---------- */
.pg-story{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pg-chap{display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid var(--pg-line);border-radius:var(--pg-rl);overflow:hidden;min-width:0}
.pg-chap__pic{background:#001f3b;border-bottom:1px solid var(--pg-line-soft);display:grid;align-items:center}
.pg-chap__pic .pg-cmp__stage{border:0;border-radius:0}
.pg-scene{width:100%;aspect-ratio:1077/720;height:auto}
.pg-chap__txt{padding:clamp(18px,2.2vw,24px);display:flex;flex-direction:column;gap:6px;flex:1}
.pg-chap__txt p{color:var(--pg-mut);font-size:15px;margin:0}
.pg-chap__n{font:500 13px var(--fm);letter-spacing:.1em;color:var(--pg-mint)}
.pg-chap--wide{grid-column:1/-1;flex-direction:row;align-items:stretch}
.pg-chap--wide .pg-chap__pic{flex:0 0 min(42%,440px);border-bottom:0;border-inline-end:1px solid var(--pg-line-soft)}
.pg-chap--wide .pg-chap__txt{justify-content:center}

/* ---------- results cases ---------- */
.pg-case{display:flex;flex-direction:column;gap:16px}
.pg-case__top{display:flex;gap:14px;align-items:center}
.pg-case__top>div{min-width:0}
.pg-case__res{display:flex;flex-direction:column;gap:0}
.pg-case__big{font:800 clamp(44px,5vw,60px)/1 var(--fd);background:var(--pg-save);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-case__res span{color:var(--pg-mut);font-size:15px;margin-top:4px}
.pg-case__bars{display:grid;gap:8px}
.pg-case__row{display:grid;grid-template-columns:64px minmax(0,1fr) 34px;gap:10px;align-items:center;font:500 12.5px var(--fm);color:var(--pg-mut)}
.pg-case__row b{color:var(--pg-fg);text-align:end}
.pg-case__dl{margin:0;display:grid;gap:12px}
.pg-case__dl dt{font:500 11px var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-dim)}
.pg-case__dl dd{margin:2px 0 0;color:var(--pg-mut);font-size:14.5px;line-height:1.55}
.pg-case__extra{margin-top:auto!important;padding-top:12px;border-top:1px dashed var(--pg-line);font-size:14px!important;color:var(--pg-mint)!important}

/* ---------- verification timeline ---------- */
.pg-tl{display:grid;grid-template-columns:2fr 1fr 2fr 1.3fr;gap:4px}
.pg-tl__seg{padding:16px 14px;text-align:center;font:600 13.5px/1.3 var(--fm);border:1px solid;border-radius:12px}
.pg-tl__seg--a,.pg-tl__seg--c{color:var(--pg-ice);border-color:color-mix(in srgb,var(--pg-ice) 40%,transparent);background:color-mix(in srgb,var(--pg-ice) 9%,transparent)}
.pg-tl__seg--b{color:var(--pg-orange);border-color:color-mix(in srgb,var(--pg-orange) 45%,transparent);background:color-mix(in srgb,var(--pg-orange) 10%,transparent)}
.pg-tl__seg--d{color:var(--pg-mint);border-color:color-mix(in srgb,var(--pg-mint) 50%,transparent);background:color-mix(in srgb,var(--pg-mint) 10%,transparent)}

/* ---------- severity ---------- */
.pg-sev{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pg-sev__item{--t:var(--pg-mint);position:relative;border:1px solid color-mix(in srgb,var(--t) 40%,transparent);border-radius:var(--pg-rl);padding:22px;background:color-mix(in srgb,var(--t) 6%,transparent)}
.pg-sev__item::before{content:"";position:absolute;top:-1px;inset-inline:22px;height:3px;border-radius:0 0 3px 3px;background:var(--t)}
.pg-sev--red{--t:var(--pg-red)}.pg-sev--orange{--t:var(--pg-orange)}.pg-sev--mint{--t:var(--pg-mint)}
.pg-sev__dot{display:block;width:12px;height:12px;border-radius:50%;background:var(--t);box-shadow:0 0 14px var(--t);margin-bottom:12px}
.pg-sev__item p{margin:8px 0 0;color:var(--pg-mut);font-size:15px}

/* ---------- payback ---------- */
.pg-payback{display:flex;align-items:center;gap:16px;margin-top:22px}
.pg-payback div{display:grid;gap:2px}
.pg-payback b{font:800 clamp(24px,3vw,32px)/1.1 var(--fd);color:var(--pg-mint)}

/* ---------- FAQ ---------- */
.pg-faq{display:grid;gap:10px}
.pg-faq__item{border:1px solid var(--pg-line);border-radius:var(--pg-r);background:rgba(255,255,255,.03);transition:border-color .2s,background .2s}
.pg-faq__item[open]{border-color:color-mix(in srgb,var(--pg-mint) 40%,transparent);background:rgba(20,240,160,.04)}
.pg-faq__item summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 20px;cursor:pointer;list-style:none;font:700 16px/1.4 var(--fd);border-radius:var(--pg-r)}
.pg-faq__item summary::-webkit-details-marker{display:none}
.pg-faq__item summary:hover{background:rgba(255,255,255,.04)}
.pg-faq__plus{position:relative;width:20px;height:20px;flex:none}
.pg-faq__plus::before,.pg-faq__plus::after{content:"";position:absolute;inset-block-start:9px;inset-inline-start:2px;width:16px;height:2px;border-radius:2px;background:var(--pg-mint);transition:transform .25s}
.pg-faq__plus::after{transform:rotate(90deg)}
.pg-faq__item[open] .pg-faq__plus::after{transform:rotate(0)}
.pg-faq__a{padding:0 20px 20px}
.pg-faq__a p{margin:0;color:var(--pg-mut);font-size:15.5px;line-height:1.7;max-width:70ch}

/* ---------- CTA band ---------- */
.pg-cta-sec{padding-block:clamp(40px,6vw,80px)}
.pg-cta{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(24px,4vw,52px);border:1px solid color-mix(in srgb,var(--pg-mint) 30%,transparent);border-radius:var(--cw-radius-xl,28px);background:radial-gradient(70% 120% at 100% 0%,rgba(20,240,160,.1),transparent 60%),linear-gradient(180deg,rgba(4,52,94,.72),rgba(1,28,54,.92))}
.pg-cta__act{display:grid;gap:12px}
.pg-cta__act .btn{width:100%}
.pg-cta .pg-h2{margin-bottom:0}

/* ---------- contact ---------- */
.pg-contact{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(20px,3vw,40px);align-items:start}
.pg-contact__side{display:grid;gap:16px}
.pg-lines{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:14px}
.pg-lines li{display:flex;align-items:center;gap:14px}
.pg-lines__t{flex:1;min-width:0;display:grid;gap:2px}
.pg-lines__t a{display:inline-flex;align-items:center;min-height:44px;font:700 17px/1.3 var(--fd);color:var(--pg-fg);overflow-wrap:anywhere}
.pg-lines__t a:hover{color:var(--pg-mint)}
.pg-copy{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding:0 14px;border-radius:999px;border:1px solid var(--pg-line);background:rgba(255,255,255,.06);color:var(--pg-fg);font:600 13px var(--fb);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.pg-copy svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pg-copy:hover{background:rgba(255,255,255,.14)}
.pg-copy.is-done{border-color:var(--pg-mint);color:var(--pg-mint)}
.pg-card .pg-chips{margin-top:14px}
.pg-formcard{padding:clamp(22px,3vw,40px);border:1px solid color-mix(in srgb,var(--pg-mint) 30%,transparent);border-radius:var(--cw-radius-xl,28px);background:linear-gradient(180deg,rgba(10,26,51,.7),rgba(5,10,20,.85));scroll-margin-top:calc(var(--cw-nav-h,64px) + 16px)}
.pg-formcard .pg-lead{margin-bottom:24px}

/* ---------- thanks ---------- */
.pg-thanks{max-width:720px;margin-inline:auto;text-align:center}
.pg-thanks .pg-lead{margin-inline:auto}
.pg-checkart{width:112px;height:112px;margin:0 auto 22px}

/* ---------- widths used by bars and the split (no inline styles) ---------- */
.pg-w-0{width:0%}.pg-w-1{width:1%}.pg-w-2{width:2%}.pg-w-3{width:3%}.pg-w-4{width:4%}.pg-w-5{width:5%}.pg-w-6{width:6%}.pg-w-7{width:7%}.pg-w-8{width:8%}.pg-w-9{width:9%}.pg-w-10{width:10%}.pg-w-11{width:11%}.pg-w-12{width:12%}.pg-w-13{width:13%}.pg-w-14{width:14%}.pg-w-15{width:15%}.pg-w-16{width:16%}.pg-w-17{width:17%}.pg-w-18{width:18%}.pg-w-19{width:19%}.pg-w-20{width:20%}.pg-w-21{width:21%}.pg-w-22{width:22%}.pg-w-23{width:23%}.pg-w-24{width:24%}.pg-w-25{width:25%}.pg-w-26{width:26%}.pg-w-27{width:27%}.pg-w-28{width:28%}.pg-w-29{width:29%}.pg-w-30{width:30%}.pg-w-31{width:31%}.pg-w-32{width:32%}.pg-w-33{width:33%}.pg-w-34{width:34%}.pg-w-35{width:35%}.pg-w-36{width:36%}.pg-w-37{width:37%}.pg-w-38{width:38%}.pg-w-39{width:39%}.pg-w-40{width:40%}.pg-w-41{width:41%}.pg-w-42{width:42%}.pg-w-43{width:43%}.pg-w-44{width:44%}.pg-w-45{width:45%}.pg-w-46{width:46%}.pg-w-47{width:47%}.pg-w-48{width:48%}.pg-w-49{width:49%}.pg-w-50{width:50%}.pg-w-51{width:51%}.pg-w-52{width:52%}.pg-w-53{width:53%}.pg-w-54{width:54%}.pg-w-55{width:55%}.pg-w-56{width:56%}.pg-w-57{width:57%}.pg-w-58{width:58%}.pg-w-59{width:59%}.pg-w-60{width:60%}.pg-w-61{width:61%}.pg-w-62{width:62%}.pg-w-63{width:63%}.pg-w-64{width:64%}.pg-w-65{width:65%}.pg-w-66{width:66%}.pg-w-67{width:67%}.pg-w-68{width:68%}.pg-w-69{width:69%}.pg-w-70{width:70%}.pg-w-71{width:71%}.pg-w-72{width:72%}.pg-w-73{width:73%}.pg-w-74{width:74%}.pg-w-75{width:75%}.pg-w-76{width:76%}.pg-w-77{width:77%}.pg-w-78{width:78%}.pg-w-79{width:79%}.pg-w-80{width:80%}.pg-w-81{width:81%}.pg-w-82{width:82%}.pg-w-83{width:83%}.pg-w-84{width:84%}.pg-w-85{width:85%}.pg-w-86{width:86%}.pg-w-87{width:87%}.pg-w-88{width:88%}.pg-w-89{width:89%}.pg-w-90{width:90%}.pg-w-91{width:91%}.pg-w-92{width:92%}.pg-w-93{width:93%}.pg-w-94{width:94%}.pg-w-95{width:95%}.pg-w-96{width:96%}.pg-w-97{width:97%}.pg-w-98{width:98%}.pg-w-99{width:99%}.pg-w-100{width:100%}

/* ---------- JS-less safety: bars are fully drawn unless pages.js marks the page .pg-js ---------- */

/* ==================== responsive ==================== */
@media (max-width:1100px){
    .pg-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pg-chain,.pg-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pg-chain__step:not(:last-child)::after{display:none}
    .pg-inds{grid-template-columns:repeat(3,minmax(0,1fr))}
    .pg-plans{grid-template-columns:1fr;max-width:640px;margin-inline:auto}
    .pg-story{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
    .pg-hero__grid,.pg-two,.pg-svc,.pg-cta,.pg-contact,.pg-loopwrap{grid-template-columns:minmax(0,1fr)}
    .pg-svc:nth-child(even) .pg-svc__pic{order:0}
    .pg-hero__art{max-width:560px;width:100%;margin-inline:auto}
    .pg-loopwrap__fig{position:static}
    .pg-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pg-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pg-kpi:nth-child(odd){border-inline-start:0}
    .pg-kpi:nth-child(n+3){border-top:1px solid var(--pg-line-soft)}
    .pg-sev{grid-template-columns:1fr}
    .pg-chap--wide{flex-direction:column}
    .pg-chap--wide .pg-chap__pic{flex:none;border-inline-end:0;border-bottom:1px solid var(--pg-line-soft)}
}
@media (max-width:680px){
    .pg-grid--2,.pg-grid--3,.pg-grid--4,.pg-story,.pg-chain,.pg-steps,.pg-loopcards{grid-template-columns:minmax(0,1fr)}
    .pg-card .pg-steps{grid-template-columns:minmax(0,1fr)}
    .pg-inds{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pg-tl{grid-template-columns:minmax(0,1fr)}
    .pg-actions .btn,.pg-cta__act .btn{width:100%}
    .pg-lines li{flex-wrap:wrap}
    .pg-lines__t{flex-basis:calc(100% - 70px)}
    .pg-copy{margin-inline-start:58px}
    .pg-split{height:44px}
    .pg-case__row{grid-template-columns:56px minmax(0,1fr) 30px}
}
@media (max-width:400px){
    .pg-inds{grid-template-columns:minmax(0,1fr)}
    .pg-kpi__v{font-size:22px}
}

/* stacked three-part headline (services): one phrase per line, no full stops */
.pg-h1--stack>span{display:block}

/* ==========================================================================
   Design pass 2: one surface system, a full-screen hero, balanced boxes
   ========================================================================== */
.pg{--pg-surface:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.018));--pg-edge:rgba(255,255,255,.12);--pg-cr:20px;--pg-cp:clamp(20px,2.4vw,28px)}

/* hero fills the first screen; the rest of the page starts below the fold */
.pg-hero,.pg-hero--center{min-height:calc(100svh - var(--cw-nav-h,64px));display:flex;flex-direction:column;justify-content:center;padding-block:clamp(16px,3vw,40px) clamp(28px,4vw,56px)}
.pg-hero__grid{align-items:center}
.pg-hero__art .pg-loop__svg,.pg-hero__art .pg-art__svg{max-width:560px}
.pg-loop__card{fill:rgba(0,30,58,.92);stroke:rgba(255,255,255,.16)}
.pg-loop__name{font-size:15px}

/* every box: same radius, edge, surface, depth */
.pg-card,.pg-chain__step,.pg-step,.pg-plan,.pg-ind,.pg-chap,.pg-svc,.pg-sev__item,.pg-faq__item,.pg-bars,.pg-viz--starts{border-radius:var(--pg-cr)}
.pg-card,.pg-chain__step,.pg-step,.pg-plan,.pg-ind,.pg-chap,.pg-svc{background:var(--pg-surface);border:1px solid var(--pg-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 22px 44px -34px rgba(0,0,0,.7)}
.pg-card,.pg-chain__step,.pg-step,.pg-plan,.pg-ind{padding:var(--pg-cp)}
.pg-card--pic{padding:0}

/* equal heights in every grid, with the footer line pinned to the bottom */
.pg-grid,.pg-chain,.pg-steps,.pg-plans,.pg-inds,.pg-story,.pg-loopcards,.pg-sev{align-items:stretch}
.pg-grid>.pg-card,.pg-chain__step,.pg-step,.pg-ind,.pg-loopcard,.pg-chap,.pg-sev__item{display:flex;flex-direction:column;height:100%}
.pg-chain__out,.pg-loopcard__fix,.pg-waste__impact,.pg-case__extra{margin-top:auto!important}
.pg-chain__step p:not(.pg-chain__out),.pg-loopcard p:not(.pg-loopcard__fix){margin-bottom:14px}
.pg-chain__top{margin-bottom:16px}
.pg-tile{gap:14px}
.pg-tile p{margin-top:0}
.pg-ind{gap:14px;align-items:flex-start}
.pg-ind p{font-size:14.5px}
.pg-card p,.pg-step p,.pg-chain__step p,.pg-plan p,.pg-ind p{line-height:1.6}

/* services list: picture and text share the row evenly, no box inside a box */
.pg-svc{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;padding:clamp(18px,2.4vw,28px);gap:clamp(22px,3.2vw,48px)}
.pg-svc__pic{background:rgba(0,18,36,.55);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:0;overflow:hidden;aspect-ratio:958/720;display:grid;place-items:center}
.pg-svc__pic>.pg-cmp,.pg-svc__pic>.pg-cmp .pg-cmp__stage{width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0}
.pg-svc__pic>.pg-viz,.pg-svc__pic>figure:not(.pg-cmp){width:100%;padding:clamp(14px,2vw,26px)}
.pg-svc__pic .pg-viz__svg{max-width:none}
.pg-svc__body{padding-block:6px}

/* real / thermal pictures: cleaned 4:3 frames, softer chrome */
.pg-cmp__stage{aspect-ratio:958/720;border-color:rgba(255,255,255,.1)}
.pg-scene{aspect-ratio:958/720}
.pg-cmp__tag{bottom:12px;font-size:11.5px;padding:7px 12px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.pg-cmp__tag--l{left:12px}.pg-cmp__tag--r{right:12px}
.pg-chap__pic{aspect-ratio:958/720;overflow:hidden}
.pg-chap__pic>*{width:100%;height:100%}

/* hover lift only on boxes that are links */
a.pg-card,.pg-next{transition:transform .2s,border-color .2s}
a.pg-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.24)}

@media (max-width:900px){
  .pg-svc{grid-template-columns:1fr}
  .pg-svc:nth-child(even) .pg-svc__pic{order:0}
  .pg-hero,.pg-hero--center{min-height:auto;padding-block:16px 40px}
}
@media (max-width:1100px) and (min-width:901px){
  .pg-inds{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.pg-svc__pic:has(>.pg-viz){background:none;border:0;aspect-ratio:auto}
.pg-svc__pic:has(>.pg-viz)>.pg-viz{padding:0}
.pg-chap--wide{flex-direction:row;height:auto}
.pg-chap--wide .pg-chap__pic{aspect-ratio:auto;min-height:220px}
@media (max-width:900px){.pg-chap--wide{flex-direction:column}.pg-chap--wide .pg-chap__pic{aspect-ratio:958/720;flex-basis:auto;border-inline-end:0;border-bottom:1px solid var(--pg-line-soft)}}

/* Admin-managed stages: photo visual + generic detail page */
.pg-svc__pic>.pg-svc__img{width:100%;height:100%;object-fit:cover;display:block}
.pg-hero__art>.pg-stage-img{width:100%;aspect-ratio:16/10;max-width:100%;object-fit:cover;border-radius:18px;border:1px solid rgba(255,255,255,.1);display:block}
.pg-prose{max-width:72ch;font-size:1.0625rem;line-height:1.75;color:var(--pg-fg,#eef3f8)}
.pg-prose>*+*{margin-top:1em}
.pg-prose h2{font-family:var(--fd);font-weight:800;font-size:clamp(1.3rem,2.2vw,1.65rem);line-height:1.25;margin-top:1.8em}
.pg-prose p{margin-bottom:0}
.pg-prose ul{padding-inline-start:1.2em;margin-bottom:0}
.pg-prose li+li{margin-top:.4em}
.pg-prose li::marker{color:var(--cw-mint,#14f0a0)}

/* ==========================================================================
   Bigger first screen on inner pages + scroll cue
   ========================================================================== */
.pg-hero .pg-h1{font-size:clamp(36px,5.4vw,96px);line-height:1.02}
[dir="rtl"] .pg-hero .pg-h1{font-size:clamp(32px,4.6vw,80px);line-height:1.25}
.pg-hero .pg-lead{font-size:clamp(16px,1.2vw,21px);max-width:54ch;margin-top:22px}
.pg-hero .pg-eyebrow{font-size:clamp(12px,.8vw,14px)}
@media (min-width:901px){.pg-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,5vw,96px)}.pg-hero__art{display:flex;justify-content:center}}
.pg-hero__art>*{width:100%}
.pg-hero__art .pg-loop__svg,.pg-hero__art .pg-art__svg{max-width:min(760px,100%);width:100%}
.pg-hero__art .pg-cmp,.pg-hero__art .pg-viz{max-width:min(760px,100%);margin-inline:auto}
@media (min-width:1500px){.pg-hero .btn--lg{min-height:58px;padding-inline:30px;font-size:16px}}
@media (min-height:900px) and (min-width:1100px){.pg-hero{padding-block:clamp(24px,4vh,60px)}}

/* scroll cue at the foot of the hero (added by pages.js, hidden after the first scroll) */
.pg-hero{position:relative}
.pg-cue{position:absolute;left:50%;bottom:clamp(12px,3vh,32px);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:6px 10px;border:0;background:none;cursor:pointer;color:var(--pg-dim,#8393ad);font:500 11px/1 var(--fm);letter-spacing:.22em;text-transform:uppercase;
  transition:opacity .4s ease,transform .4s ease;z-index:2}
.pg-cue:hover,.pg-cue:focus-visible{color:var(--pg-fg,#eef3f8)}
.pg-cue__mouse{position:relative;width:24px;height:38px;border:1.5px solid currentColor;border-radius:14px;opacity:.85}
.pg-cue__mouse::after{content:"";position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--cw-mint,#14f0a0);animation:pgCue 1.8s cubic-bezier(.6,0,.4,1) infinite}
@keyframes pgCue{0%{transform:translateY(0);opacity:0}20%{opacity:1}80%{transform:translateY(12px);opacity:0}100%{opacity:0}}
.pg-cue.is-gone{opacity:0;transform:translate(-50%,10px);pointer-events:none}
@media (max-width:820px){.pg-cue{display:none}}
@media (max-height:640px){.pg-cue{display:none}}
@media (prefers-reduced-motion:reduce){.pg-cue__mouse::after{animation:none;opacity:1}}

/* Hero illustrations v3: their styles live in resources/views/pages/parts/art-styles.blade.php (inline, so a
   stale or cached stylesheet can never leave the drawings with black text) */

/* ---------- contact v2: both columns end on the same line, "what happens next" runs full width ---------- */
@media (min-width:901px){
    .pg-contact{align-items:stretch}
    .pg-contact__side{display:flex;flex-direction:column;gap:16px}
    .pg-contact__side>.pg-card:last-child{flex:1 1 auto}
    .pg-contact__main{display:flex;flex-direction:column}
    .pg-contact__main>.pg-formcard{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center}
}
.pg-contact__next .pg-steps{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:18px}
@media (max-width:1100px){.pg-contact__next .pg-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.pg-contact__next .pg-steps{grid-template-columns:minmax(0,1fr)}}

/* ---------- four-stage chain beside text (about, each service): a 2 x 2 grid read like a Z
   01 -> 02 on the first row, an elbow from 02 down and back to 03, then 03 -> 04 ---------- */
@media (min-width:681px){
    .pg-aside .pg-chain,.pg-two .pg-chain{--cg:30px;--rg:40px;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--cg);row-gap:var(--rg)}
    .pg-two .pg-chain__step,.pg-aside .pg-chain__step{overflow:visible}
    /* 01 -> 02 and 03 -> 04: arrow across the column gap, level with the icons */
    .pg-two .pg-chain__step:nth-child(odd)::after,.pg-aside .pg-chain__step:nth-child(odd)::after{display:block;content:"";position:absolute;top:calc(var(--pg-cp,22px) + 12px);inset-inline-start:100%;width:var(--cg);height:20px;background:none;
        background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 20'%3E%3Cpath d='M4 10h19' stroke='%2314f0a0' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M18 5l6 5-6 5' fill='none' stroke='%2314f0a0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-repeat:no-repeat;background-position:center;background-size:100% 100%}
    [dir="rtl"] .pg-two .pg-chain__step:nth-child(odd)::after,[dir="rtl"] .pg-aside .pg-chain__step:nth-child(odd)::after{transform:scaleX(-1)}
    .pg-two .pg-chain__step:nth-child(even)::after,.pg-aside .pg-chain__step:nth-child(even)::after{display:none}
    /* 02 -> 03: down from the middle of 02, back across the row gap, down into the middle of 03 */
    .pg-two .pg-chain__step:nth-child(2)::before,.pg-aside .pg-chain__step:nth-child(2)::before{content:"";position:absolute;top:100%;inset-inline-end:50%;width:calc(100% + var(--cg));height:calc(var(--rg) / 2 + 1px);
        border-inline-end:2px dashed color-mix(in srgb,var(--pg-mint) 70%,transparent);border-bottom:2px dashed color-mix(in srgb,var(--pg-mint) 70%,transparent);border-end-end-radius:12px;pointer-events:none}
    .pg-two .pg-chain__step:nth-child(3)::before,.pg-aside .pg-chain__step:nth-child(3)::before{content:"";position:absolute;bottom:100%;inset-inline-start:calc(50% - 9px);width:20px;height:calc(var(--rg) / 2 + 1px);pointer-events:none;
        background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 21' preserveAspectRatio='none'%3E%3Cpath d='M10 0v14' stroke='%2314f0a0' stroke-opacity='.7' stroke-width='2' stroke-dasharray='4 3'/%3E%3Cpath d='M5 13l5 6 5-6' fill='none' stroke='%2314f0a0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-repeat:no-repeat;background-size:100% 100%}
    /* compact cards so the 2 x 2 block stays shorter than the text beside it */
    .pg-two .pg-chain__step,.pg-aside .pg-chain__step{padding:clamp(18px,1.6vw,24px)}
    .pg-two .pg-chain__top,.pg-aside .pg-chain__top{margin-bottom:12px}
    .pg-two .pg-chain__step p,.pg-aside .pg-chain__step p{font-size:14.5px;line-height:1.55}
    .pg-two .pg-chain__step p:not(.pg-chain__out),.pg-aside .pg-chain__step p:not(.pg-chain__out){margin-bottom:10px}
    .pg-two .pg-chain__step:nth-child(odd)::after,.pg-aside .pg-chain__step:nth-child(odd)::after{top:calc(clamp(18px,1.6vw,24px) + 8px)}
    /* the step number reads as an order badge */
    .pg-two .pg-chain__n,.pg-aside .pg-chain__n{display:inline-grid;place-items:center;min-width:40px;height:28px;padding:0 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--pg-mint) 45%,transparent);background:color-mix(in srgb,var(--pg-mint) 10%,transparent);color:var(--pg-mint);font-weight:600;letter-spacing:.06em}
}

/* ---------- page sections: a block continuing the one above, blocks added in the admin ---------- */
.pg-sec--cont{padding-top:0}
.pg-cb{--cb:var(--pg-mint)}
.pg-cb--ice{--cb:var(--pg-ice)}.pg-cb--warm{--cb:var(--pg-orange)}.pg-cb--heat{--cb:var(--pg-red)}.pg-cb--mint{--cb:var(--pg-mint)}
.pg-cb__text{max-width:760px}
.pg-cb__copy{min-width:0}
.pg-cb__body{display:grid;gap:14px;margin-top:14px;color:var(--pg-mut);font-size:clamp(15px,1.1vw,17px);line-height:1.7}
.pg-cb__body p{margin:0}
.pg-cb__body .pg-h3{color:var(--pg-fg);margin:6px 0 -6px}
.pg-cb__list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pg-cb__list li{position:relative;padding-inline-start:26px}
.pg-cb__list li::before{content:"";position:absolute;inset-inline-start:2px;top:.62em;width:10px;height:10px;border-radius:3px;background:var(--cb);box-shadow:0 0 12px color-mix(in srgb,var(--cb) 60%,transparent)}
.pg-cb__act{margin-top:24px}
.pg-cb__act .btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
[dir="rtl"] .pg-cb__act .btn svg{transform:scaleX(-1)}
.pg-cb__pic{margin:0;border-radius:var(--pg-cr,22px);overflow:hidden;border:1px solid var(--pg-edge,rgba(255,255,255,.1));background:#001f3b;box-shadow:0 30px 60px -40px rgba(0,0,0,.8)}
.pg-cb__pic img{display:block;width:100%;height:auto;max-height:560px;object-fit:cover}
.pg-cb__pic--wide{margin-top:clamp(22px,3vw,36px)}
.pg-cb__card{position:relative;overflow:hidden}
.pg-cb__card::before{content:"";position:absolute;top:-1px;inset-inline:22px;height:3px;border-radius:0 0 3px 3px;background:var(--cb)}
.pg-cb__n{font:600 12.5px var(--fm);letter-spacing:.1em;color:var(--cb);margin-bottom:10px}
.pg-cb__cta{border-color:color-mix(in srgb,var(--cb) 40%,transparent);background:radial-gradient(70% 120% at 100% 0%,color-mix(in srgb,var(--cb) 14%,transparent),transparent 60%),linear-gradient(180deg,rgba(4,52,94,.72),rgba(1,28,54,.92))}
@media (max-width:900px){.pg-cb__cta{grid-template-columns:minmax(0,1fr)}.pg-cb__cta .btn{width:100%}}

/* ---------- drawings wait until they are on screen (html.io is set in <head>, pages.js adds .is-in / .is-off) ---------- */
html.io :is(.pg-art,.pg-viz,.pg-loop,.pg-scene,.pg-checkart,[data-io]):not(.is-in),
html.io :is(.pg-art,.pg-viz,.pg-loop,.pg-scene,.pg-checkart,[data-io]):not(.is-in) *,
html.io .is-off,html.io .is-off *{animation-play-state:paused!important}
.pg-fade{animation:pgfade 1.1s ease .9s both}
@keyframes pgfade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.pg-fade{animation:none}}
.pg-pic{display:contents}
/* ---------- speed: blocks far below the screen are not laid out or painted until the visitor nears them
   (browsers without content-visibility simply ignore this). "auto" remembers each block's real height,
   so the scrollbar does not jump. Sticky pictures (loop figure) keep working inside their own block. ---------- */
@supports (content-visibility:auto){
    .pg-sec:not(.pg-cta-sec),.pg-band{content-visibility:auto;contain-intrinsic-size:auto 760px}
    .footer{content-visibility:auto;contain-intrinsic-size:auto 520px}
}