
:root{
  --cherry:#BE1E2D; --cherry-deep:#8E1522; --cherry-soft:#F8E6E8; --cherry-ink:#A81A28;
  --ink:#1B1416; --ink-2:#4A3F42; --muted:#7A6E71;
  --bg:#FAF8F7; --surface:#FFFFFF; --field:#F3EEED; --line:#E6DEDD; --line-2:#D5CBCA;
  --hero:#1B1416; --hero-2:#2A1E21; --hero-text:#FBF4F3; --hero-muted:#B9A9AC;
  --shadow:0 1px 2px rgba(27,20,22,.06),0 12px 32px -12px rgba(27,20,22,.18);
  --shadow-lift:0 2px 4px rgba(27,20,22,.08),0 24px 48px -16px rgba(190,30,45,.28);
  /* ---- PHOTOGRAPHY (swap for licensed, locally hosted images before launch) ----
     One token per topic; every section/tile pulls from these so the whole page re-skins from here. */
  --ph-refinery:url("../images/photos/refinery.jpg");   /* hero: refinery / process plant */
  --ph-piping:url("../images/photos/piping.jpg");     /* engineering: plant piping, exchangers */
  --ph-flare:url("../images/photos/flare.jpg");      /* process safety: petrochemical plant, flare */
  --ph-controlroom:url("../images/photos/control-room.jpg");/* control & optimisation: control room / DCS */
  --ph-operator:url("../images/photos/field-operator.jpg");   /* training / engage: field operator */
  --ph-plantwide:url("../images/photos/plant-panorama.jpg");  /* catalogue backdrop: plant panorama */
  --ph-opscreens:url("../images/photos/operator-screens.jpg");
  --ph-pidctrl:url("../images/photos/pid-controller.jpg");    /* CeraPID: process controller gauges */
  --ph-logbook:url("../images/photos/operator-logbook.jpg");   /* CeraShift: operator with logbook among process equipment */
  --ph-round:url("../images/photos/operator-round.jpg");        /* CeraShift detail: field operator at a petrochemical plant */
  --ph-compressor:url("../images/photos/gas-compressor.jpg"); /* Kairos: gas compressor */ /* technology: control-room operator screens with process graphics */
  --ph-overlay:rgba(250,248,247,.90);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --cherry:#E0454F; --cherry-deep:#BE1E2D; --cherry-soft:#3A1A1E; --cherry-ink:#F07078;
    --ink:#F4ECEB; --ink-2:#D2C6C7; --muted:#9C8F92;
    --bg:#141011; --surface:#1E181A; --field:#241D1F; --line:#332A2C; --line-2:#453A3C;
    --hero:#0F0B0C; --hero-2:#1E1517; --hero-text:#FBF4F3; --hero-muted:#A9999C;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px -12px rgba(0,0,0,.6);
    --shadow-lift:0 2px 4px rgba(0,0,0,.5),0 24px 48px -16px rgba(224,69,79,.35);
    --ph-overlay:rgba(20,16,17,.90);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --cherry:#E0454F; --cherry-deep:#BE1E2D; --cherry-soft:#3A1A1E; --cherry-ink:#F07078;
  --ink:#F4ECEB; --ink-2:#D2C6C7; --muted:#9C8F92;
  --bg:#141011; --surface:#1E181A; --field:#241D1F; --line:#332A2C; --line-2:#453A3C;
  --hero:#0F0B0C; --hero-2:#1E1517; --hero-text:#FBF4F3; --hero-muted:#A9999C;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px -12px rgba(0,0,0,.6);
  --shadow-lift:0 2px 4px rgba(0,0,0,.5),0 24px 48px -16px rgba(224,69,79,.35);
  --ph-overlay:rgba(20,16,17,.90);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"IBM Plex Sans",system-ui,Segoe UI,Arial,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{font-family:"Barlow Condensed","Arial Narrow",Arial,sans-serif;text-wrap:balance;margin:0;line-height:1.05}
.mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px);scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.toolbar ~ section[id],.toolbar ~ .sec[id]{scroll-margin-top:60px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
.eyebrow{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cherry)}
:focus-visible{outline:2px solid var(--cherry);outline-offset:3px;border-radius:4px}

/* NAV */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:20px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{width:42px;height:42px}
.brand b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:22px;letter-spacing:.06em;line-height:1;display:block}
.brand small{display:block;font-size:10px;letter-spacing:.22em;color:var(--muted);text-transform:uppercase}
.links{display:flex;gap:4px;margin-left:auto}
.links a{text-decoration:none;font-size:14px;font-weight:500;padding:8px 12px;border-radius:6px;color:var(--ink-2)}
.links a:hover{background:var(--field)}
.links a.active{color:var(--cherry);box-shadow:inset 0 -2px 0 var(--cherry);border-radius:0}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--cherry);color:#fff;text-decoration:none;font-weight:600;font-size:14px;padding:11px 18px;border-radius:6px;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn:hover{background:var(--cherry-deep);transform:translateY(-1px);box-shadow:0 10px 24px -10px var(--cherry)}
.btn.ghost{background:transparent;color:var(--hero-text);border:1px solid rgba(255,255,255,.28)}
.btn.ghost:hover{background:rgba(255,255,255,.08);box-shadow:none}
.menu{display:none;margin-left:auto;background:none;border:1px solid var(--line-2);border-radius:6px;padding:8px 10px;color:var(--ink);font:inherit}
@media (max-width:1120px){.nav .btn{display:none}}
@media (max-width:900px){.links{display:none}.menu{display:block}}

/* HERO */
.hero{background:linear-gradient(100deg,rgba(15,11,12,.94) 0%,rgba(15,11,12,.78) 45%,rgba(15,11,12,.55) 100%),var(--ph-refinery) center/cover no-repeat var(--hero);color:var(--hero-text);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 400px at 80% 110%,rgba(190,30,45,.35),transparent 60%);pointer-events:none;animation:glow 8s ease-in-out infinite alternate}
@keyframes glow{to{opacity:.4}}
.hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;mask-image:linear-gradient(to bottom,transparent,black 30%,black 80%,transparent)}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center;padding-block:clamp(40px,7vw,84px)}
.hero h1{font-size:clamp(36px,4.8vw,62px);font-weight:700;letter-spacing:-.01em;margin:14px 0 18px}
.hero h1 em{font-style:normal;color:var(--cherry-ink)}
.hero p{color:var(--hero-muted);max-width:56ch;font-size:clamp(16px,1.4vw,18px);margin:0 0 26px}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.stats{display:flex;gap:0;margin-top:34px;border-top:1px solid rgba(255,255,255,.12);flex-wrap:wrap}
.stat{padding:18px 26px 4px 0;margin-right:26px;border-right:1px solid rgba(255,255,255,.12)}
.stat:last-child{border-right:0}
.stat b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:36px;font-weight:600;display:block;line-height:1;font-variant-numeric:tabular-nums}
.stat span{font-size:12px;color:var(--hero-muted);letter-spacing:.06em;text-transform:uppercase}
.plant{width:100%;max-width:560px;justify-self:end;filter:drop-shadow(0 20px 40px rgba(0,0,0,.6));background:radial-gradient(ellipse at center,rgba(15,11,12,.55),transparent 70%)}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr}.plant{justify-self:center;max-width:520px}}

/* FILTER */
.toolbar{position:sticky;top:calc(env(safe-area-inset-top,0px) + 68px);z-index:10;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.toolbar .wrap{display:flex;align-items:center;gap:10px;padding-block:12px;overflow-x:auto;scrollbar-width:none}
.toolbar .wrap::-webkit-scrollbar{display:none}
.chip{border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);font:inherit;font-size:13px;font-weight:500;padding:7px 14px;border-radius:999px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;transition:all .2s}
.chip i{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:11px;background:var(--field);padding:1px 7px;border-radius:999px;color:var(--muted)}
.chip:hover{border-color:var(--cherry);color:var(--cherry)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chip[aria-pressed="true"] i{background:rgba(255,255,255,.14);color:inherit}
.toolbar .hint{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap}
@media (max-width:1200px){.toolbar .hint{display:none}}

/* GRID */
.services{padding-block:clamp(32px,5vw,56px);position:relative;background:linear-gradient(var(--ph-overlay),var(--ph-overlay)),var(--ph-plantwide) center/cover fixed no-repeat var(--bg)}
@media (max-width:900px){.services{background-attachment:scroll}}
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.sec-head h2{font-size:clamp(30px,4vw,44px);font-weight:600}
.sec-head p{margin:6px 0 0;color:var(--muted);max-width:60ch}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
@media (max-width:980px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.grid{grid-template-columns:1fr}}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s;position:relative;animation:rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0) * 55ms)}
@keyframes rise{from{transform:translateY(18px)}to{transform:none}}
.tile:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift);border-color:color-mix(in srgb,var(--cherry) 45%,var(--line))}
.tile.hidden{display:none}
.media{position:relative;border-bottom:1px solid var(--line);aspect-ratio:16/9;max-width:100%;overflow:hidden;background:var(--ph) center/cover no-repeat var(--hero-2);color:#fff}
.media::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(15,11,12,.78) 0%,rgba(15,11,12,.62) 55%,rgba(190,30,45,.45) 100%);transition:opacity .4s}
.media::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:20px 20px;pointer-events:none}
.tile:hover .media::before{opacity:.85}
.media>*{position:relative;z-index:1}
[data-cat="engineering"] .media{--ph:var(--ph-piping)}[data-cat="safety"] .media{--ph:var(--ph-flare)}[data-cat="control"] .media{--ph:var(--ph-controlroom)}[data-cat="training"] .media{--ph:var(--ph-operator)}
/* illustration recolours to light-on-photo inside tiles */
.media .ill .ln{stroke:#E9DFE0}.media .ill .ln.thin{stroke:#BFB0B3;opacity:.8}.media .ill .fl{fill:rgba(20,16,17,.7);stroke:#E9DFE0}.media .ill .tx{fill:#C9BBBE}.media .ill .fs{fill:rgba(224,69,79,.22)}.media .ill .ac{stroke:#F07078}.media .ill .fa{fill:#F07078}.media .ill .txa{fill:#F7A0A6}
.media .ill circle[fill="var(--surface)"]{fill:rgba(20,16,17,.85)}.media .ill text[fill="var(--ink)"]{fill:#F4ECEB}
.media svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.tile:hover .media svg{transform:scale(1.04)}
.media .tag{position:absolute;top:12px;left:12px;z-index:2;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.06em;background:rgba(20,16,17,.6);backdrop-filter:blur(6px);color:#F4ECEB;border:1px solid rgba(255,255,255,.25);padding:3px 8px;border-radius:4px}
.body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.cat{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
.cat::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--dot,var(--cherry));transform:rotate(45deg)}
.tile h3{font-size:26px;font-weight:600;letter-spacing:.005em}
.tile p{margin:0;color:var(--ink-2);font-size:15px;line-height:1.5;flex:1}
.std{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--muted);letter-spacing:.02em}
.more{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--cherry);font-weight:600;font-size:14px;margin-top:6px}
.more svg{transition:transform .25s}
.tile:hover .more svg{transform:translateX(5px)}
.more::after{content:"";position:absolute;inset:0}
[data-cat="engineering"]{--dot:#BE1E2D}[data-cat="safety"]{--dot:#D9822B}[data-cat="control"]{--dot:#2E7DBE}[data-cat="training"]{--dot:#4F9E62}
.tile.featured{grid-column:span 2}
.tile.featured .media{aspect-ratio:auto;min-height:220px}
@media (max-width:600px){.tile.featured{grid-column:span 1}.tile.featured .media{aspect-ratio:16/9;min-height:0}}
.tile.cta{background:linear-gradient(135deg,rgba(190,30,45,.92),rgba(142,21,34,.94)),var(--ph-controlroom) center/cover no-repeat var(--cherry-deep);color:#fff;border:0;justify-content:center;padding:28px 26px;gap:12px}
.tile.cta h3{font-size:30px;color:#fff}
.tile.cta p{color:rgba(255,255,255,.85);flex:0}
.tile.cta .btn{background:#fff;color:var(--cherry-deep);align-self:flex-start;margin-top:8px}
.tile.cta .btn:hover{background:#FBEDEE}
@media (max-width:980px){.tile.cta{grid-column:span 2}}
@media (max-width:600px){.tile.cta{grid-column:span 1}}
.empty{display:none;text-align:center;color:var(--muted);padding:40px}

/* ENGAGE */
.engage{position:relative;color:var(--hero-text);background:linear-gradient(90deg,rgba(15,11,12,.95) 0%,rgba(15,11,12,.82) 60%,rgba(15,11,12,.6) 100%),var(--ph-operator) center/cover no-repeat var(--hero);padding-block:clamp(36px,5vw,64px)}
.engage .step{border-top-color:rgba(255,255,255,.22)}.engage .step p{color:var(--hero-muted)}.engage .step::before{color:var(--cherry-ink)}
.engage h2{font-size:clamp(28px,3.6vw,40px);font-weight:600;margin-bottom:26px}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:s}
@media (max-width:820px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.steps{grid-template-columns:1fr}}
.step{position:relative;padding:20px 0 0;border-top:2px solid var(--line-2)}
.step::before{counter-increment:s;content:"0" counter(s);font-family:"Barlow Condensed",Arial,sans-serif;font-size:34px;font-weight:600;color:var(--cherry);line-height:1;display:block;margin-bottom:8px}
.step::after{content:"";position:absolute;top:-2px;left:0;width:0;height:2px;background:var(--cherry);animation:grow 1.6s ease forwards;animation-delay:calc(var(--i) * .4s)}
@keyframes grow{to{width:100%}}
.step b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:22px;font-weight:600;display:block}
.step p{margin:6px 0 0;color:var(--ink-2);font-size:14.5px}

/* FOOTER */
footer{padding-block:32px;color:var(--muted);font-size:13px}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}

/* SVG ILLUSTRATION SHARED */
.ill{font-family:"IBM Plex Mono",monospace}
.ill .ln{fill:none;stroke:var(--ink-2);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ill .ln.thin{stroke-width:1;opacity:.6}
.ill .ac{fill:none;stroke:var(--cherry);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ill .fl{fill:var(--surface);stroke:var(--ink-2);stroke-width:1.6}
.ill .fa{fill:var(--cherry)}
.ill .fs{fill:var(--cherry-soft)}
.ill .tx{fill:var(--muted);font-size:9px}
.ill .txa{fill:var(--cherry);font-size:9px;font-weight:500}
.ill .flow{stroke-dasharray:6 6;animation:flow 1.4s linear infinite}
@keyframes flow{to{stroke-dashoffset:-12}}
.ill .draw{stroke-dasharray:600;stroke-dashoffset:600;animation:draw 3.2s ease-in-out infinite}
@keyframes draw{0%{stroke-dashoffset:600}55%{stroke-dashoffset:0}85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.ill .pulse{transform-origin:center;transform-box:fill-box;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.9);opacity:.25}}
.ill .swing{transform-origin:50% 0;transform-box:fill-box;animation:swing 1.8s ease-in-out infinite}
@keyframes swing{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}
.ill .blink{animation:blink 1.2s steps(2) infinite}
@keyframes blink{50%{opacity:.15}}
.ill .float{animation:float 3s ease-in-out infinite}
@keyframes float{50%{transform:translate(4px,-6px)}}
.ill .spin{transform-origin:center;transform-box:fill-box;animation:spin 24s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ill .breathe{transform-origin:center;transform-box:fill-box;animation:breathe 3.4s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.06)}}
.ill .tick{stroke-dasharray:20;stroke-dashoffset:20;animation:tick 4s ease-out infinite}
@keyframes tick{10%{stroke-dashoffset:0}90%{stroke-dashoffset:0}100%{stroke-dashoffset:20}}
.ill .layer{animation:layer 3s ease-in-out infinite}
@keyframes layer{0%,100%{opacity:.35}50%{opacity:1}}
.ill .bar{transform-origin:bottom;transform-box:fill-box;animation:bar 2.6s ease-in-out infinite}
@keyframes bar{50%{transform:scaleY(.55)}}
@media (prefers-reduced-motion:reduce){
  .ill *,.tile,.step::after{animation:none!important}
  .ill .draw{stroke-dashoffset:0}.ill .tick{stroke-dashoffset:0}.step::after{width:100%}
}

/* ---- detail page ---- */
.crumbs{font-size:13px;color:var(--hero-muted);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--hero-muted);text-decoration:none}.crumbs a:hover{color:#fff}
.dhero{background:linear-gradient(100deg,rgba(15,11,12,.95) 0%,rgba(15,11,12,.80) 50%,rgba(15,11,12,.50) 100%),var(--ph) center/cover no-repeat var(--hero);color:var(--hero-text);position:relative;overflow:hidden}
.dhero::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 400px at 85% 110%,rgba(190,30,45,.35),transparent 60%);pointer-events:none;animation:glow 8s ease-in-out infinite alternate}
.dhero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,64px);align-items:center;padding-block:clamp(36px,6vw,72px)}
.dhero h1{font-size:clamp(36px,4.8vw,60px);font-weight:700;letter-spacing:-.01em;margin:14px 0 16px}
.dhero .lede{color:var(--hero-muted);font-size:clamp(16px,1.35vw,18px);max-width:58ch;margin:0 0 24px}
.dhero .ill{width:100%;max-width:560px;justify-self:end;border-radius:14px;background:rgba(15,11,12,.55);border:1px solid rgba(255,255,255,.14);padding:18px;backdrop-filter:blur(6px);box-shadow:0 30px 60px -20px rgba(0,0,0,.7)}
.dhero .ill .ln{stroke:#E9DFE0}.dhero .ill .ln.thin{stroke:#BFB0B3;opacity:.8}.dhero .ill .fl{fill:rgba(20,16,17,.7);stroke:#E9DFE0}.dhero .ill .tx{fill:#C9BBBE}.dhero .ill .fs{fill:rgba(224,69,79,.22)}.dhero .ill .ac{stroke:#F07078}.dhero .ill .fa{fill:#F07078}.dhero .ill .txa{fill:#F7A0A6}
.dhero .ill circle[fill="var(--surface)"]{fill:rgba(20,16,17,.85)}.dhero .ill text[fill="var(--ink)"]{fill:#F4ECEB}
@media (max-width:860px){.dhero .wrap{grid-template-columns:1fr}.dhero .ill{justify-self:center}}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border-block:1px solid var(--line)}
.facts div{background:var(--surface);padding:22px 24px}
.facts b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:32px;font-weight:600;display:block;line-height:1;color:var(--cherry);font-variant-numeric:tabular-nums}
.facts span{font-size:13px;color:var(--muted)}
@media (max-width:640px){.facts{grid-template-columns:1fr}}
.sec{padding-block:clamp(36px,5vw,64px)}
.sec h2{font-size:clamp(28px,3.6vw,40px);font-weight:600;margin:6px 0 18px}
.two{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,64px);align-items:start}
@media (max-width:820px){.two{grid-template-columns:1fr}}
.prose p{margin:0 0 14px;color:var(--ink-2);max-width:66ch;font-size:16.5px}
.sticky{position:sticky;top:calc(env(safe-area-inset-top,0px) + 84px);align-self:start}
@media (max-width:820px){.sticky{position:static}}
.scope{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:600px){.scope{grid-template-columns:1fr}}
.scope div{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px 20px;box-shadow:var(--shadow);transition:transform .3s,border-color .3s}
.scope div:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--cherry) 45%,var(--line))}
.scope b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:21px;font-weight:600;display:block;margin-bottom:4px}
.scope p{margin:0;font-size:14.5px;color:var(--ink-2)}
.band{position:relative;color:var(--hero-text);background:linear-gradient(90deg,rgba(15,11,12,.95),rgba(15,11,12,.82) 60%,rgba(15,11,12,.6)),var(--ph) center/cover no-repeat var(--hero)}
.band h2{color:#fff}.band .step p{color:var(--hero-muted)}.band .step{border-top-color:rgba(255,255,255,.22)}.band .step::before{color:var(--cherry-ink)}
.stds{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.std-card{display:flex;flex-direction:column;gap:4px;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--cherry);border-radius:8px;padding:14px 16px}
.std-card code{font-family:"IBM Plex Mono",monospace;font-size:13px;font-weight:500;color:var(--cherry)}
.std-card span{font-size:14px;color:var(--ink-2)}
.dlv{columns:2;column-gap:32px;margin:0;padding:0;list-style:none}
@media (max-width:600px){.dlv{columns:1}}
.dlv li{break-inside:avoid;padding:10px 0 10px 28px;border-bottom:1px solid var(--line);position:relative;font-size:15px}
.dlv li::before{content:"";position:absolute;left:4px;top:16px;width:10px;height:10px;background:var(--cherry);transform:rotate(45deg);border-radius:2px}
.why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:760px){.why{grid-template-columns:1fr}}
.why div{padding:18px 20px;border:1px solid var(--line);border-radius:10px;background:var(--field)}
.why b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:20px;font-weight:600}
.why span{font-size:14px;color:var(--ink-2)}
.rel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:760px){.rel{grid-template-columns:1fr}}
.rel a{display:block;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px 20px;box-shadow:var(--shadow);transition:transform .3s,border-color .3s}
.rel a:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--cherry) 45%,var(--line))}
.rel b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:22px;font-weight:600;display:block}
.rel span{font-size:13px;color:var(--muted)}
/* consultation */
.consult{position:relative;color:var(--hero-text);background:linear-gradient(120deg,rgba(142,21,34,.94),rgba(190,30,45,.86) 60%,rgba(15,11,12,.85)),var(--ph-controlroom) center/cover no-repeat var(--cherry-deep);padding-block:clamp(40px,6vw,72px)}
.consult .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start}
@media (max-width:820px){.consult .wrap{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.form .row{grid-template-columns:minmax(0,1fr)}}
.consult h2{color:#fff;font-size:clamp(30px,4vw,46px)}
.consult p{color:rgba(255,255,255,.85);max-width:50ch}
.form{background:rgba(20,16,17,.55);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:24px;display:grid;gap:14px}
.form label{display:grid;gap:6px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.form input,.form select,.form textarea{font:inherit;font-size:15px;padding:11px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;color-scheme:dark}
.form input::placeholder,.form textarea::placeholder{color:rgba(255,255,255,.45)}
.form .row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.form input,.form select,.form textarea{min-width:0;width:100%;box-sizing:border-box}
.form select option,.form select optgroup{background:#1E1618;color:#fff}
.form .err{font-size:12.5px;color:#F7A0A6;margin-top:6px;min-height:0;text-transform:none;letter-spacing:0;font-weight:500}
.form .err:empty{display:none}
.form.light .err{color:var(--cherry)}
.form.light select option,.form.light select optgroup{background:#fff;color:#141413}

.form{min-width:0}
@media (max-width:520px){.form .row{grid-template-columns:1fr}}
.form .btn{justify-content:center;background:#fff;color:var(--cherry-deep)}
.form .btn:hover{background:#FBEDEE}
.form .ok{display:none;font-size:15px;line-height:1.5;color:#fff;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);padding:14px 16px;border-radius:8px}.form .ok b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:20px;font-weight:600}.form.sent input,.form.sent select,.form.sent textarea,.form.sent button{opacity:.55}
.form.sent .ok{display:block}
.contact-alt{margin-top:18px;font-size:14px;color:rgba(255,255,255,.8)}
.contact-alt .mono{color:#fff;user-select:all}
.reveal{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
/* application screens */
.shot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px}
@media (max-width:900px){.shot-grid{grid-template-columns:1fr}}
.shot{margin:0;animation:rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0)*80ms)}
.shot a{display:block;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.16);background:#000;box-shadow:0 30px 60px -24px rgba(0,0,0,.8);transition:transform .35s,border-color .35s}
.shot a:hover{transform:translateY(-4px) scale(1.01);border-color:var(--cherry-ink)}
.shot img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.shot figcaption{font-size:13px;color:var(--hero-muted);margin-top:8px}
.shot.missing{display:none}
.shots.empty{display:none}

/* ---- site-wide additions ---- */
@media (max-width:900px){
  .nav .wrap{flex-wrap:wrap}
  .nav.open .links{display:flex;flex-direction:column;width:100%;order:10;padding:8px 0 12px;border-top:1px solid var(--line)}
  .nav.open .links a{padding:12px 8px;font-size:16px}
  .nav.open .btn{display:inline-flex;order:11;margin:0 0 14px 8px}
}
.page-hero{color:var(--hero-text);background:linear-gradient(100deg,rgba(15,11,12,.94) 0%,rgba(15,11,12,.78) 50%,rgba(15,11,12,.5) 100%),var(--ph) center/cover no-repeat var(--hero);position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 400px at 85% 110%,rgba(190,30,45,.35),transparent 60%);pointer-events:none;animation:glow 8s ease-in-out infinite alternate}
.page-hero .wrap{position:relative;z-index:1;padding-block:clamp(40px,6vw,80px)}
.page-hero h1{font-size:clamp(36px,5vw,64px);font-weight:700;margin:14px 0 14px;max-width:18ch}
.page-hero p{color:var(--hero-muted);max-width:60ch;font-size:clamp(16px,1.35vw,18px);margin:0}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:980px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.cards{grid-template-columns:1fr}}
.card{position:relative;display:flex;flex-direction:column;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;animation:rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0)*60ms)}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift)}
.card .photo{aspect-ratio:16/9;max-width:100%;background:linear-gradient(160deg,rgba(15,11,12,.75),rgba(190,30,45,.35)),var(--ph) center/cover no-repeat var(--hero-2);display:flex;align-items:flex-end;padding:16px;color:#fff}
.card .photo b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:28px;font-weight:600;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.card .body{padding:18px 20px 20px}
.card h3{font-size:24px;font-weight:600}
.card p{margin:0;color:var(--ink-2);font-size:14.5px;flex:1}
.card .pill{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.06em;padding:3px 8px;border-radius:4px;background:var(--cherry-soft);color:var(--cherry-ink);margin-right:6px;margin-top:8px}
.card .more::after{content:"";position:absolute;inset:0}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center}
@media (max-width:820px){.split{grid-template-columns:1fr}}
.photo-frame{aspect-ratio:4/3;max-width:100%;border-radius:14px;background:linear-gradient(160deg,rgba(15,11,12,.35),rgba(190,30,45,.25)),var(--ph) center/cover no-repeat var(--hero-2);box-shadow:var(--shadow-lift);border:1px solid var(--line)}
.product{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center;padding-block:clamp(32px,5vw,56px);border-bottom:1px solid var(--line)}
.product:nth-child(even) .visual{order:-1}
@media (max-width:820px){.product{grid-template-columns:1fr}.product:nth-child(even) .visual{order:0}}
.product h3{font-size:clamp(28px,3.4vw,38px);font-weight:600}
.product .kicker{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cherry)}
.product ul{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.product li{padding-left:22px;position:relative;font-size:15px;color:var(--ink-2)}
.product li::before{content:"";position:absolute;left:2px;top:9px;width:8px;height:8px;background:var(--cherry);transform:rotate(45deg);border-radius:2px}
.product .visual{border-radius:14px;overflow:hidden;background:var(--hero);border:1px solid var(--line);box-shadow:var(--shadow-lift);padding:20px;position:relative}
.product .visual::before{content:"";position:absolute;inset:0;background:var(--ph) center/cover no-repeat;opacity:.28}
.product .visual svg{position:relative;width:100%;height:auto;display:block}
.product .visual .ln{stroke:#E9DFE0}.product .visual .ln.thin{stroke:#BFB0B3;opacity:.8}.product .visual .fl{fill:rgba(20,16,17,.7);stroke:#E9DFE0}.product .visual .tx{fill:#C9BBBE}.product .visual .fs{fill:rgba(224,69,79,.22)}.product .visual .ac{stroke:#F07078}.product .visual .fa{fill:#F07078}.product .visual .txa{fill:#F7A0A6}
.product .visual circle[fill="var(--surface)"]{fill:rgba(20,16,17,.85)}.product .visual text[fill="var(--ink)"]{fill:#F4ECEB}
.industry{display:grid;grid-template-columns:minmax(0,1fr);gap:0;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--surface);animation:rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0)*60ms)}
.industry .photo{min-height:200px;background:linear-gradient(160deg,rgba(15,11,12,.7),rgba(190,30,45,.35)),var(--ph) center/cover no-repeat var(--hero-2);display:flex;align-items:flex-end;padding:18px;color:#fff}
.industry .photo.media{aspect-ratio:16/9;min-height:0;border-bottom:1px solid var(--line)}
.industry .photo.media::before{background:linear-gradient(180deg,rgba(15,11,12,.25) 0%,rgba(15,11,12,.55) 60%,rgba(190,30,45,.55) 100%)}
.industry .photo.media svg{opacity:.75}
.industry:hover .photo.media svg{opacity:1}
.industry .photo.media b{position:relative;z-index:2;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.industry .photo.media svg{position:absolute;inset:0;width:100%;height:100%}
.industry .photo b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:30px;font-weight:600;line-height:1}
.industry .body{padding:18px 20px 20px}
.industry p{margin:0 0 10px;color:var(--ink-2);font-size:14.5px}
.industry .links2{display:flex;flex-wrap:wrap;gap:6px}
.industry .links2 a{font-size:12px;text-decoration:none;padding:4px 9px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2)}
.industry .links2 a:hover{border-color:var(--cherry);color:var(--cherry)}
.inds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:980px){.inds{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.inds{grid-template-columns:1fr}}
.profile{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:clamp(24px,5vw,56px);align-items:start}
.profile-alt{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
@media (max-width:820px){.profile-alt>div:first-child{order:2}}
@media (max-width:820px){.profile{grid-template-columns:1fr}}
.certs{display:grid;gap:10px;margin-top:16px}
.founder{margin:0;position:relative;border-radius:16px;overflow:hidden;box-shadow:var(--shadow-lift);border:1px solid var(--line);background:var(--surface)}
.founder img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}
.founder::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--cherry);z-index:2}
.founder figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 22px 18px;background:linear-gradient(to top,rgba(15,11,12,.9),rgba(15,11,12,.55) 60%,transparent);color:#fff}
.founder figcaption b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:30px;font-weight:600;line-height:1}
.founder figcaption span{display:block;font-size:13px;color:rgba(255,255,255,.82);margin-top:4px}
.cert{display:flex;gap:12px;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:12px 14px}
.cert i{width:36px;height:36px;border-radius:8px;background:var(--cherry-soft);color:var(--cherry-ink);display:grid;place-items:center;font-style:normal;font-family:"Barlow Condensed",Arial,sans-serif;font-weight:700;font-size:15px;flex:none}
.cert b{display:block;font-size:15px}.cert span{font-size:13px;color:var(--muted)}
.contact-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:clamp(24px,5vw,56px)}
@media (max-width:820px){.contact-grid{grid-template-columns:minmax(0,1fr)}}
.contact-list{display:grid;gap:14px}
.contact-list div{border-left:3px solid var(--cherry);padding:4px 0 4px 14px}
.contact-list b{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.contact-list span{font-size:16px}
.form.light{background:var(--surface);border:1px solid var(--line);backdrop-filter:none}
.form.light label{color:var(--muted)}
.form.light input,.form.light select,.form.light textarea{background:var(--bg);color:var(--ink);border-color:var(--line-2);color-scheme:light}
.form.light .btn{background:var(--cherry);color:#fff}.form.light .btn:hover{background:var(--cherry-deep)}
.form.light .ok{color:var(--ink);background:var(--cherry-soft)}
:root[data-theme="dark"] .form.light input,:root[data-theme="dark"] .form.light select,:root[data-theme="dark"] .form.light textarea{color-scheme:dark}
.strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:820px){.strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.strip{grid-template-columns:1fr}}
.strip a{display:block;text-decoration:none;padding:18px 20px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#fff;transition:background .3s,transform .3s}
.strip a:hover{background:rgba(255,255,255,.12);transform:translateY(-3px)}
.strip b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:24px;font-weight:600}
.strip span{font-size:13px;color:var(--hero-muted)}
footer .fcols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px;padding-bottom:28px;border-bottom:1px solid var(--line);margin-bottom:20px}
@media (max-width:820px){footer .fcols{grid-template-columns:1fr 1fr}}
@media (max-width:480px){footer .fcols{grid-template-columns:1fr}}
footer .fcols b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:18px;color:var(--ink);margin-bottom:8px}
footer .fcols a{display:block;text-decoration:none;color:var(--muted);font-size:13.5px;padding:3px 0}
footer .fcols a:hover{color:var(--cherry)}
footer .fcols p{margin:0;max-width:40ch;color:var(--muted)}

/* ---- operational discipline ---- */
.od-hero{--ph:var(--ph-controlroom)}
.brand small{white-space:nowrap}
@media (max-width:1400px){.nav .wrap{gap:12px}.links{gap:0}.links a{padding:8px 8px;font-size:13.5px}.nav .btn{padding:9px 13px;font-size:13px;white-space:nowrap}.brand small{font-size:9px;letter-spacing:.16em}}
@media (max-width:1180px){.links a{padding:8px 6px;font-size:13px}}
.od-hero .stat{margin-right:18px;padding-right:18px}
.od-loop{width:100%;max-width:560px;justify-self:end;filter:drop-shadow(0 20px 40px rgba(0,0,0,.6))}
@media (max-width:860px){.od-loop{justify-self:center;max-width:520px}}
.od-loop .lbl{fill:#F4ECEB;font-size:10px;font-weight:600;font-family:"Barlow Condensed",Arial,sans-serif;letter-spacing:.02em}
.od-loop .sub{fill:#B9A9AC;font-size:8px}
.od-loop .ring{fill:none;stroke:#E0454F;stroke-width:2;stroke-dasharray:6 6;animation:flow 1.6s linear infinite}
.od-loop .node{fill:#221A1C;stroke:#D8CACC;stroke-width:1.5}
.od-loop .node.hot{stroke:#E0454F}
.loop{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;counter-reset:l}
@media (max-width:1000px){.loop{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.loop{grid-template-columns:1fr}}
.loop .n{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 18px 16px;display:flex;flex-direction:column;gap:8px}
.loop .n::before{counter-increment:l;content:"0" counter(l);font-family:"Barlow Condensed",Arial,sans-serif;font-size:30px;font-weight:600;color:var(--cherry);line-height:1}
.loop .n b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:22px;font-weight:600;line-height:1.1}
.loop .n p{margin:0;color:var(--ink-2);font-size:14px;flex:1}
.loop .n .k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.loop .n a{display:inline-block;margin:2px 6px 0 0;font-size:13px;font-weight:600;color:var(--cherry);text-decoration:none}
.loop .n a.s{color:var(--ink);border-bottom:1px solid var(--line-2)}
.loop .n:not(:last-child)::after{content:"→";position:absolute;right:-13px;top:22px;width:24px;height:24px;border-radius:50%;background:var(--cherry);color:#fff;display:grid;place-items:center;font-size:13px;z-index:2}
@media (max-width:1000px){.loop .n:not(:last-child)::after{display:none}}
.odi{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:32px;align-items:start}
@media (max-width:900px){.odi{grid-template-columns:1fr}}
.odi .score{background:var(--hero);color:var(--hero-text);border-radius:16px;padding:26px 26px 22px;position:relative;overflow:hidden}
.odi .score::before{content:"";position:absolute;inset:0;background:radial-gradient(500px 240px at 90% 110%,rgba(190,30,45,.4),transparent 60%);pointer-events:none}
.odi .score .eyebrow{color:#F7A0A6}
.odi .score .big{font-family:"Barlow Condensed",Arial,sans-serif;font-size:96px;font-weight:700;line-height:1;margin:8px 0 0}
.odi .score .big small{font-size:28px;color:var(--hero-muted);font-weight:600}
.odi .score p{color:var(--hero-muted);font-size:14px;margin:8px 0 0;position:relative}
.odi .score .trend{margin-top:18px;height:70px;position:relative}
.odi .score .trend svg{width:100%;height:100%;display:block}
.odi .score .ex{display:inline-block;margin-top:14px;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;border:1px solid rgba(255,255,255,.25);border-radius:4px;padding:3px 8px;color:var(--hero-muted)}
.ind{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
@media (max-width:640px){.ind{grid-template-columns:1fr}}
.ind div{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto auto auto;gap:2px 12px;align-items:end;padding:10px 0;border-bottom:1px solid var(--line)}
.ind b,.ind span:not(.v):not(.m):not(.src){grid-column:1}
.ind b{font-size:14.5px;font-weight:600}
.ind span{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--muted)}
.ind .v{font-family:"Barlow Condensed",Arial,sans-serif;font-size:26px;font-weight:600;color:var(--cherry);grid-column:2;grid-row:1/3;align-self:center;white-space:nowrap}
.ind .m{grid-column:1/3;height:6px;border-radius:3px;background:var(--field);overflow:hidden}
.ind .m i{display:block;height:100%;background:var(--cherry);width:var(--w);border-radius:3px;transform-origin:left;animation:odgrow 1.4s ease both}
@keyframes odgrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ind .src{grid-column:1/3;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.offer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:820px){.offer{grid-template-columns:1fr}}
.offer div{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--cherry);border-radius:12px;padding:20px 22px}
.offer .ph{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cherry)}
.offer b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:24px;font-weight:600;margin:4px 0 8px}
.offer ul{margin:0;padding-left:18px;color:var(--ink-2);font-size:14.5px}
.offer li{margin:4px 0}
.offer .lnk{margin-top:12px;font-size:13px}
.offer .lnk a{color:var(--cherry);font-weight:600;text-decoration:none}

/* ---- training ---- */
.tcat .media{aspect-ratio:16/9}
.tcat .body .n{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.bricks{display:flex;flex-direction:column;gap:12px}
.brick{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:18px;align-items:center;background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--cherry);border-radius:12px;padding:16px 20px;text-decoration:none;color:inherit;transition:transform .25s,box-shadow .25s,border-color .25s}
.brick:hover{transform:translateX(6px);box-shadow:var(--shadow-lift);border-color:var(--cherry)}
.brick .code{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.1em;color:var(--cherry);min-width:64px}
.brick b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:24px;font-weight:600;line-height:1.05}
.brick span{display:block;color:var(--ink-2);font-size:14.5px;margin-top:2px}
.brick .meta{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--muted);white-space:nowrap;text-align:right;line-height:1.5}
.brick .go{color:var(--cherry);font-weight:600;font-size:14px;white-space:nowrap}
@media (max-width:760px){.brick{grid-template-columns:1fr;gap:6px}.brick .meta{text-align:left}}
.thero-stats{display:flex;gap:26px;margin-top:26px;flex-wrap:wrap}
.thero-stats div b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:34px;font-weight:600;display:block;line-height:1}
.thero-stats div span{font-size:12px;color:var(--hero-muted);letter-spacing:.06em;text-transform:uppercase}
.course-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 0}
.course-actions .btn.ghost2{background:transparent;border:1px solid var(--line-2);color:var(--ink)}
.course-actions .btn.ghost2:hover{border-color:var(--cherry);color:var(--cherry)}
.pdfwrap{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
.pdfwrap img{display:block;width:100%;height:auto}
.pdfwrap .fallback{padding:18px 22px;font-size:14px;color:var(--ink-2)}
.cmeta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
@media (max-width:760px){.cmeta{grid-template-columns:1fr 1fr}}
.cmeta div{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:12px 14px}
.cmeta b{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#F7A0A6;display:block;margin-bottom:3px}
.cmeta span{font-size:14px;color:#fff}
.formband{background:var(--cherry-soft);border:1px solid color-mix(in srgb,var(--cherry) 30%,var(--line));border-radius:12px;padding:18px 22px;display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;margin-top:26px}
@media (max-width:640px){.formband{grid-template-columns:1fr}}
.formband b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:22px;font-weight:600;display:block}
.formband span{color:var(--ink-2);font-size:14px}

/* ---- custom applications ---- */
.custom{background:var(--field);border-block:1px solid var(--line)}
.custom .sec-head p{color:var(--ink-2);font-size:16.5px;max-width:64ch}
.custom .grp{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cherry);margin:34px 0 14px}
.custom .kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:820px){.custom .kinds{grid-template-columns:1fr}}
.custom .kind{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.custom .kind svg{width:44px;height:44px;stroke:var(--cherry);fill:none;stroke-width:1.8}
.custom .kind b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:23px;font-weight:600}
.custom .kind p{margin:0;color:var(--ink-2);font-size:14.5px;flex:1}
.custom .kind small{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--muted)}
.custom .foot{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;margin-top:32px;padding-top:22px;border-top:1px solid var(--line)}
.custom .foot p{margin:0;color:var(--ink-2);font-size:15px;max-width:60ch}
/* ---- flow additions ---- */
.pain{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.pain{grid-template-columns:1fr}}
.pain div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px 22px 20px;position:relative;overflow:hidden}
.pain div::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--cherry)}
.pain b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:24px;font-weight:600;margin-bottom:6px}
.pain p{margin:0;color:var(--ink-2);font-size:15px}
.pain small{display:block;margin-top:12px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--cherry)}
.lifecycle{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}
@media (max-width:900px){.lifecycle{grid-template-columns:1fr 1fr}}@media (max-width:520px){.lifecycle{grid-template-columns:1fr}}
.stage{padding:22px 20px 20px;border-right:1px solid var(--line);position:relative}
.stage:last-child{border-right:0}
.stage .n{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;color:var(--cherry);text-transform:uppercase}
.stage h3{font-size:26px;font-weight:600;margin:6px 0 4px}
.stage p{margin:0 0 12px;color:var(--muted);font-size:13.5px}
.stage .grp{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:10px 0 4px}
.stage a{display:block;text-decoration:none;color:var(--ink-2);font-size:13.5px;padding:3px 0}
.stage a:hover{color:var(--cherry)}
.stage a.t{color:var(--cherry-ink);font-weight:500}
.stage::after{content:"→";position:absolute;right:-12px;top:26px;width:24px;height:24px;border-radius:50%;background:var(--cherry);color:#fff;display:grid;place-items:center;font-size:13px;z-index:2}
.stage:last-child::after{display:none}
@media (max-width:900px){.stage::after{display:none}}
.steps-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:26px}
@media (max-width:760px){.steps-nav{grid-template-columns:1fr 1fr}}
.steps-nav button{font:inherit;text-align:left;background:var(--surface);border:1px solid var(--line-2);border-radius:10px;padding:12px 14px;cursor:pointer;color:var(--ink-2);transition:all .2s}
.steps-nav button b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:20px;color:var(--ink)}
.steps-nav button small{font-size:12px;color:var(--muted)}
.steps-nav button[aria-pressed="true"]{border-color:var(--cherry);box-shadow:inset 0 0 0 1px var(--cherry);background:var(--cherry-soft)}
.stage-head{grid-column:1/-1;display:flex;align-items:baseline;gap:14px;margin:10px 0 -6px;padding-top:10px;border-top:2px solid var(--cherry)}
.stage-head b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:28px;font-weight:600}
.stage-head span{color:var(--muted);font-size:14px}
.stage-head.hidden{display:none}
.tile .with{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);margin-top:4px}
.tile .with a{position:relative;z-index:2;color:var(--cherry);text-decoration:none;font-weight:600}
.bridge{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;background:var(--cherry-soft);border:1px solid color-mix(in srgb,var(--cherry) 30%,var(--line));border-radius:12px;padding:16px 20px;margin-top:22px}
@media (max-width:640px){.bridge{grid-template-columns:1fr}}
.bridge .k{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cherry)}
.bridge b{font-family:"Barlow Condensed",Arial,sans-serif;font-size:22px;font-weight:600;display:block}
.bridge span{font-size:14px;color:var(--ink-2)}
.cred{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:900px){.cred{grid-template-columns:1fr 1fr}}
.cred div{padding:18px 20px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.cred b{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:30px;font-weight:600;color:var(--cherry);line-height:1}
.cred span{font-size:13.5px;color:var(--ink-2)}
