/* GKraft Digital · site styles
   Brand colours come from the GK logo: ink, deep gold, gold, red and navy on warm paper. */
:root{
  --paper:#F7F4EE; --paper-2:#EFE9DD; --card:#FBF9F4;
  --ink:#131313; --text:#2B2A28; --muted:#67635B; --rule:rgba(19,19,19,.14);
  --navy:#272F48; --navy-2:#1C2236;
  --gold:#D9A632; --gold-d:#A8741A; --gold-l:#F3D27A;
  --red:#E62030; --red-ink:#C3141F;
  --on:#F7F4EE; --on-muted:rgba(247,244,238,.66); --rule-d:rgba(247,244,238,.16);
  --display:'Archivo','Arial Black',system-ui,sans-serif;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){color-scheme:light}}
:root[data-theme="dark"]{color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--serif);font-size:19px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--gold-l);color:var(--ink)}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.skip{position:absolute;left:-999px;top:8px;z-index:99;background:var(--red-ink);color:#fff;padding:10px 14px;font-family:var(--display)}
.skip:focus{left:8px}
h1,h2,h3,h4{font-family:var(--display);font-stretch:125%;font-weight:800;color:var(--ink);margin:0;line-height:.94;letter-spacing:-.01em;text-transform:uppercase;text-wrap:balance}
h1 em,h2 em,h3 em{font-family:var(--serif);font-style:italic;font-weight:500;font-stretch:100%;text-transform:none;color:var(--gold-d);letter-spacing:-.02em}
.eye{font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--red-ink);display:flex;align-items:center;gap:14px;margin:0}
.eye.line::before{content:"";width:40px;height:1px;background:currentColor}
.note{font-style:italic;color:var(--muted);font-size:15px}
.note::before{content:"* ";color:var(--red-ink);font-style:normal}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;font-family:var(--display);font-stretch:110%;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;transition:background .3s,color .3s,border-color .3s,transform .3s}
.btn:hover{transform:translateY(-2px)}
.btn.dark{background:var(--ink);color:var(--on)}
.btn.dark:hover{background:var(--navy);border-color:var(--navy)}
.btn.red{background:var(--red);border-color:var(--red);color:#fff}
.btn.red:hover{background:var(--red-ink);border-color:var(--red-ink)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.btn.gold:hover{background:var(--gold-l);border-color:var(--gold-l)}
.btn.ghost{border-color:var(--rule-d);color:var(--on)}
.btn.ghost:hover{border-color:var(--on)}
.btn svg{flex:none}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* header */
.top{position:fixed;inset:0 0 auto;z-index:60;background:rgba(239,233,221,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);transition:box-shadow .3s}
.top.sh{box-shadow:0 10px 30px -24px rgba(19,19,19,.5)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
.lockup{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink)}
.lk-mark{width:64px;height:42px;flex:none;overflow:visible}
.lk-rule{width:1px;height:32px;background:#CFC8BA}
.lk-word{display:flex;flex-direction:column;gap:6px;line-height:1;font-family:var(--display);font-stretch:100%;font-weight:600}
.lk-word b{font-size:17px;letter-spacing:.3em;font-weight:600}
.lk-word i{font-style:normal;font-size:8px;letter-spacing:.74em;color:var(--gold-d)}
.nav{display:flex;align-items:center;gap:4px}
.nav a{font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:14px 12px;position:relative;color:var(--text)}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:9px;height:2px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .35s}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.top .btn{min-height:44px;padding:0 18px}
.menu-btn{display:none;width:46px;height:46px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;align-items:center;justify-content:center}
.mnav{display:none;border-top:1px solid var(--rule);padding:8px 0 18px}
.mnav.open{display:block}
.mnav a{display:block;padding:12px 0;font-family:var(--display);font-stretch:110%;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:14px;text-decoration:none;border-bottom:1px solid var(--rule)}
@media (max-width:980px){.nav,.top .btn{display:none}.menu-btn{display:inline-flex}}
@media (max-width:420px){.lk-mark{width:52px;height:34px}.lk-word b{font-size:15px}.lk-word i{font-size:7px}.lockup{gap:10px}}

main{display:block;padding-top:72px}
section{position:relative}

/* giant scrolling words */
.giant{position:absolute;left:0;white-space:nowrap;font-family:var(--display);font-stretch:125%;font-weight:900;text-transform:uppercase;line-height:.78;letter-spacing:-.03em;pointer-events:none;user-select:none;will-change:transform}
.giant.pale{color:rgba(19,19,19,.055);font-size:clamp(120px,22vw,340px)}
.giant.pale-d{color:rgba(247,244,238,.07);font-size:clamp(110px,20vw,300px)}

/* hero */
.hero{overflow:hidden;padding:72px 0 0;isolation:isolate}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:start;position:relative;z-index:2}
.hero h1{font-size:clamp(46px,6.6vw,100px);margin-top:26px}
.hero .lede{max-width:40ch;margin:28px 0 0;font-size:20px;color:var(--text)}
.hero .note{margin-top:26px}
.hero-fig{position:relative;margin:8px 0 0;z-index:3}
.hero-fig .blk{position:absolute;inset:8% -7% -6% 18%;background:var(--red);z-index:-1;will-change:transform}
.hero-fig .blk.g{background:var(--gold)}
.hero-fig img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 15%;filter:grayscale(.05) contrast(1.04)}
.hero-fig figcaption{margin-top:12px}
.hero-word{position:relative;z-index:1;margin-top:-6vw;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(90px,24vw,380px);line-height:.78;letter-spacing:-.03em;color:var(--ink);white-space:nowrap;text-transform:uppercase;user-select:none;pointer-events:none;will-change:transform}
.hero.plain{padding-bottom:0}
.hero.plain .hero-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:end}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.crumb li+li::before{content:"/";margin-right:8px;opacity:.5}
.crumb a{text-decoration:none}.crumb a:hover{color:var(--ink)}
.glance{border:1px solid var(--rule);background:var(--card);padding:26px 26px 10px}
.glance h2{font-size:14px;letter-spacing:.2em;font-stretch:110%}
.glance dl{margin:14px 0 0}
.glance div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--rule);font-size:16px}
.glance dt{color:var(--muted);font-style:italic}
.glance dd{margin:0;font-family:var(--display);font-stretch:110%;font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-align:right}
@media (max-width:900px){.hero-grid,.hero.plain .hero-grid{grid-template-columns:minmax(0,1fr)}.hero-fig{max-width:440px}.hero-word{margin-top:24px}}

/* short version */
.short{padding:150px 0 120px;overflow:hidden;isolation:isolate}
.short .giant{top:120px;z-index:-1}
.short-in{max-width:760px;margin-inline:auto}
.short .state{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,44px);line-height:1.28;color:var(--ink);margin:22px 0 0;letter-spacing:-.01em}
.short .tag{margin-top:24px}
mark.u{background:linear-gradient(var(--red),var(--red)) no-repeat 0 92%/0% 2px;color:inherit;padding:0 .02em;transition:background-size 1s cubic-bezier(.2,.75,.15,1) .2s}
mark.u.on{background-size:100% 2px}
mark.g{background:linear-gradient(transparent 62%,rgba(217,166,50,.45) 62%) no-repeat 0 0/0% 100%;color:inherit;transition:background-size 1.1s cubic-bezier(.2,.75,.15,1) .2s}
mark.g.on{background-size:100% 100%}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:90px;border-top:1px solid var(--rule)}
.stats>div{padding:30px 24px 0 0;border-right:1px solid var(--rule);padding-left:24px}
.stats>div:first-child{padding-left:0}
.stats>div:last-child{border-right:0}
.stats b{display:block;font-family:var(--display);font-stretch:125%;font-weight:800;font-size:clamp(46px,5vw,76px);line-height:.9;color:var(--ink);letter-spacing:-.03em}
.stats span{display:block;margin-top:12px;font-style:italic;color:var(--muted);font-size:16px;line-height:1.35}
@media (max-width:860px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stats>div{border-right:0;padding:26px 0 22px 0;border-bottom:1px solid var(--rule)}.stats>div:nth-child(odd){padding-right:16px}}

/* section head */
.sh{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:18px 40px}
.sh h2{font-size:clamp(46px,7vw,104px);margin-top:16px}
.sh .side{max-width:30ch;font-style:italic;color:var(--muted);font-size:16px;line-height:1.45}
.sh .side::first-letter{color:var(--red-ink)}

/* record rows */
.record{padding:110px 0}
.rows{list-style:none;margin:56px 0 0;padding:0;border-top:1px solid var(--rule)}
.rows li{border-bottom:1px solid var(--rule)}
.rows .r{display:grid;grid-template-columns:56px 150px minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:baseline;padding:34px 0;text-decoration:none;position:relative;isolation:isolate}
.rows a.r::before{content:"";position:absolute;inset:0 -14px;background:var(--card);transform:scaleY(0);transform-origin:bottom;transition:transform .45s cubic-bezier(.2,.75,.15,1);z-index:-1}
.rows a.r:hover::before{transform:scaleY(1)}
.rows .n{font-family:var(--display);font-stretch:110%;font-weight:700;font-size:12px;letter-spacing:.14em;color:var(--red-ink)}
.rows .y{font-family:var(--display);font-stretch:110%;font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.rows h3{font-size:clamp(24px,2.6vw,36px);transition:transform .45s cubic-bezier(.2,.75,.15,1)}
.rows a.r:hover h3{transform:translateX(8px)}
.rows .org{display:block;margin-top:8px;font-style:italic;color:var(--muted);font-size:16px}
.rows p{margin:0;font-size:17px;color:var(--text);max-width:46ch}
@media (max-width:860px){.rows .r{grid-template-columns:44px minmax(0,1fr);gap:8px 14px}.rows .y,.rows p{grid-column:2}}

/* menu */
.menu{padding:120px 0;overflow:hidden;isolation:isolate}
.menu .giant{top:150px;z-index:-1}
.mgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:60px;border:1px solid var(--rule);background:rgba(251,249,244,.75)}
.mgrid>*{padding:40px 36px;border-bottom:1px solid var(--rule);text-decoration:none;position:relative;transition:background .35s}
.mgrid>*:nth-child(odd){border-right:1px solid var(--rule)}
.mgrid>*:nth-last-child(-n+2){border-bottom:0}
.mgrid a:hover{background:var(--card)}
.mgrid .n{font-family:var(--display);font-stretch:110%;font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--red-ink)}
.mgrid h3{font-size:clamp(24px,2.4vw,32px);margin-top:16px}
.mgrid p{margin:12px 0 0;font-size:17px;color:var(--muted);max-width:40ch}
.mgrid .go{position:absolute;right:30px;top:36px;color:var(--muted);transition:transform .4s cubic-bezier(.2,.75,.15,1),color .3s}
.mgrid a:hover .go{transform:rotate(45deg);color:var(--red)}
@media (max-width:760px){.mgrid{grid-template-columns:minmax(0,1fr)}.mgrid>*{border-right:0!important;border-bottom:1px solid var(--rule)!important}.mgrid>*:last-child{border-bottom:0!important}.mgrid>*{padding:30px 22px}}
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:70px;align-items:start}
.tier{position:relative;background:var(--card);padding:34px 30px;box-shadow:0 24px 46px -34px rgba(19,19,19,.45);transition:transform .4s cubic-bezier(.2,.75,.15,1),box-shadow .4s}
.tier:hover{transform:translateY(-6px);box-shadow:0 34px 56px -34px rgba(19,19,19,.55)}
.tier.mid{margin-top:-18px}
.tier .badge{position:absolute;top:-12px;left:30px;background:var(--red-ink);color:#fff;font-family:var(--display);font-stretch:110%;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;padding:6px 10px}
.tier h3{font-size:20px;letter-spacing:.02em}
.tier .price{margin-top:10px;font-family:var(--display);font-stretch:110%;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red-ink)}
.tier p{font-size:16px;color:var(--muted);margin:14px 0 0}
@media (max-width:900px){.tiers{grid-template-columns:minmax(0,1fr)}.tier.mid{margin-top:0}}

/* logo orb figure */
.orbfig{margin:90px 0 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.orbfig figcaption{font-style:italic;color:var(--muted);font-size:17px;max-width:34ch}
.orbfig figcaption::before{content:"* ";color:var(--red-ink);font-style:normal}
.orb-stage{display:flex;flex-direction:column;align-items:center;perspective:900px;padding:20px 0}
.orb-wrap{position:relative;width:min(400px,86%);aspect-ratio:1;display:grid;place-items:center;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.75,.15,1);animation:orb-float 7s ease-in-out infinite}
.orb{position:absolute;inset:0;overflow:hidden;border-radius:42% 58% 63% 37%/45% 41% 59% 55%;background:radial-gradient(120% 120% at 30% 22%,#FFFFFF 0%,#FBF6EA 30%,#F1E6CC 60%,#E2CF9F 100%);box-shadow:inset -34px -46px 90px rgba(168,116,26,.28),inset 34px 30px 70px #FFFFFF,0 70px 100px -60px rgba(19,19,19,.5);animation:orb-morph 10s ease-in-out infinite,orb-turn 30s linear infinite}
.orb i{position:absolute;border-radius:50%;filter:blur(26px);mix-blend-mode:multiply}
.orb .o1{width:70%;height:70%;left:38%;top:42%;background:radial-gradient(closest-side,rgba(217,166,50,.55),transparent);animation:orb-a 9s ease-in-out infinite alternate}
.orb .o2{width:46%;height:46%;left:6%;top:56%;background:radial-gradient(closest-side,rgba(230,32,48,.22),transparent);animation:orb-b 11s ease-in-out infinite alternate}
.orb .o3{width:56%;height:40%;left:14%;top:6%;mix-blend-mode:screen;background:radial-gradient(closest-side,rgba(255,255,255,.95),transparent);filter:blur(14px);animation:orb-c 8s ease-in-out infinite alternate}
.orb-mark{position:relative;width:48%;height:auto;overflow:visible;filter:drop-shadow(0 10px 18px rgba(19,19,19,.2));transform:translateZ(40px)}
.orb-mark path{stroke-dasharray:1;stroke-dashoffset:1}
.orb-mark.go path{animation:orb-draw 1.5s cubic-bezier(.65,0,.35,1) forwards}
.orb-mark.go .d1{animation-delay:.2s}.orb-mark.go .d2{animation-delay:1.1s;animation-duration:1.1s}.orb-mark.go .d3{animation-delay:1.9s;animation-duration:.7s}
.orb-floor{width:min(220px,46%);height:24px;margin-top:22px;border-radius:50%;background:radial-gradient(closest-side,rgba(19,19,19,.24),transparent);filter:blur(6px);animation:orb-shadow 7s ease-in-out infinite}
@keyframes orb-draw{to{stroke-dashoffset:0}}
@keyframes orb-float{0%,100%{translate:0 0}50%{translate:0 -16px}}
@keyframes orb-shadow{0%,100%{transform:scaleX(1);opacity:1}50%{transform:scaleX(.82);opacity:.6}}
@keyframes orb-turn{to{rotate:360deg}}
@keyframes orb-morph{0%,100%{border-radius:42% 58% 63% 37%/45% 41% 59% 55%}25%{border-radius:58% 42% 40% 60%/55% 62% 38% 45%}50%{border-radius:47% 53% 55% 45%/38% 54% 46% 62%}75%{border-radius:61% 39% 48% 52%/52% 40% 60% 48%}}
@keyframes orb-a{to{transform:translate(-36%,-30%) scale(1.15)}}
@keyframes orb-b{to{transform:translate(60%,-50%) scale(.85)}}
@keyframes orb-c{to{transform:translate(30%,18%) scale(1.1)}}
@media (max-width:860px){.orbfig{grid-template-columns:minmax(0,1fr)}}

/* person */
.person{padding:120px 0;background:var(--paper-2)}
.person-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px;align-items:start}
.person h2{font-size:clamp(40px,5.4vw,80px);margin-top:16px}
.person .copy p{margin:0 0 20px;font-size:20px}
.person .copy p:first-child::first-letter{font-family:var(--display);font-stretch:125%;font-weight:900;float:left;font-size:76px;line-height:.8;padding:6px 10px 0 0;color:var(--red-ink)}
.person .ctas{margin-top:12px}
@media (max-width:860px){.person-grid{grid-template-columns:minmax(0,1fr);gap:24px}}

/* words / rules / faq */
.words{padding:120px 0}
.quotes{display:grid;gap:0;margin-top:56px;border-top:1px solid var(--rule)}
.quote{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;padding:44px 0;border-bottom:1px solid var(--rule)}
.quote .qm{font-family:var(--serif);font-size:110px;line-height:.6;color:var(--gold);font-style:italic}
.quote blockquote{margin:0;font-size:clamp(24px,2.6vw,34px);line-height:1.3;color:var(--ink);letter-spacing:-.01em}
.quote cite{display:block;margin-top:18px;font-style:normal;font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.quote cite b{color:var(--red-ink);font-weight:700}
@media (max-width:700px){.quote{grid-template-columns:minmax(0,1fr);gap:4px}.quote .qm{font-size:80px}}
.faq{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:56px minmax(0,1fr) 30px;gap:18px;align-items:center;padding:28px 0;font-family:var(--display);font-stretch:115%;font-weight:800;text-transform:uppercase;font-size:clamp(18px,1.8vw,24px);line-height:1.15;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .n{font-size:12px;letter-spacing:.14em;color:var(--red-ink);font-weight:700}
.faq summary .pl{justify-self:end;width:24px;height:24px;position:relative}
.faq summary .pl::before,.faq summary .pl::after{content:"";position:absolute;left:3px;right:3px;top:11px;height:2px;background:var(--ink);transition:transform .35s}
.faq summary .pl::after{transform:rotate(90deg)}
.faq[open] summary .pl::after{transform:rotate(0)}
.faq .a{padding:0 48px 30px 74px;font-size:18px;color:var(--text);max-width:80ch}
.faq .a p{margin:0}
@media (max-width:700px){.faq summary{grid-template-columns:36px minmax(0,1fr) 24px;gap:12px}.faq .a{padding:0 0 26px 48px}}

/* deliverables */
.deliv{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--rule)}
.deliv li{padding:30px 30px 30px 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px}
.deliv li:nth-child(odd){border-right:1px solid var(--rule)}
.deliv li:nth-child(even){padding-left:30px}
.deliv .n{font-family:var(--display);font-stretch:110%;font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--red-ink);padding-top:6px}
.deliv b{display:block;font-family:var(--display);font-stretch:115%;font-weight:800;text-transform:uppercase;font-size:18px;line-height:1.15;color:var(--ink)}
.deliv span{display:block;margin-top:8px;font-size:17px;color:var(--muted)}
@media (max-width:760px){.deliv{grid-template-columns:minmax(0,1fr)}.deliv li{border-right:0!important;padding-left:0!important}}
.forwho{margin-top:50px;display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:34px;background:var(--card);border-left:4px solid var(--gold)}
.forwho h3{font-size:16px;letter-spacing:.12em}
.forwho p{margin:0;font-size:19px}
@media (max-width:700px){.forwho{grid-template-columns:minmax(0,1fr)}}

/* self check */
.check{padding:110px 0;background:var(--paper-2)}
.check-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
.check h2{font-size:clamp(36px,4.6vw,64px);margin-top:16px}
.check .lede{font-size:19px;margin-top:22px}
.sc{background:var(--card);padding:30px;box-shadow:0 24px 46px -34px rgba(19,19,19,.45)}
.sc fieldset{border:0;padding:0;margin:0 0 18px}
.sc legend{font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--red-ink);margin-bottom:8px}
.sc label{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;padding:10px 0;border-bottom:1px solid var(--rule);font-size:17px;cursor:pointer}
.sc input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--red-ink)}
.sc-out{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;margin:22px 0;padding:20px;background:var(--paper-2)}
.sc-out b{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:56px;line-height:.9;color:var(--ink)}
.sc-out small{display:block;font-style:italic;color:var(--muted)}
.sc-out h3{font-size:18px}
.sc-out p{margin:6px 0 0;font-size:16px;color:var(--muted)}
@media (max-width:860px){.check-grid{grid-template-columns:minmax(0,1fr)}}

/* contact band */
.contact{background:var(--ink);color:var(--on);padding:150px 0 40px;overflow:hidden;isolation:isolate}
.contact .giant{top:-.06em;z-index:-1}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:56px;align-items:center}
.contact h2{color:var(--on);font-size:clamp(46px,6.4vw,96px);margin-top:20px}
.contact h2 .r{color:var(--red)}
.contact h2 em{color:var(--gold)}
.contact p.l{color:var(--on-muted);font-size:19px;max-width:44ch;margin:26px 0 0}
.contact .eye{color:var(--gold)}
.dline{border:1px solid var(--rule-d);padding:30px}
.dline .eye{color:var(--red)}
.dline a.mail{display:block;margin-top:16px;font-family:var(--display);font-stretch:110%;font-weight:800;font-size:clamp(17px,1.6vw,21px);letter-spacing:.02em;text-transform:uppercase;color:var(--on);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;word-break:break-all}
.dline p{color:var(--on-muted);font-style:italic;font-size:16px;margin:18px 0 0}
.dline .links{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:16px;font-size:16px}
.dline .links a{color:var(--on);text-underline-offset:4px}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 24px;margin-top:120px;padding-top:24px;border-top:1px solid var(--rule-d);font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--on-muted)}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot a{text-decoration:none}.foot a:hover{color:var(--on)}
@media (max-width:860px){.contact-grid{grid-template-columns:minmax(0,1fr)}}

/* contact page form */
.form{background:var(--card);padding:34px;box-shadow:0 24px 46px -34px rgba(19,19,19,.45);display:grid;gap:18px}
.form h2{font-size:22px;letter-spacing:.04em}
.f2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field{display:grid;gap:6px}
.field label,.field legend{font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{font:inherit;font-size:17px;padding:12px 14px;border:1px solid rgba(19,19,19,.28);background:#fff;color:var(--ink);border-radius:0;min-height:48px}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid rgba(19,19,19,.28);font-size:16px;cursor:pointer;background:#fff}
.chips input{accent-color:var(--red-ink)}
.err{color:var(--red-ink);margin:0;font-size:16px;min-height:1px}
.result{background:var(--paper-2);padding:20px}
.result pre{white-space:pre-wrap;font-family:var(--serif);font-size:16px;margin:12px 0}
@media (max-width:600px){.f2{grid-template-columns:minmax(0,1fr)}.form{padding:22px}}

/* blog */
.posts{list-style:none;margin:56px 0 0;padding:0;border-top:1px solid var(--rule)}
.prose{max-width:720px;margin-inline:auto;font-size:20px}
.prose h2{font-size:clamp(24px,2.6vw,34px);margin:56px 0 18px;line-height:1.05}
.prose h3{font-size:20px;margin:36px 0 12px}
.prose p,.prose ul,.prose ol{margin:0 0 20px}
.prose li{margin-bottom:8px}
.prose a{text-decoration-color:var(--red);text-underline-offset:4px}
.prose strong{color:var(--ink)}
.prose blockquote{margin:30px 0;padding:6px 0 6px 24px;border-left:3px solid var(--gold);font-style:italic;font-size:22px;color:var(--ink)}
.byline{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:30px;font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.byline img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.article{padding:40px 0 120px}

/* 404 */
.e404{padding:120px 0 60px;text-align:center}
.e404 h1{font-size:clamp(120px,26vw,360px)}
.e404 .ctas{justify-content:center}

/* motion */
.js .rv{opacity:0;transform:translateY(36px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.75,.15,1);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
.ln{display:block;overflow:hidden;padding-bottom:.04em}
.ln>span{display:block}
.js .hero h1 .ln>span{animation:up 1.1s cubic-bezier(.2,.75,.15,1) both}
.js .hero h1 .ln:nth-child(2)>span{animation-delay:.1s}
.js .hero h1 .ln:nth-child(3)>span{animation-delay:.2s}
@keyframes up{from{transform:translateY(105%)}to{transform:none}}
.js .hero-fig{animation:figin 1.2s cubic-bezier(.2,.75,.15,1) .3s both}
@keyframes figin{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.bar{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:left;transform:scaleX(var(--sp,0));background:linear-gradient(90deg,var(--red),var(--gold));z-index:70;pointer-events:none}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
  mark.u{background-size:100% 2px}mark.g{background-size:100% 100%}
  .orb-mark path{stroke-dashoffset:0}
  .giant,.hero-word,.hero-fig .blk{transform:none!important}
}

/* fixes */
.top .mnav{display:none;height:auto;padding:8px 0 18px}
.top .mnav.open{display:block}
.hero.plain .hero-word{margin-top:56px}
.rows .r>div{grid-column:3}
@media (max-width:860px){.rows .r>div{grid-column:2}}

/* brand lockup card (replaces orb): basic, per brand guideline */
.brandcard{display:flex;align-items:center;justify-content:center;gap:24px;background:#FFFFFF;border:1px solid var(--rule);padding:64px 32px;min-height:300px}
.brandcard .orb-mark{width:150px;height:auto;filter:none;transform:none;flex:none}
.bc-rule{width:1px;height:76px;background:#DADADA;flex:none}
.bc-word{display:flex;flex-direction:column;gap:11px;line-height:1;font-family:var(--display);font-stretch:100%;font-weight:600}
.bc-word b{font-size:34px;letter-spacing:.3em;color:#131313;font-weight:600}
.bc-word i{font-style:normal;font-size:13.8px;letter-spacing:.78em;color:#A8741A}
@media (max-width:520px){.brandcard{gap:14px;padding:40px 16px;min-height:0}.brandcard .orb-mark{width:96px}.bc-rule{height:52px}.bc-word b{font-size:22px}.bc-word i{font-size:9px}}

/* glass service icons: frosted pane floating over a brand gradient shape */
.gi{position:relative;display:block;width:84px;height:84px;margin:22px 0 4px;perspective:400px}
.gi.big{width:132px;height:132px;margin:0 0 22px}
.gi i{position:absolute;display:block}
.gi-back{width:62%;height:62%;right:2%;top:4%;border-radius:28%;background:linear-gradient(135deg,#F3D27A 0%,#D9A632 45%,#A8741A 100%);box-shadow:0 14px 26px -12px rgba(168,116,26,.7);animation:gi-drift 6s ease-in-out infinite}
.gi-back2{width:30%;height:30%;left:2%;bottom:6%;border-radius:50%;background:linear-gradient(135deg,#FF6B6B 0%,#E62030 60%,#B5121B 100%);box-shadow:0 10px 18px -8px rgba(230,32,48,.6);animation:gi-drift2 7s ease-in-out infinite}
.gi-glass{inset:16% 18% 10% 8%;border-radius:24%;background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(255,255,255,.22));border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -10px 20px rgba(39,47,72,.08),0 18px 30px -18px rgba(39,47,72,.55);backdrop-filter:blur(9px) saturate(1.3);-webkit-backdrop-filter:blur(9px) saturate(1.3);display:grid!important;place-items:center;color:var(--navy);transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.75,.15,1);animation:gi-pane 6s ease-in-out infinite}
.gi-glass svg{width:46%;height:46%;filter:drop-shadow(0 1px 0 rgba(255,255,255,.8))}
.gi-glass::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 45%,transparent 60%);background-size:250% 100%;background-position:120% 0;animation:gi-shine 6s ease-in-out infinite}
.gi-web .gi-back{border-radius:50%}
.gi-gbp .gi-back{border-radius:50% 50% 50% 8%;transform:rotate(-45deg)}
.gi-pr .gi-back{width:70%;height:48%;top:10%;border-radius:22%}
.gi-wiki .gi-back{transform:rotate(8deg)}
.mgrid a:nth-child(2) .gi *{animation-delay:-1.5s}.mgrid a:nth-child(3) .gi *{animation-delay:-3s}.mgrid a:nth-child(4) .gi *{animation-delay:-4.5s}
a:hover .gi-glass{transform:translate(-4px,-5px) rotateX(10deg) rotateY(-12deg)}
a:hover .gi-back{translate:5px 3px}
@keyframes gi-drift{0%,100%{translate:0 0}50%{translate:4px -6px}}
@keyframes gi-drift2{0%,100%{translate:0 0}50%{translate:-3px 4px}}
@keyframes gi-pane{0%,100%{transform:translate(0,0) rotateX(0) rotateY(0)}50%{transform:translate(-2px,-3px) rotateX(6deg) rotateY(-8deg)}}
@keyframes gi-shine{0%,55%{background-position:120% 0}85%,100%{background-position:-60% 0}}
@media (prefers-reduced-motion: reduce){.gi *{animation:none!important}}

/* the signal: dark section, glowing 3D GK logo, scrambling headlines */
.signal{background:#0B0A09;color:var(--on);padding:130px 0;overflow:hidden;isolation:isolate}
.sig-grid{position:absolute;left:-20%;right:-20%;bottom:-10%;height:55%;z-index:-1;background-image:linear-gradient(rgba(217,166,50,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(217,166,50,.16) 1px,transparent 1px);background-size:56px 56px;transform:perspective(600px) rotateX(62deg);transform-origin:center top;mask-image:linear-gradient(to top,#000 10%,transparent 85%);-webkit-mask-image:linear-gradient(to top,#000 10%,transparent 85%);animation:sig-run 6s linear infinite}
@keyframes sig-run{to{background-position:0 56px,0 0}}
.signal-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.signal .eye{color:var(--gold)}
.signal h2{color:var(--on);font-size:clamp(42px,5.6vw,84px);margin-top:18px}
.signal h2 .scr:last-child{color:var(--gold)}
.signal p.l{color:var(--on-muted);font-size:19px;max-width:44ch;margin:26px 0 0}
.sig-list{list-style:none;margin:34px 0 0;padding:0;border-top:1px solid var(--rule-d)}
.sig-list li{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--rule-d)}
.sig-list b{font-family:var(--display);font-stretch:115%;font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:15px;color:var(--red)}
.sig-list span{color:var(--on-muted);font-size:17px}
.scr{font-variant-numeric:tabular-nums}
.x3-stage{position:relative;height:520px;display:grid;place-items:center;perspective:1100px}
.x3-glow{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(230,32,48,.55),rgba(217,166,50,.22) 45%,transparent 72%);filter:blur(30px);animation:x3-pulse 4s ease-in-out infinite}
.x3-obj{position:relative;width:min(380px,80%);aspect-ratio:140/92;transform-style:preserve-3d;animation:x3-spin 12s ease-in-out infinite}
.x3-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.x3-front{filter:drop-shadow(0 0 10px rgba(243,210,122,.55)) drop-shadow(0 0 28px rgba(230,32,48,.45))}
.x3-floor{position:absolute;bottom:40px;width:60%;height:40px;border-radius:50%;background:radial-gradient(closest-side,rgba(230,32,48,.45),transparent);filter:blur(10px);animation:x3-pulse 4s ease-in-out infinite}
@keyframes x3-spin{0%,100%{transform:rotateY(-32deg) rotateX(12deg) translateY(0)}50%{transform:rotateY(32deg) rotateX(4deg) translateY(-14px)}}
@keyframes x3-pulse{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@media (max-width:900px){.signal-in{grid-template-columns:minmax(0,1fr)}.x3-stage{height:360px;order:-1}.sig-list li{grid-template-columns:100px minmax(0,1fr)}}
@media (prefers-reduced-motion: reduce){.x3-obj{transform:rotateY(-18deg) rotateX(8deg)}}
.signal h2{font-size:clamp(38px,4.6vw,70px)}
.signal h2 .scr{display:inline-block;white-space:nowrap}

/* luntra style hero scene: glowing glass cube with the GK logo, drifting dark cubes */
.signal.lx{background:#060608;padding:0;min-height:min(820px,100svh);display:flex;align-items:flex-end}
.lx-scene{position:absolute;inset:0;overflow:hidden;perspective:1300px;perspective-origin:50% 42%}
.lx-light{position:absolute;width:70%;height:90%;top:-10%;filter:blur(60px);opacity:.75;pointer-events:none}
.lx-light.l{left:-25%;background:radial-gradient(closest-side,rgba(39,47,72,.95),rgba(80,92,150,.35) 50%,transparent 75%)}
.lx-light.r{right:-22%;background:radial-gradient(closest-side,rgba(230,32,48,.75),rgba(181,18,27,.35) 50%,transparent 75%);animation:lx-breathe 6s ease-in-out infinite}
.lx-world{position:absolute;left:50%;top:42%;width:0;height:0;transform-style:preserve-3d;animation:lx-drift 16s ease-in-out infinite}
/* cubes */
.lxc,.lx-glass{position:absolute;transform-style:preserve-3d}
.lxc{width:var(--s);height:var(--s);left:calc(var(--s) / -2);top:calc(var(--s) / -2);transform:translate3d(calc(var(--x) * 9),calc(var(--y) * 9),var(--z)) rotateX(var(--rx)) rotateY(var(--ry));animation:lx-float var(--d) ease-in-out infinite}
.lxc i{position:absolute;inset:0;border-radius:10%;background:linear-gradient(145deg,#1B1D27,#0A0A0E 70%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.lxc.r i{background:linear-gradient(145deg,#3A0C12,#120507 65%,#0A0A0E);box-shadow:inset 0 0 0 1px rgba(255,90,90,.12),inset -10px 0 30px rgba(230,32,48,.45)}
.lxc.l i{box-shadow:inset 0 0 0 1px rgba(160,175,230,.10),inset 10px 0 30px rgba(80,92,150,.35)}
.lxc .f0{transform:translateZ(calc(var(--s) / 2))}.lxc .f1{transform:rotateY(180deg) translateZ(calc(var(--s) / 2))}
.lxc .f2{transform:rotateY(90deg) translateZ(calc(var(--s) / 2))}.lxc .f3{transform:rotateY(-90deg) translateZ(calc(var(--s) / 2))}
.lxc .f4{transform:rotateX(90deg) translateZ(calc(var(--s) / 2))}.lxc .f5{transform:rotateX(-90deg) translateZ(calc(var(--s) / 2))}
/* glowing core */
.lx-core{position:absolute;left:0;top:0;transform-style:preserve-3d}
.lx-glass{--g:170px;width:var(--g);height:var(--g);left:calc(var(--g) / -2);top:calc(var(--g) / -2);animation:lx-spin 14s linear infinite}
.lx-glass i{position:absolute;inset:0;border-radius:8%;background:linear-gradient(135deg,rgba(255,120,120,.10),rgba(243,210,122,.06) 60%,rgba(255,255,255,.02));border:1.5px solid rgba(255,140,130,.85);box-shadow:0 0 18px rgba(230,32,48,.75),inset 0 0 26px rgba(230,32,48,.45),inset 0 0 4px rgba(255,220,200,.9)}
.lx-glass .f0{transform:translateZ(85px)}.lx-glass .f1{transform:rotateY(180deg) translateZ(85px)}.lx-glass .f2{transform:rotateY(90deg) translateZ(85px)}
.lx-glass .f3{transform:rotateY(-90deg) translateZ(85px)}.lx-glass .f4{transform:rotateX(90deg) translateZ(85px)}.lx-glass .f5{transform:rotateX(-90deg) translateZ(85px)}
.lx-orb{position:absolute;width:150px;height:150px;left:-75px;top:-75px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,240,220,.95),rgba(243,210,122,.55) 35%,rgba(230,32,48,.35) 60%,transparent 75%);filter:blur(8px);animation:lx-breathe 3.5s ease-in-out infinite}
.lx-logo{position:absolute;width:118px;height:auto;left:-59px;top:-39px;overflow:visible;filter:drop-shadow(0 0 6px rgba(255,240,220,.95)) drop-shadow(0 0 18px rgba(243,210,122,.8)) drop-shadow(0 0 36px rgba(230,32,48,.7));animation:lx-logo 14s ease-in-out infinite}
@keyframes lx-spin{from{transform:rotateX(-24deg) rotateY(0)}to{transform:rotateX(-24deg) rotateY(360deg)}}
@keyframes lx-logo{0%,100%{transform:translateZ(0) rotateY(-14deg)}50%{transform:translateZ(0) rotateY(14deg)}}
@keyframes lx-float{0%,100%{translate:0 0}50%{translate:0 -18px}}
@keyframes lx-drift{0%,100%{transform:rotateX(6deg) rotateY(-6deg)}50%{transform:rotateX(-2deg) rotateY(6deg)}}
@keyframes lx-breathe{0%,100%{opacity:.75;scale:1}50%{opacity:1;scale:1.08}}
/* copy */
.lx-copy{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:end;padding-top:420px;padding-bottom:80px}
.lx h2{color:#fff;font-stretch:100%;font-weight:600;text-transform:none;letter-spacing:-.02em;font-size:clamp(46px,6vw,88px);line-height:1}
.lx h2 .scr{display:inline-block;white-space:nowrap}
.lx-side p{color:rgba(255,255,255,.7);font-family:var(--display);font-stretch:100%;font-size:15px;line-height:1.6;max-width:42ch;margin:0}
.lx-side .ctas{margin-top:22px}
@media (max-width:860px){.lx-copy{grid-template-columns:minmax(0,1fr);padding-top:380px;padding-bottom:56px}.lx-world{top:30%;scale:.72}}
@media (prefers-reduced-motion: reduce){.lx *{animation:none!important}.lx-glass{transform:rotateX(-24deg) rotateY(35deg)}}

/* GMB three phone demo (Nixtio style): side screens cycle, map in the middle, radar interlude */
.gd{position:relative;overflow:hidden;background:#F1E9D4;padding:90px 0 110px;isolation:isolate}
.gd-rings{position:absolute;inset:0;display:grid;place-items:center;z-index:-1}
.gd-rings i{position:absolute;border:1px solid rgba(168,116,26,.22);border-radius:50%;width:calc(var(--n) * 260px);aspect-ratio:1}
.gd-rings i:nth-child(1){--n:1}.gd-rings i:nth-child(2){--n:2}.gd-rings i:nth-child(3){--n:3}.gd-rings i:nth-child(4){--n:4.2}
.gd-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:40px}
.gd-stage{position:relative;height:520px;display:flex;justify-content:center;align-items:center;gap:26px;font-family:var(--display);font-stretch:100%}
.ph{width:236px;height:488px;border-radius:36px;background:#fff;box-shadow:0 40px 70px -40px rgba(19,19,19,.45),0 0 0 6px rgba(255,255,255,.6);overflow:hidden;position:relative;transition:transform .9s cubic-bezier(.7,0,.2,1),opacity .7s ease}
.ph-m{z-index:2;transform:translateY(-10px)}
.ph-in{position:absolute;inset:0;overflow:hidden}
.gd .sc{position:absolute;inset:0;padding:16px 14px;background:#fff;transform:translateX(105%);transition:transform .8s cubic-bezier(.7,0,.2,1)}
.gd[data-x] .sc{transition:none}
.gd .ph-l .sc{transform:translateX(-105%)}
.pbar{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#67635B;margin:6px 0 12px}
.pbar b{color:#131313;font-size:13px}
/* state switching */
.gd-stage[data-s="0"] .s0,.gd-stage[data-s="1"] .s1,.gd-stage[data-s="2"] .s2{transform:none}
.gd-stage[data-s="1"] .ph-l .s0,.gd-stage[data-s="2"] .ph-l .s0,.gd-stage[data-s="2"] .ph-l .s1{transform:translateX(105%)}
.gd-stage[data-s="1"] .ph-r .s0,.gd-stage[data-s="2"] .ph-r .s0,.gd-stage[data-s="2"] .ph-r .s1{transform:translateX(-105%)}
/* left: profile */
.cover{height:120px;border-radius:18px;background:linear-gradient(135deg,#272F48,#3B4566 55%,#A8741A);position:relative;overflow:hidden}
.cover::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 30%,rgba(243,210,122,.6),transparent 45%)}
.cv-pin{position:absolute;left:50%;top:50%;width:30px;margin:-20px 0 0 -15px;z-index:1}
.cv-pin svg,.mp svg,.you svg{display:block;width:100%;fill:var(--red)}
.sheet{margin-top:-18px;position:relative;background:#fff;border-radius:18px 18px 0 0;padding:14px 4px 0}
.sheet h4{font-size:16px;font-weight:700;text-transform:none;font-stretch:100%;letter-spacing:0}
.cat{font-size:11px;color:#1E7A45;margin:4px 0 6px}
.rt{font-size:12px;margin:0;color:#131313}.st{color:#E0A800;letter-spacing:1px}
.acts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
.acts span{font-size:9.5px;text-align:center;padding:8px 2px;border-radius:12px;background:#F4EFE3;color:#272F48;font-weight:600}
.acts .a1{background:var(--red);color:#fff;animation:gd-press 3s ease-in-out infinite}
.ph-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}
.ph-photos i{display:block;height:58px;border-radius:12px;background:linear-gradient(135deg,#EDE3CC,#D9A632)}
.ph-photos i:nth-child(2){background:linear-gradient(135deg,#E9EBF1,#272F48)}.ph-photos i:nth-child(3){background:linear-gradient(135deg,#FBE3E3,#E62030)}
.big-rt{display:flex;align-items:center;gap:12px;padding:10px 0 14px;border-bottom:1px solid #EEE}
.big-rt>b{font-size:40px;font-weight:800;color:#131313}.big-rt small{display:block;font-size:10px;color:#67635B}
.rv-list{list-style:none;margin:0;padding:0}
.rv-list li{display:grid;grid-template-columns:30px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid #F1F1F1;opacity:0;transform:translateY(14px);transition:opacity .5s,transform .6s}
.gd-stage[data-s="1"] .rv-list li{opacity:1;transform:none}
.rv-list li:nth-child(2){transition-delay:.25s}.rv-list li:nth-child(3){transition-delay:.5s}
.av{width:30px;height:30px;border-radius:50%;background:#D9A632}.av.b{background:#272F48}.av.c{background:#E62030}
.rv-list b{font-size:11px;color:#131313;margin-right:6px}.rv-list .st{font-size:9px}.rv-list p{margin:2px 0 0;font-size:10.5px;color:#67635B;line-height:1.35}
.reply{margin-top:12px;font-size:10px;padding:8px 10px;border-radius:10px;background:#FDF6E6;color:#A8741A;font-weight:600}
.post{border-radius:18px;border:1px solid #EEE;overflow:hidden}
.post-img{height:130px;background:linear-gradient(135deg,#E62030,#B5121B 55%,#D9A632);color:#fff;padding:14px;display:flex;flex-direction:column;justify-content:flex-end}
.post-img b{font-size:18px}.post-img small{font-size:11px;opacity:.9}
.post p{font-size:11px;color:#2B2A28;margin:10px 12px;line-height:1.4}
.btn-mini{display:inline-block;margin:0 12px 12px;font-size:10px;font-weight:700;padding:7px 14px;border-radius:999px;background:#272F48;color:#fff}
.toast{margin-top:14px;font-size:10.5px;padding:10px 12px;border-radius:12px;background:#E7F4EC;color:#1E7A45;font-weight:600;transform:translateY(20px);opacity:0;transition:all .6s .9s}
.gd-stage[data-s="2"] .toast{transform:none;opacity:1}
/* middle: map pack */
.map{background:#EEF0F3}
.map-top{position:absolute;left:12px;right:12px;top:14px;z-index:3;background:#fff;border-radius:999px;padding:9px 14px;display:flex;justify-content:space-between;font-size:10.5px;box-shadow:0 6px 18px -10px rgba(0,0,0,.35)}
.map-top b{color:#131313}.map-top span{color:#67635B}
.roads i{position:absolute;background:#fff;border-radius:4px}
.r1{left:-20%;right:-20%;top:34%;height:12px;transform:rotate(-14deg)}.r2{left:-20%;right:-20%;top:58%;height:9px;transform:rotate(9deg)}
.r3{top:-10%;bottom:-10%;left:38%;width:10px;transform:rotate(8deg)}.r4{top:-10%;bottom:-10%;left:72%;width:7px;transform:rotate(-6deg)}
.roads::before{content:"";position:absolute;left:8%;top:62%;width:34%;height:16%;border-radius:20px;background:#D9EDD9}
.mp{position:absolute;width:20px;z-index:2;transform:translateY(-30px) scale(.4);opacity:0;transition:transform .6s cubic-bezier(.3,1.6,.5,1),opacity .4s}
.mp svg{fill:#9AA1B0}
.mp.p1{left:20%;top:26%}.mp.p2{left:68%;top:22%;transition-delay:.15s}.mp.p3{left:76%;top:46%;transition-delay:.3s}
.mp.me{left:44%;top:38%;width:30px;transition-delay:.5s}.mp.me svg{fill:var(--red);filter:drop-shadow(0 6px 8px rgba(230,32,48,.45))}
.gd-stage[data-s="0"] .mp,.gd-stage[data-s="1"] .mp,.gd-stage[data-s="2"] .mp{transform:none;opacity:1}
.mp.me::after{content:"";position:absolute;left:50%;top:40%;width:60px;height:60px;margin:-30px;border-radius:50%;border:2px solid rgba(230,32,48,.5);animation:gd-ping 2s ease-out infinite}
.pack{position:absolute;left:10px;right:10px;bottom:12px;z-index:3;display:grid;gap:6px}
.pc{display:grid;grid-template-columns:20px 1fr auto;gap:8px;align-items:center;background:#fff;border-radius:14px;padding:8px 10px;box-shadow:0 8px 20px -14px rgba(0,0,0,.4);font-size:10px;color:#67635B;transform:translateY(30px);opacity:0;transition:transform .6s,opacity .5s}
.pc b{font-size:12px;color:#A8741A}.pc strong{display:block;font-size:11.5px;color:#131313}
.pc.me{border:1.5px solid var(--red)}.pc.me em{font-style:normal;color:#131313;font-weight:700}
.pc .cta-dot{font-size:9.5px;font-weight:700;background:var(--red);color:#fff;padding:5px 9px;border-radius:999px}
.gd-stage[data-s="0"] .pc,.gd-stage[data-s="1"] .pc,.gd-stage[data-s="2"] .pc{transform:none;opacity:1}
.pc:nth-child(2){transition-delay:.12s}.pc:nth-child(3){transition-delay:.24s}
/* right: insights */
.tabs{display:flex;gap:6px;margin-bottom:12px}.tabs span{flex:1;text-align:center;font-size:10.5px;padding:7px;border-radius:999px;background:#F4EFE3;color:#67635B;font-weight:600}.tabs .on{background:#272F48;color:#fff}
.donut,.ring{position:relative;width:150px;height:150px;margin:6px auto 10px}
.donut svg,.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.trk{fill:none;stroke:#F1E9D4;stroke-width:14}
.val{fill:none;stroke:url(#none);stroke:#D9A632;stroke-width:14;stroke-linecap:round;stroke-dasharray:0 100;transition:stroke-dasharray 1.4s cubic-bezier(.2,.75,.15,1) .3s}
.ring .val{stroke:var(--red)}
.gd-stage[data-s="0"] .donut .val{stroke-dasharray:68 100}
.gd-stage[data-s="2"] .ring .val{stroke-dasharray:82 100}
.donut>div,.ring>div{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.donut b,.ring b{font-size:28px;font-weight:800;color:#131313}.donut small,.ring small{font-size:10px;color:#67635B}
.bars{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:10px}
.bars li{display:grid;grid-template-columns:58px 1fr 34px;gap:8px;align-items:center;font-size:10.5px;color:#2B2A28}
.bars i{display:block;height:8px;border-radius:999px;background:linear-gradient(90deg,#A8741A,#D9A632);width:0;transition:width 1.1s cubic-bezier(.2,.75,.15,1) .4s}
.bars li:nth-child(2) i{background:linear-gradient(90deg,#272F48,#5C6788)}.bars li:nth-child(3) i{background:linear-gradient(90deg,#B5121B,#E62030)}
.bars em{font-style:normal;font-weight:700;color:#131313;text-align:right}
.bars.tall{gap:16px;margin-top:20px}.bars.tall i{height:12px}
.gd-stage[data-s="0"] .s0 .bars i,.gd-stage[data-s="1"] .s1 .bars i{width:var(--w)}
.up{margin-top:22px;font-size:11px;font-weight:700;color:#1E7A45;text-align:center}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.kpis div{background:#F4EFE3;border-radius:12px;padding:10px 4px;text-align:center}.kpis b{display:block;font-size:16px;color:#131313}.kpis small{font-size:9px;color:#67635B}
/* radar interlude */
.radar{position:absolute;left:50%;top:50%;width:236px;height:488px;margin:-244px 0 0 -118px;border-radius:36px;background:#272F48;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:22px 14px 26px;color:#fff;opacity:0;transform:scale(.85);pointer-events:none;transition:opacity .6s,transform .8s cubic-bezier(.7,0,.2,1)}
.radar p{margin:0;font-size:13px;font-weight:700}.radar small{font-size:10.5px;color:rgba(255,255,255,.7)}
.rd{position:relative;width:200px;height:200px}
.rd .ring1,.rd .ring2,.rd .ring3{position:absolute;border:1px solid rgba(243,210,122,.25);border-radius:50%;inset:0}
.rd .ring2{inset:30px}.rd .ring3{inset:62px}
.sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(217,166,50,.55),transparent 22%);animation:gd-spin 2.4s linear infinite}
.you{position:absolute;left:50%;top:50%;width:26px;margin:-26px 0 0 -13px}
.dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#F3D27A;box-shadow:0 0 0 4px rgba(243,210,122,.25);transform:scale(0);transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.d1{left:20%;top:24%}.d2{left:74%;top:18%}.d3{left:82%;top:60%}.d4{left:14%;top:66%}.d5{left:56%;top:84%}.d6{left:40%;top:10%}
.gd-stage[data-s="3"] .radar{opacity:1;transform:none}
.gd-stage[data-s="3"] .dot{transform:scale(1)}
.gd-stage[data-s="3"] .d2{transition-delay:.3s}.gd-stage[data-s="3"] .d3{transition-delay:.6s}.gd-stage[data-s="3"] .d4{transition-delay:.9s}.gd-stage[data-s="3"] .d5{transition-delay:1.2s}.gd-stage[data-s="3"] .d6{transition-delay:1.5s}
.gd-stage[data-s="3"] .ph-l{transform:translateX(120px) scale(.9);opacity:0}
.gd-stage[data-s="3"] .ph-r{transform:translateX(-120px) scale(.9);opacity:0}
.gd-stage[data-s="3"] .ph-m{transform:scale(.92);opacity:0}
@keyframes gd-ping{from{transform:scale(.3);opacity:1}to{transform:scale(1.4);opacity:0}}
@keyframes gd-spin{to{transform:rotate(360deg)}}
@keyframes gd-press{0%,70%,100%{transform:none}78%{transform:scale(.9)}86%{transform:none}}
@media (max-width:860px){.gd-stage{height:auto;flex-direction:column;gap:22px}.ph-l,.ph-r{display:none}.radar{top:50%}.gd-stage[data-s="3"] .ph-m{opacity:0}}
@media (prefers-reduced-motion: reduce){.gd *{transition:none!important;animation:none!important}}

/* services dropdown */
.dd{position:relative;display:flex;align-items:center}
.dd>a{padding-right:4px}
.dd-btn{background:none;border:0;color:var(--text);width:28px;height:44px;display:grid;place-items:center;cursor:pointer;padding:0;transition:transform .3s}
.dd:hover .dd-btn,.dd.open .dd-btn{transform:rotate(180deg)}
.dd-menu{position:absolute;top:calc(100% + 6px);left:-14px;width:300px;background:#fff;border:1px solid var(--rule);box-shadow:0 30px 50px -30px rgba(19,19,19,.5);padding:8px;display:grid;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .3s,visibility .3s;z-index:80}
.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.dd:hover .dd-menu,.dd:focus-within .dd-menu,.dd.open .dd-menu{opacity:1;visibility:visible;transform:none}
.nav .dd-menu a{display:block;padding:12px 14px;text-transform:none;letter-spacing:0;font-size:14px;font-weight:700;color:var(--ink);border-left:2px solid transparent}
.nav .dd-menu a::after{display:none}
.nav .dd-menu a span{display:block;margin-top:3px;font-family:var(--serif);font-style:italic;font-weight:400;font-size:14px;color:var(--muted)}
.nav .dd-menu a:hover,.nav .dd-menu a:focus{background:var(--paper);border-left-color:var(--red)}
.nav .dd-menu .dd-all{margin-top:4px;border-top:1px solid var(--rule);font-family:var(--display);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--red-ink)}

/* simple brand icons (replace glass icons) */
.gi2{display:grid;place-items:center;width:56px;height:56px;margin:22px 0 4px;border:1.5px solid var(--ink);color:var(--ink);position:relative;transition:background .3s,color .3s}
.gi2::after{content:"";position:absolute;right:-6px;top:-6px;width:12px;height:12px;background:var(--gold-d)}
.gi2 svg{width:26px;height:26px}
.gi2.big{width:72px;height:72px;margin:0 0 22px}.gi2.big svg{width:32px;height:32px}
.mgrid a:hover .gi2{background:var(--ink);color:var(--on)}

/* transparent cutout portrait */
.hero-fig img[src*="cutout"]{object-fit:contain;object-position:center bottom;filter:drop-shadow(0 30px 40px rgba(19,19,19,.25))}
.hero-fig img{height:auto}
.hero-fig .blk{background:var(--navy)}
.hero-fig .blk.g{background:var(--gold)}
.hero-word{margin-top:48px}
.hero-fig .blk{bottom:46px}

/* dropdown text matches the brand lockup: spaced capitals, one sans family */
.nav .dd-menu a{font-family:var(--display);font-stretch:100%;font-weight:600;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#131313}
.nav .dd-menu a b{font-weight:600}
.nav .dd-menu a span{font-family:var(--display);font-style:normal;font-weight:500;font-size:12px;letter-spacing:.02em;text-transform:none;color:var(--muted);margin-top:5px}
.nav .dd-menu .dd-all{color:var(--gold-d)}

/* animated service icons: line art in brand ink, gold and red, looping */
.gx{display:block;width:76px;height:76px;margin:20px 0 6px}
.gx.big{width:104px;height:104px;margin:0 0 20px}
.gx svg{width:100%;height:100%;overflow:visible}
.gx .ln{stroke:#131313;stroke-width:2;stroke-dasharray:1;stroke-dashoffset:1;animation:gx-draw 1.2s cubic-bezier(.65,0,.35,1) forwards}
.gx [class^="w"]{stroke:#A8741A;stroke-width:2.4;stroke-dasharray:1;stroke-dashoffset:1;animation:gx-write 4.8s ease-in-out infinite}
.gx .w2{animation-delay:.25s}.gx .w3{animation-delay:.5s}.gx .w4{animation-delay:.75s}
@keyframes gx-draw{to{stroke-dashoffset:0}}
@keyframes gx-write{0%,10%{stroke-dashoffset:1}35%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:-1}}
/* wikipedia */
.gx .stamp{transform-origin:50px 52px;animation:gx-stamp 4.8s cubic-bezier(.3,1.6,.5,1) infinite}
.fill-gold{fill:#D9A632}
.gx .ck{stroke:#131313;stroke-width:2.4;stroke-dasharray:1;stroke-dashoffset:1;animation:gx-ck 4.8s ease infinite}
@keyframes gx-stamp{0%,40%{transform:scale(0)}50%,85%{transform:scale(1)}95%,100%{transform:scale(0)}}
@keyframes gx-ck{0%,50%{stroke-dashoffset:1}62%,85%{stroke-dashoffset:0}95%,100%{stroke-dashoffset:1}}
/* website */
.dotf{fill:#C3141F}
.gx .b1{fill:#131313;transform-origin:13px 29px;animation:gx-grow 4.8s ease infinite}
.gx .b2{fill:#D7CFBE;transform-origin:13px 35px;animation:gx-grow 4.8s ease .2s infinite}
.gx .btn-r{fill:#E62030;transform-origin:21px 44px;animation:gx-press 4.8s ease infinite}
.gx .cur{fill:#131313;stroke:#fff;stroke-width:1.2}
.gx .cursor{animation:gx-cursor 4.8s cubic-bezier(.6,0,.3,1) infinite}
.gx .ripple{fill:none;stroke:#E62030;stroke-width:1.5;transform-origin:21px 44px;opacity:0;animation:gx-ripple 4.8s ease-out infinite}
@keyframes gx-grow{0%,8%{transform:scaleX(0)}25%,90%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes gx-cursor{0%,30%{transform:translate(0,0)}52%,62%{transform:translate(-18px,-6px)}85%,100%{transform:translate(0,0)}}
@keyframes gx-press{0%,52%{transform:scale(1)}56%{transform:scale(.86)}62%,100%{transform:scale(1)}}
@keyframes gx-ripple{0%,54%{opacity:0;transform:scale(1)}58%{opacity:1}78%,100%{opacity:0;transform:scale(4)}}
/* google business profile */
.gx .grid{stroke:#131313;stroke-width:1.6}
.gx .pinf{fill:#E62030}.gx .pinc{fill:#fff}
.gx .pin{animation:gx-pin 4.8s cubic-bezier(.3,1.5,.5,1) infinite}
.gx .ring{fill:none;stroke:#A8741A;stroke-width:1.5;transform-origin:32px 44px;opacity:0;animation:gx-ring 2.4s ease-out infinite}
.gx .ring.r2{animation-delay:1.2s}
.gx .stars path{fill:#D9A632;transform-box:fill-box;transform-origin:center;transform:scale(0);animation:gx-star 4.8s cubic-bezier(.3,1.6,.5,1) infinite}
.gx .stars .s2{animation-delay:.3s}
@keyframes gx-pin{0%{transform:translateY(-22px);opacity:0}14%{transform:none;opacity:1}20%{transform:translateY(-4px)}26%,88%{transform:none;opacity:1}100%{transform:translateY(-22px);opacity:0}}
@keyframes gx-ring{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(2.2)}}
@keyframes gx-star{0%,30%{transform:scale(0) rotate(-40deg)}42%,85%{transform:scale(1) rotate(0)}95%,100%{transform:scale(0)}}
/* pr */
.gx .mast{fill:#131313;transform-origin:15px 20px;animation:gx-grow 4.8s ease infinite}
.gx .spark path{stroke:#D9A632;stroke-width:2.2;transform-box:fill-box;transform-origin:center;animation:gx-spark 2.4s ease-in-out infinite}
.gx .spark path:nth-child(2){animation-delay:.6s}
@keyframes gx-spark{0%,100%{transform:scale(.4) rotate(0);opacity:.2}50%{transform:scale(1.15) rotate(45deg);opacity:1}}
/* stagger + hover */
.mgrid a:nth-child(2) .gx *{animation-delay:-1.2s}.mgrid a:nth-child(3) .gx *{animation-delay:-2.4s}.mgrid a:nth-child(4) .gx *{animation-delay:-3.6s}
.mgrid a .gx .ln{animation-delay:0s!important}
.mgrid a:hover .gx svg{transform:scale(1.08) rotate(-3deg);transition:transform .4s cubic-bezier(.2,.75,.15,1)}
@media (prefers-reduced-motion: reduce){.gx *{animation:none!important;stroke-dashoffset:0!important;transform:none!important;opacity:1!important}}

/* ===== hub: one GK core wired to every service ===== */
.hub{padding:130px 0 90px;overflow:hidden;background:var(--paper)}
.hub-stage{width:min(1180px,100% - 32px);margin:56px auto 0;perspective:1600px}
.hub-plane{position:relative;aspect-ratio:1000/680;transform:rotateX(16deg);transform-origin:50% 60%;border-radius:28px;
  background:radial-gradient(120% 90% at 50% 40%,#FBF9F4 0,#F1ECE2 70%,#E9E2D5 100%);box-shadow:inset 0 0 0 1px rgba(19,19,19,.06);transition:transform .6s cubic-bezier(.2,.75,.15,1)}
.hub-plane::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,transparent 0 58%,rgba(255,255,255,.6) 58% 70%,transparent 70%)}
.hub-dots{position:absolute;inset:0;border-radius:inherit;opacity:.75;
  background-image:radial-gradient(circle,rgba(168,116,26,.55) 1px,transparent 1.6px),radial-gradient(circle,rgba(19,19,19,.18) 1px,transparent 1.5px);
  background-size:26px 26px,13px 13px;background-position:0 0,6px 7px;
  -webkit-mask:radial-gradient(60% 55% at 50% 45%,#000 0,transparent 100%);mask:radial-gradient(60% 55% at 50% 45%,#000 0,transparent 100%);animation:hub-twinkle 6s ease-in-out infinite}
@keyframes hub-twinkle{50%{opacity:.4}}
.hub-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hub .cb{fill:none;stroke:#D6CDBC;stroke-width:15;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 6px 5px rgba(19,19,19,.14))}
.hub .cb-in{fill:none;stroke:#FBF8F2;stroke-width:8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.hub .pl{fill:none;stroke:var(--gold);stroke-width:7;stroke-linecap:round;stroke-dasharray:.1 1.2;stroke-dashoffset:.1;opacity:0;filter:drop-shadow(0 0 6px rgba(217,166,50,.9))}
.hub-cards,.hub-tiles{list-style:none;margin:0;padding:0}
.hc,.ht{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%) translateY(26px) scale(.86);opacity:0}
.hc{display:flex;align-items:center;gap:10px;white-space:nowrap;padding:14px 20px;border-radius:14px;background:#fff;
  font-family:var(--display);font-stretch:110%;font-weight:700;font-size:clamp(9px,1.25vw,14px);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
  box-shadow:0 0 0 1px rgba(168,116,26,.35),0 14px 0 -6px #EFE9DD,0 14px 0 -5px rgba(168,116,26,.3),0 22px 28px -12px rgba(19,19,19,.3)}
.hc-ic{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--paper-2);color:var(--gold-d)}
.hc-ic svg{width:16px;height:16px}
.ht{display:flex;flex-direction:column;align-items:center;gap:10px;width:9.6%}
.ht-box{display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:18%;background:#fff;
  box-shadow:0 0 0 1px rgba(19,19,19,.08),0 10px 0 -3px #E6DECF,0 18px 24px -10px rgba(19,19,19,.35);transition:box-shadow .5s}
.ht .gx{width:66%;height:66%;margin:0}
.hx svg path,.hx svg circle{stroke-width:2.6}
.hx .hl{stroke:#131313}.hx .hg{stroke:#A8741A}
.ht-l{font-family:var(--display);font-stretch:110%;font-weight:600;font-size:clamp(7px,1vw,11px);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.hub-core{position:absolute;left:var(--x);top:var(--y);width:19%;aspect-ratio:1;transform:translate(-50%,-50%) translateY(-40px) scale(.7);opacity:0}
.hub-core>span{position:absolute;inset:0;border-radius:50%}
.hub-sh{transform:translate(9%,18%) scale(1.04);background:radial-gradient(closest-side,rgba(19,19,19,.38),transparent);filter:blur(6px)}
.hub-side{transform:translateY(11%);background:linear-gradient(90deg,#141A2C,#272F48 40%,#1A2136);box-shadow:0 0 40px rgba(217,166,50,.25)}
.hub-top{display:grid;place-items:center;background:radial-gradient(circle at 38% 30%,#3A4566 0,#272F48 46%,#1B2134 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.12)}
.hub-ring{position:absolute;inset:7%;border-radius:50%;border:clamp(2px,.5vw,5px) solid var(--gold);box-shadow:0 0 18px rgba(217,166,50,.8),inset 0 0 14px rgba(217,166,50,.5)}
.hub-logo{width:58%;filter:drop-shadow(0 3px 0 #10152A)}
/* timeline once in view */
.hub-stage.on .hub-core{animation:hub-drop .9s cubic-bezier(.3,1.4,.5,1) forwards}
.hub-stage.on .hc{animation:hub-pop .7s cubic-bezier(.3,1.5,.5,1) forwards;animation-delay:calc(.5s + var(--i)*.1s)}
.hub-stage.on .ht{animation:hub-pop .7s cubic-bezier(.3,1.5,.5,1) forwards;animation-delay:calc(.7s + var(--i)*.07s)}
.hub-stage.on .cb,.hub-stage.on .cb-in{animation:hub-wire 1.1s cubic-bezier(.65,0,.35,1) forwards;animation-delay:calc(1.3s + var(--i)*.05s)}
.hub-stage.on .pl{animation:hub-up 2.6s cubic-bezier(.55,0,.45,1) infinite;animation-delay:calc(2.6s + var(--t))}
.hub-stage.on .pl.down{animation-name:hub-down}
.hub-stage.on .hub-ring{animation:hub-pulse 1.3s ease-in-out 2.6s infinite}
.hub-stage.on .ht-box{animation:hub-glow 2.6s ease-in-out infinite;animation-delay:calc(2.6s + var(--i)*.37s)}
@keyframes hub-drop{to{opacity:1;transform:translate(-50%,-50%)}}
@keyframes hub-pop{to{opacity:1;transform:translate(-50%,-50%)}}
@keyframes hub-wire{to{stroke-dashoffset:0}}
@keyframes hub-up{0%{stroke-dashoffset:-1;opacity:0}10%{opacity:1}85%{opacity:1}100%{stroke-dashoffset:.1;opacity:0}}
@keyframes hub-down{0%{stroke-dashoffset:.1;opacity:0}10%{opacity:1}85%{opacity:1}100%{stroke-dashoffset:-1;opacity:0}}
@keyframes hub-pulse{50%{box-shadow:0 0 34px rgba(243,210,122,1),inset 0 0 22px rgba(243,210,122,.8);border-color:var(--gold-l)}}
@keyframes hub-glow{0%,100%{box-shadow:0 0 0 1px rgba(19,19,19,.08),0 10px 0 -3px #E6DECF,0 18px 24px -10px rgba(19,19,19,.35)}
  12%{box-shadow:0 0 0 2px var(--gold),0 10px 0 -3px #E6DECF,0 0 22px rgba(217,166,50,.65),0 18px 24px -10px rgba(19,19,19,.35)}}
@media (max-width:700px){.hub{padding:90px 0 60px}.hub-stage{width:calc(100% - 16px);margin-top:36px}.hub-plane{transform:rotateX(10deg)}.hc{padding:7px 9px;gap:5px;border-radius:9px;letter-spacing:.06em}.hc-ic{width:16px;height:16px;border-radius:5px}.hc-ic svg{width:10px;height:10px}.ht-l{display:none}.hc{box-shadow:0 0 0 1px rgba(168,116,26,.35),0 8px 14px -8px rgba(19,19,19,.3)}.ht-box{border-radius:22%}.hub .cb{stroke-width:11}}
@media (prefers-reduced-motion: reduce){.hub-core,.hc,.ht{opacity:1!important;transform:translate(-50%,-50%)!important;animation:none!important}.hub .cb,.hub .cb-in{stroke-dashoffset:0!important;animation:none!important}.hub .pl{display:none}}

/* ===== trust monitor: glass dashboard with a camera that tours each service ===== */
.tm{padding:120px 0 90px;background:var(--paper)}
.tm-frame{margin-top:52px;container-type:inline-size;box-shadow:0 30px 60px -30px rgba(19,19,19,.45)}
.tm-cam{--u:calc(100cqw / 1200);position:relative;aspect-ratio:1200/760;border-radius:calc(var(--u)*28);overflow:hidden;isolation:isolate;
  font-family:var(--sans,system-ui),sans-serif;color:var(--ink)}
.tm-cam>*{position:absolute}
.tm-bg{inset:0;background:radial-gradient(90% 80% at 50% 45%,#36405F 0,#272F48 45%,#161B2B 100%);z-index:-1;overflow:hidden}
.tm-bg span{position:absolute;border-radius:50%;filter:blur(calc(var(--u)*60));opacity:.55;animation:tm-drift 14s ease-in-out infinite alternate}
.tm-bg .b1{width:40%;height:50%;left:30%;top:20%;background:#D9A632;opacity:.35}
.tm-bg .b2{width:30%;height:40%;left:-5%;top:55%;background:#E62030;opacity:.22;animation-delay:-5s}
.tm-bg .b3{width:30%;height:40%;right:-6%;top:-8%;background:#F3D27A;opacity:.25;animation-delay:-9s}
@keyframes tm-drift{to{transform:translate(8%,-6%) scale(1.15)}}
.tm-world{position:absolute;inset:0}
/* camera */
.tm-cam{transform-origin:0 0}
.tm.on .tm-cam{animation:tm-cam 26s cubic-bezier(.65,0,.35,1) 1.2s infinite}
.tm-frame{overflow:hidden;border-radius:calc(100cqw / 1200 * 28)}
.tm-frame:hover .tm-cam{animation-play-state:paused}
@keyframes tm-cam{
  0%,10%{transform:translate(0,0) scale(1)}
  15%,26%{transform:translate(0,-7%) scale(1.75)}
  31%,42%{transform:translate(0,-75%) scale(1.75)}
  47%,57%{transform:translate(-30%,-30%) scale(1.6)}
  62%,72%{transform:translate(-75%,-10%) scale(1.75)}
  77%,87%{transform:translate(-75%,-75%) scale(1.75)}
  93%,100%{transform:translate(0,0) scale(1)}}
/* shared card */
.tm-top{left:calc(var(--u)*40);top:calc(var(--u)*26);right:calc(var(--u)*40);height:calc(var(--u)*46);display:flex;align-items:center;gap:calc(var(--u)*16);
  padding:0 calc(var(--u)*20);border-radius:calc(var(--u)*14);background:rgba(251,249,244,.1);border:1px solid rgba(251,249,244,.14);color:#F7F4EE;
  font-size:calc(var(--u)*13);letter-spacing:.04em}
.tm-top span{font-family:var(--display);font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-l);font-size:calc(var(--u)*11)}
.tm-top em{margin-left:auto;font-style:normal;opacity:.6}
.tm-card{background:rgba(251,249,244,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:calc(var(--u)*22);padding:calc(var(--u)*20);
  box-shadow:0 calc(var(--u)*20) calc(var(--u)*40) calc(var(--u)*-18) rgba(0,0,0,.55),inset 0 1px 0 #fff;opacity:0;transform:translateY(calc(var(--u)*30))}
.tm.on .tm-card,.tm.on .tm-dock,.tm.on .tm-core>*{animation:tm-in .8s cubic-bezier(.2,.75,.15,1) forwards}
.tm.on .c2{animation-delay:.12s}.tm.on .c3{animation-delay:.24s}.tm.on .c4{animation-delay:.32s}.tm.on .c5{animation-delay:.4s}.tm.on .tm-dock{animation-delay:.55s}
@keyframes tm-in{to{opacity:1;transform:none}}
.tm-card header{display:flex;justify-content:space-between;align-items:center;font-family:var(--display);font-weight:700;font-size:calc(var(--u)*12);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.tm-more{letter-spacing:.1em;color:var(--ink)}
.tm-card h3{font-family:var(--display);font-stretch:100%;text-transform:none;font-size:calc(var(--u)*30);font-weight:700;letter-spacing:-.02em;margin:calc(var(--u)*14) 0 calc(var(--u)*16);display:flex;align-items:center;gap:calc(var(--u)*10)}
.tm-up{font-size:calc(var(--u)*12);font-weight:700;color:var(--gold-d);background:#F6EBCF;padding:calc(var(--u)*4) calc(var(--u)*9);border-radius:99px}
.tm-card footer{display:flex;justify-content:space-between;align-items:baseline;font-size:calc(var(--u)*14);color:var(--muted);margin-top:calc(var(--u)*14)}
.tm-card footer b{color:var(--ink);font-size:calc(var(--u)*15)}
.c1{left:calc(var(--u)*40);top:calc(var(--u)*96);width:calc(var(--u)*330);height:calc(var(--u)*300)}
.c2{left:calc(var(--u)*40);top:calc(var(--u)*416);width:calc(var(--u)*330);height:calc(var(--u)*300)}
.c3{left:calc(var(--u)*830);top:calc(var(--u)*96);width:calc(var(--u)*330);height:calc(var(--u)*220)}
.c4{left:calc(var(--u)*830);top:calc(var(--u)*336);width:calc(var(--u)*330);height:calc(var(--u)*110);display:flex;align-items:center;gap:calc(var(--u)*14)}
.c5{left:calc(var(--u)*830);top:calc(var(--u)*466);width:calc(var(--u)*330);height:calc(var(--u)*250)}
/* c1 */
.tm-tabs{display:flex;gap:calc(var(--u)*6);margin-top:calc(var(--u)*14)}
.tm-tabs i{font-style:normal;font-size:calc(var(--u)*12);padding:calc(var(--u)*6) calc(var(--u)*11);border-radius:calc(var(--u)*9);background:#EFE9DD;color:var(--muted)}
.tm.on .tm-tabs i{animation:tm-tab 8s steps(1) infinite}
.tm-tabs i:nth-child(2){animation-delay:-6s!important}.tm-tabs i:nth-child(3){animation-delay:-4s!important}.tm-tabs i:nth-child(4){animation-delay:-2s!important}
.tm-tabs i.on{background:var(--gold);color:var(--ink)}
@keyframes tm-tab{0%{background:var(--gold);color:var(--ink)}25%,100%{background:#EFE9DD;color:var(--muted)}}
.tm-ticks{position:relative;height:calc(var(--u)*58);background:linear-gradient(90deg,#E62030,#D9A632 55%,#F3D27A);
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 calc(var(--u)*4),transparent calc(var(--u)*4) calc(var(--u)*8.2));mask:repeating-linear-gradient(90deg,#000 0 calc(var(--u)*4),transparent calc(var(--u)*4) calc(var(--u)*8.2))}
.tm-ticks i{display:none}
.tm-ticks::after{content:"";position:absolute;top:0;right:0;bottom:0;width:100%;background:#E4DCCB}
.tm.on .tm-ticks::after{animation:tm-fill 2s cubic-bezier(.65,0,.35,1) .6s forwards}
@keyframes tm-fill{to{width:13%}}
/* c2 */
.tm-row{display:flex;justify-content:space-between;align-items:center;font-size:calc(var(--u)*13);color:var(--muted);margin:calc(var(--u)*14) 0 0}
.tm-ai{font-size:calc(var(--u)*12);font-weight:700;color:var(--ink);padding:calc(var(--u)*4) calc(var(--u)*10);border-radius:calc(var(--u)*8);background:#F6EBCF;border:1px solid rgba(168,116,26,.35)}
.tm-big{margin:calc(var(--u)*8) 0 0;display:flex;align-items:baseline;gap:calc(var(--u)*6)}
.tm-big b{font-family:var(--display);font-size:calc(var(--u)*64);font-weight:700;letter-spacing:-.03em;line-height:1}
.tm-big small{font-size:calc(var(--u)*15);color:var(--muted)}
.tm-dots{display:flex;flex-direction:column;gap:calc(var(--u)*5);margin-top:calc(var(--u)*12)}
.tm-dr{display:flex;gap:calc(var(--u)*5)}
.tm-dr i{width:calc(var(--u)*11);height:calc(var(--u)*11);border-radius:3px;background:var(--gold);transform:scale(0)}
.tm-dr i.n{background:var(--navy)}.tm-dr i.m{background:#D7CFBE}
.tm.on .tm-dr i{animation:tm-dot 4s cubic-bezier(.3,1.6,.5,1) infinite;animation-delay:calc(var(--k)*.08s)}
@keyframes tm-dot{0%{transform:scale(0)}12%,80%{transform:scale(1)}100%{transform:scale(0)}}
.tm-pager{border-top:1px solid #E4DCCB;padding-top:calc(var(--u)*12)}
.tm-pager i{font-style:normal;width:calc(var(--u)*26);height:calc(var(--u)*26);display:grid;place-items:center;border-radius:calc(var(--u)*7);background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
/* core */
.tm-core{left:calc(var(--u)*430);top:calc(var(--u)*150);width:calc(var(--u)*340);height:calc(var(--u)*420)}
.tm-core>*{position:absolute;opacity:0;transform:translateY(calc(var(--u)*30))}
.tm-disc{left:calc(var(--u)*20);top:calc(var(--u)*30);width:calc(var(--u)*300);aspect-ratio:1;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.22),rgba(255,255,255,.04) 60%);border:1px solid rgba(243,210,122,.35);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 calc(var(--u)*80) rgba(217,166,50,.25)}
.tm-ring{position:absolute;inset:8%;border-radius:50%;border:calc(var(--u)*3) solid var(--gold);box-shadow:0 0 calc(var(--u)*24) rgba(217,166,50,.7)}
.tm-logo{width:52%;position:relative;filter:drop-shadow(0 calc(var(--u)*6) calc(var(--u)*10) rgba(0,0,0,.4))}
.tm-scan{position:absolute;left:0;right:0;height:calc(var(--u)*46);top:0;background:linear-gradient(180deg,transparent,rgba(243,210,122,.55) 85%,#F3D27A 92%,transparent);mix-blend-mode:screen}
.tm.on .tm-scan{animation:tm-scan 3.2s ease-in-out infinite alternate}
@keyframes tm-scan{from{transform:translateY(calc(var(--u)*10))}to{transform:translateY(calc(var(--u)*244))}}
.tm-score{left:calc(var(--u)*196);top:calc(var(--u)*248);width:calc(var(--u)*136);aspect-ratio:1;border-radius:50%;background:rgba(251,249,244,.94);display:grid;place-content:center;text-align:center;box-shadow:0 calc(var(--u)*16) calc(var(--u)*30) calc(var(--u)*-12) rgba(0,0,0,.6)}
.tm-score svg{position:absolute;inset:calc(var(--u)*8);width:calc(100% - var(--u)*16);transform:rotate(-90deg)}
.tm-score circle{fill:none;stroke-width:9;stroke-linecap:round}.tm-score .trk{stroke:#E4DCCB}.tm-score .val{stroke:var(--gold);stroke-dasharray:100;stroke-dashoffset:100}
.tm.on .tm-score .val{animation:tm-ring 2s cubic-bezier(.65,0,.35,1) .8s forwards}
@keyframes tm-ring{to{stroke-dashoffset:20}}
.tm-score b{font-family:var(--display);font-size:calc(var(--u)*30);line-height:1}.tm-score small{font-size:calc(var(--u)*11);color:var(--muted)}
.tm-call{white-space:nowrap;display:flex;flex-direction:column;padding:calc(var(--u)*8) calc(var(--u)*14) calc(var(--u)*8) calc(var(--u)*26);border-radius:calc(var(--u)*12);background:rgba(251,249,244,.14);border:1px solid rgba(251,249,244,.22);color:#F7F4EE;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tm-call i{position:absolute;left:calc(var(--u)*10);top:50%;width:calc(var(--u)*8);height:calc(var(--u)*8);margin-top:calc(var(--u)*-4);border-radius:50%;background:var(--gold-l);box-shadow:0 0 0 calc(var(--u)*4) rgba(243,210,122,.25)}
.tm-call b{font-size:calc(var(--u)*16)}.tm-call small{font-size:calc(var(--u)*11);opacity:.7}
.tm-call.a{left:calc(var(--u)*-30);top:calc(var(--u)*250)}.tm-call.b{left:calc(var(--u)*230);top:0}
.tm.on .tm-core .tm-score{animation-delay:.3s}.tm.on .tm-call.a{animation-delay:.5s}.tm.on .tm-call.b{animation-delay:.65s}
/* c3 */
.tm-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:calc(var(--u)*16) 0 0}
.tm-stats dt{font-size:calc(var(--u)*12);color:var(--muted)}.tm-stats dd{margin:0;font-family:var(--display);font-weight:700;font-size:calc(var(--u)*30)}
.tm-spark{display:flex;align-items:flex-end;gap:calc(var(--u)*6);height:calc(var(--u)*60);margin-top:calc(var(--u)*14)}
.tm-spark i{flex:1;height:var(--h);border-radius:calc(var(--u)*4) calc(var(--u)*4) 0 0;background:linear-gradient(180deg,var(--gold),#F3D27A);transform-origin:bottom;transform:scaleY(0)}
.tm-spark i:last-child{background:var(--red)}
.tm.on .tm-spark i{animation:tm-grow .8s cubic-bezier(.3,1.4,.5,1) forwards;animation-delay:calc(.8s + var(--k)*.07s)}
@keyframes tm-grow{to{transform:scaleY(1)}}
/* c4 */
.tm-av{flex:none;width:calc(var(--u)*58);height:calc(var(--u)*58);border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 0 0 2px var(--gold)}
.tm-avm{width:66%}
.c4>div{display:flex;flex-direction:column;flex:1}.c4 b{font-size:calc(var(--u)*16)}.c4 small{font-size:calc(var(--u)*12);color:var(--muted)}
.c4 small{white-space:nowrap}.c4 dl{display:flex;gap:calc(var(--u)*14);margin:0;text-align:right}.c4 dt{font-size:calc(var(--u)*11);color:var(--muted)}.c4 dd{margin:0;font-weight:700;font-size:calc(var(--u)*16)}
/* c5 */
.tm-mt{display:grid;grid-template-columns:calc(var(--u)*36) 1fr calc(var(--u)*110);align-items:center;gap:calc(var(--u)*12);margin-top:calc(var(--u)*12)}
.tm-ic{width:calc(var(--u)*36);height:calc(var(--u)*36);border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.tm-ic svg{width:50%;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tm-mt b{display:block;font-size:calc(var(--u)*15);line-height:1.2}.tm-mt small{font-size:calc(var(--u)*12);color:var(--muted)}
.tm-bar{height:calc(var(--u)*24);border-radius:calc(var(--u)*5);background:#E4DCCB;overflow:hidden;
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 calc(var(--u)*5),transparent calc(var(--u)*5) calc(var(--u)*8));mask:repeating-linear-gradient(90deg,#000 0 calc(var(--u)*5),transparent calc(var(--u)*5) calc(var(--u)*8))}
.tm-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#E62030,#D9A632 50%,#F3D27A)}
.tm.on .tm-bar i{animation:tm-w 1.6s cubic-bezier(.65,0,.35,1) 1s forwards}
@keyframes tm-w{to{width:var(--v)}}
.tm.on .tm-mt:nth-of-type(3) .tm-bar i{animation-delay:1.2s}.tm.on .tm-mt:nth-of-type(4) .tm-bar i{animation-delay:1.4s}
/* dock */
.tm-dock{left:calc(var(--u)*385);top:calc(var(--u)*610);width:calc(var(--u)*430);display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--u)*8);opacity:0;transform:translateY(calc(var(--u)*30))}
.tm-check{flex-basis:100%;display:flex;justify-content:center;align-items:center;gap:calc(var(--u)*10);margin-bottom:calc(var(--u)*4)}
.tm-check b{font-size:calc(var(--u)*13);font-weight:600;padding:calc(var(--u)*8) calc(var(--u)*16);border-radius:99px;background:rgba(251,249,244,.94);color:var(--ink)}
.tm-check i{width:calc(var(--u)*10);height:calc(var(--u)*10);border-radius:50%;background:var(--gold-l);animation:tm-blink 1s ease-in-out infinite}
@keyframes tm-blink{50%{opacity:.25;transform:scale(.7)}}
.tm-chip{display:flex;align-items:center;gap:calc(var(--u)*6);padding:calc(var(--u)*5) calc(var(--u)*11) calc(var(--u)*5) calc(var(--u)*5);border-radius:99px;background:rgba(251,249,244,.16);border:1px solid rgba(251,249,244,.25);color:#F7F4EE;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tm-chip .gx{width:calc(var(--u)*28);height:calc(var(--u)*28);margin:0;background:#FBF9F4;border-radius:50%;padding:calc(var(--u)*4)}
.tm-chip b{font-size:calc(var(--u)*12);font-weight:600}
.tm.on .tm-chip{animation:tm-chip 8s steps(1) infinite;animation-delay:calc(var(--k)*2s - 8s)}
@keyframes tm-chip{0%{background:var(--gold);color:var(--ink);border-color:var(--gold)}25%,100%{background:rgba(251,249,244,.16);color:#F7F4EE;border-color:rgba(251,249,244,.25)}}
.tm-note{margin:14px 0 0;font-size:13px;font-style:italic;color:var(--muted);text-align:right}
@media (prefers-reduced-motion: reduce){.tm .tm-cam{animation:none!important}.tm-card,.tm-dock,.tm-core>*{opacity:1!important;transform:none!important}.tm-ticks::after{width:13%}.tm-bar i{width:var(--v)}.tm-spark i,.tm-dr i{transform:none}.tm-score .val{stroke-dashoffset:20}}

@media (max-width:700px){.tm{padding:90px 0 60px}.tm-frame{width:calc(100% - 16px)}.tm.on .tm-cam{animation-name:tm-cam-m;animation-duration:30s}}
@keyframes tm-cam-m{
  0%,8%{transform:translate(-70%,-70%) scale(2.4)}
  12%,22%{transform:translate(0,-27%) scale(2.4)}
  26%,36%{transform:translate(0,-128%) scale(2.4)}
  40%,50%{transform:translate(-140%,-15%) scale(2.4)}
  54%,64%{transform:translate(-140%,-73%) scale(2.4)}
  68%,78%{transform:translate(-140%,-136%) scale(2.4)}
  82%,92%{transform:translate(-70%,-140%) scale(2.4)}
  96%,100%{transform:translate(-70%,-70%) scale(2.4)}}

/* ===== website page: dark launch showcase (beam, tilting screen, issue cloud, circuit, bento) ===== */
.wd{position:relative;overflow:hidden;background:#0E1120;color:#EFE9DD;padding:120px 0 0;isolation:isolate}
.wd-stars{position:absolute;inset:0;z-index:-1;opacity:.55;background-image:radial-gradient(circle,rgba(243,210,122,.9) 1px,transparent 1.5px),radial-gradient(circle,rgba(255,255,255,.5) 1px,transparent 1.4px);background-size:180px 160px,90px 110px;background-position:20px 30px,60px 10px;animation:wd-tw 7s ease-in-out infinite alternate}
@keyframes wd-tw{to{opacity:.25;background-position:30px 40px,50px 20px}}
.wd-beam{position:absolute;left:-10%;top:-30%;width:70%;height:120%;z-index:-1;pointer-events:none;background:conic-gradient(from 132deg at 0 0,transparent 0deg,rgba(243,210,122,.35) 8deg,rgba(217,166,50,.08) 22deg,transparent 30deg);filter:blur(10px);transform-origin:0 0;animation:wd-sweep 9s ease-in-out infinite alternate}
@keyframes wd-sweep{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
.wd-hero{text-align:center;display:flex;flex-direction:column;align-items:center}
.wd-eye{color:var(--gold-l)}
.wd-h,.wd-h2{font-family:var(--display);font-stretch:112%;text-transform:uppercase;font-weight:800;font-size:clamp(40px,6.4vw,92px);line-height:.95;letter-spacing:-.02em;margin:18px 0 0;color:#FBF9F4;
  background:linear-gradient(180deg,#FFFFFF 30%,#CFC6B4);-webkit-background-clip:text;background-clip:text}
.wd-h em,.wd-h2 em{-webkit-text-fill-color:var(--gold-l);color:var(--gold-l)}
.wd-sub{font-family:var(--serif);font-style:italic;font-size:19px;color:#BEB6A6;margin:18px 0 28px;max-width:44ch}
.wd-glow{box-shadow:0 0 0 1px rgba(243,210,122,.6),0 0 30px rgba(217,166,50,.55),0 0 80px rgba(217,166,50,.25);animation:wd-glow 2.8s ease-in-out infinite}
@keyframes wd-glow{50%{box-shadow:0 0 0 1px rgba(243,210,122,.9),0 0 46px rgba(217,166,50,.8),0 0 110px rgba(217,166,50,.35)}}
/* tilting screen */
.wd-stage{perspective:1400px;margin-top:64px}
.wd-screen{--t:1;transform:rotateX(calc(var(--t)*34deg)) scale(calc(1 - var(--t)*.08)) translateY(calc(var(--t)*30px));transform-origin:50% 0;border-radius:18px;overflow:hidden;
  background:#151A2D;border:1px solid rgba(243,210,122,.22);box-shadow:0 -10px 80px rgba(217,166,50,.18),0 40px 80px rgba(0,0,0,.6);will-change:transform}
.wd-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#1B2136;border-bottom:1px solid rgba(255,255,255,.06)}
.wd-bar i{width:10px;height:10px;border-radius:50%;background:#3A425E}.wd-bar i:first-child{background:var(--red)}
.wd-bar span{margin-left:14px;font-size:12px;color:#8E93A8;background:#12162A;padding:4px 14px;border-radius:99px}
.wd-site{padding:22px 26px 28px;background:linear-gradient(180deg,#F7F4EE,#EFE9DD);color:var(--ink)}
.wd-nav{display:flex;align-items:center;gap:20px}
.wd-logo{font-family:var(--display);font-weight:800;letter-spacing:.2em;font-size:13px}
.wd-links{display:flex;gap:12px;margin-left:auto}.wd-links i{width:46px;height:6px;border-radius:3px;background:#D7CFBE}
.wd-cta{font-size:12px;font-weight:700;background:var(--red);color:#fff;padding:7px 14px;border-radius:99px}
.wd-hgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;margin-top:28px;align-items:center}
.wd-l{display:block;height:22px;border-radius:6px;background:var(--ink);margin-bottom:10px;transform-origin:left;transform:scaleX(0)}
.wd-l.l1{width:90%}.wd-l.l2{width:70%;background:var(--gold-d)}.wd-l.l3{width:80%;height:9px;background:#C9C0AE;margin-top:16px}
.wd.on .wd-l{animation:wd-grow .9s cubic-bezier(.65,0,.35,1) forwards}.wd.on .wd-l.l2{animation-delay:.15s}.wd.on .wd-l.l3{animation-delay:.3s}
@keyframes wd-grow{to{transform:none}}
.wd-btns{display:flex;gap:10px;margin-top:18px}
.wd-btns b{font-size:12px;padding:9px 16px;border-radius:99px;background:var(--ink);color:#fff}
.wd-btns b.o{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.wd.on .wd-btns b:first-child{animation:wd-press 3s ease-in-out 1.4s infinite}
@keyframes wd-press{0%,70%,100%{transform:none}78%{transform:scale(.92);background:var(--red)}86%{transform:none;background:var(--red)}}
.wd-img{position:relative;aspect-ratio:4/3;border-radius:14px;background:radial-gradient(circle at 70% 30%,#F3D27A,#D9A632 40%,#272F48 100%)}
.wd-stat{position:absolute;left:-18px;bottom:18px;display:flex;flex-direction:column;background:#fff;padding:10px 14px;border-radius:12px;box-shadow:0 12px 30px -10px rgba(0,0,0,.4)}
.wd-stat b{font-family:var(--display);font-size:24px;line-height:1}.wd-stat small{font-size:11px;color:var(--muted)}
.wd.on .wd-stat{animation:wd-float 4s ease-in-out infinite}
@keyframes wd-float{50%{transform:translateY(-8px)}}
.wd-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}.wd-row span{height:64px;border-radius:10px;background:#E4DCCB}
/* cards */
.wd-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:110px}
.wd-card{position:relative;border-radius:24px;padding:34px;background:linear-gradient(160deg,#1C2340,#151A2D 60%);border:1px solid rgba(243,210,122,.16);overflow:hidden;min-height:440px;display:flex;flex-direction:column}
.wd-card h3{font-family:var(--display);font-stretch:108%;text-transform:uppercase;font-weight:800;font-size:clamp(24px,2.6vw,34px);line-height:1;margin:0;color:#FBF9F4}
.wd-card p{color:#AFA898;font-size:15px;margin:12px 0 0;max-width:40ch}
.wd-cloud{position:relative;flex:1;min-height:250px;margin-top:20px}
.wd-cloud svg{position:absolute;inset:0;width:100%;height:100%}
.wd-cloud line{stroke:rgba(243,210,122,.5);stroke-width:.4;stroke-dasharray:1.2 1.4;vector-effect:non-scaling-stroke;animation:wd-dash 3s linear infinite}
.wd-cloud line{stroke-width:1.2}
@keyframes wd-dash{to{stroke-dashoffset:-26}}
.wd-tag{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);white-space:nowrap;font-size:13px;font-weight:600;padding:7px 13px;border-radius:9px;
  background:rgba(39,47,72,.9);border:1px solid rgba(243,210,122,.35);color:#EFE9DD;animation:wd-bob 5s ease-in-out infinite;animation-delay:calc(var(--k)*-1.1s)}
.wd-tag::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red);margin-right:8px;vertical-align:1px;box-shadow:0 0 8px var(--red)}
.wd.on .wd-tag{animation:wd-bob 5s ease-in-out infinite,wd-fix 10s steps(1) infinite;animation-delay:calc(var(--k)*-1.1s),calc(1s + var(--k)*1.6s)}
@keyframes wd-bob{50%{transform:translate(-50%,calc(-50% - 7px))}}
@keyframes wd-fix{0%{border-color:rgba(243,210,122,.35)}0.1%,60%{border-color:var(--gold);background:rgba(217,166,50,.22)}}
.wd-you{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--display);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:13px;padding:12px 18px;border-radius:12px;
  background:var(--gold);color:var(--ink);box-shadow:0 0 0 6px rgba(217,166,50,.18),0 0 40px rgba(217,166,50,.6)}
/* circuit */
.wd-board{position:relative;flex:1;min-height:250px;margin-top:24px;display:grid;grid-template-columns:42% 1fr 34%;align-items:stretch}
.wd-boxes{display:grid;grid-template-rows:repeat(4,1fr);gap:10px;z-index:1}
.wd-box{display:flex;flex-direction:column;justify-content:center;padding:8px 14px;border-radius:12px;background:rgba(39,47,72,.9);border:1px solid rgba(255,255,255,.08)}
.wd-box b{font-size:14px;color:#FBF9F4}.wd-box small{font-size:12px;color:#9C9686}
.wd.on .wd-box{animation:wd-lit 6s ease-in-out infinite;animation-delay:calc(var(--k)*1.5s)}
@keyframes wd-lit{0%,30%,100%{border-color:rgba(255,255,255,.08)}8%,20%{border-color:var(--gold);box-shadow:0 0 18px rgba(217,166,50,.35)}}
.wd-wires{position:absolute;left:42%;width:24%;top:0;height:100%}
.wd-wires path{fill:none;vector-effect:non-scaling-stroke}
.wd-wires .w{stroke:rgba(243,210,122,.28);stroke-width:2}
.wd-wires .p{stroke:var(--gold-l);stroke-width:3;stroke-dasharray:.18 1.2;stroke-dashoffset:.18;opacity:0;filter:drop-shadow(0 0 4px var(--gold))}
.wd.on .wd-wires .p{animation:wd-run 6s cubic-bezier(.55,0,.45,1) infinite;animation-delay:calc(var(--k)*1.5s)}
@keyframes wd-run{0%{stroke-dashoffset:.18;opacity:1}22%{stroke-dashoffset:-1;opacity:1}23%,100%{opacity:0}}
.wd-chip{grid-column:3;align-self:center;justify-self:center;width:min(100%,170px);aspect-ratio:1;border-radius:26px;padding:10px;background:linear-gradient(145deg,#F3D27A,#A8741A);box-shadow:0 0 60px rgba(217,166,50,.55),0 0 0 1px rgba(255,255,255,.3) inset;animation:wd-chip 3s ease-in-out infinite}
.wd-chip-in{display:grid;place-items:center;width:100%;height:100%;border-radius:18px;background:radial-gradient(circle at 35% 30%,#3A4566,#272F48 55%,#161B2B)}
@keyframes wd-chip{50%{box-shadow:0 0 90px rgba(243,210,122,.75),0 0 0 1px rgba(255,255,255,.5) inset}}
/* bento */
.wd-bento{perspective:1600px;margin-top:110px}
.wd-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;transform:rotateX(26deg) rotateZ(-4deg);transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.75,.15,1)}
.wd-bento:hover .wd-tiles{transform:rotateX(14deg) rotateZ(-2deg)}
.wd-tile{display:flex;flex-direction:column;gap:8px;padding:22px;border-radius:20px;min-height:200px;background:linear-gradient(160deg,#232B47,#171C30);border:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 40px -20px rgba(0,0,0,.7);transform:translateY(40px);opacity:0;transition:transform .4s}
.wd.on .wd-tile{animation:wd-rise .8s cubic-bezier(.2,.75,.15,1) forwards;animation-delay:calc(.2s + var(--k)*.1s)}
@keyframes wd-rise{to{transform:none;opacity:1}}
.wd-tile:hover{transform:translateZ(30px) translateY(-6px)!important}
.wd-tile.hot{background:linear-gradient(160deg,#E3B648,#A8741A);color:var(--ink)}
.wd-ti{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.08);margin-bottom:8px}
.wd-tile.hot .wd-ti{background:rgba(19,19,19,.15)}
.wd-ti svg{width:22px;fill:none;stroke:var(--gold-l);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wd-tile.hot .wd-ti svg{stroke:var(--ink)}
.wd-tile b{font-family:var(--display);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:15px;color:#FBF9F4}.wd-tile.hot b{color:var(--ink)}
.wd-tile small{font-size:13px;line-height:1.45;color:#A39C8D}.wd-tile.hot small{color:#2A2416}
/* end */
.wd-end{position:relative;text-align:center;padding:150px 16px 130px;margin-top:40px;display:flex;flex-direction:column;align-items:center;gap:30px}
.wd-beam.up{left:30%;width:40%;top:auto;bottom:-10%;height:120%;background:radial-gradient(50% 100% at 50% 100%,rgba(243,210,122,.4),rgba(217,166,50,.08) 55%,transparent 75%);filter:blur(8px);animation:wd-breathe 4s ease-in-out infinite alternate}
@keyframes wd-breathe{to{opacity:.6;transform:scaleX(1.15)}}
.wd-h2{margin:0}
@media (max-width:860px){.wd-grid{grid-template-columns:1fr}.wd-tiles{grid-template-columns:repeat(2,1fr);transform:none!important}.wd-tile:last-child{grid-column:span 2}.wd-tile{min-height:0}}
@media (max-width:560px){.wd{padding-top:90px}.wd-hgrid{grid-template-columns:1fr}.wd-img{display:none}.wd-links{display:none}.wd-card{padding:24px;min-height:0}.wd-tag{font-size:11px;padding:5px 9px}.wd-board{grid-template-columns:52% 1fr 34%}.wd-wires{left:52%;width:14%}}
@media (prefers-reduced-motion: reduce){.wd *,.wd-beam{animation:none!important}.wd-screen{--t:0!important}.wd-tile{opacity:1;transform:none}.wd-l{transform:none}}

.wd-tag,.wd-box,.wd-btns b,.wd-cta,.wd-stat,.wd-bar span{font-family:var(--display);font-stretch:100%}
.wd-tag,.wd-box b{font-weight:600}.wd-box small,.wd-stat small{font-weight:400}

/* quick enquiry form in the dark contact band */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.qf{display:grid;gap:14px;margin-top:34px;max-width:620px}
.qf2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.qf label{display:grid;gap:6px}
.qf label span{font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--on-muted)}
.qf input,.qf select,.qf textarea{font:inherit;font-size:16px;padding:12px 14px;min-height:48px;background:rgba(247,244,238,.06);color:var(--on);border:1px solid var(--rule-d);border-radius:0}
.qf select option{color:var(--ink)}
.qf textarea{min-height:96px;resize:vertical}
.qf input::placeholder,.qf textarea::placeholder{color:rgba(247,244,238,.4)}
.qf input:focus,.qf select:focus,.qf textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:transparent}
.qf-go{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.qf-go .btn[disabled]{opacity:.6;cursor:wait}
.qf-st{margin:0;font-size:15px;font-style:italic;color:var(--gold-l)}
.qf-st a{color:var(--gold-l)}
.contact-grid{align-items:start}
.dl-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.btn.ghost-d{background:transparent;color:var(--on);border-color:var(--rule-d)}
.btn.ghost-d:hover{border-color:var(--gold);color:var(--gold-l)}
@media (max-width:560px){.qf2{grid-template-columns:1fr}}
/* GK sits in front of the glass cube so no cube edge crosses the mark */
.lx-logo{width:96px;left:-48px;top:-32px;filter:drop-shadow(0 0 5px rgba(255,240,220,.9)) drop-shadow(0 0 16px rgba(243,210,122,.7));animation:lx-logo2 14s ease-in-out infinite}
@keyframes lx-logo2{0%,100%{transform:translateZ(190px) rotateY(-8deg)}50%{transform:translateZ(190px) rotateY(8deg)}}
@media (prefers-reduced-motion: reduce){.lx-logo{transform:translateZ(190px)}}
.lx-logo{filter:none}

/* sitemap: footer columns and sitemap page */
.smap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:100px;padding-top:40px;border-top:1px solid var(--rule-d)}
.smap h3{font-family:var(--display);font-stretch:110%;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:0 0 16px}
.smap ul,.smap-page ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.smap a{color:var(--on-muted);text-decoration:none;font-size:16px}
.smap a:hover{color:var(--on);text-decoration:underline;text-underline-offset:4px}
.smap+.foot{margin-top:40px}
.smap-page{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:56px;border-top:1px solid var(--rule);padding-top:40px}
.smap-page h2{font-size:14px;letter-spacing:.24em;color:var(--red-ink);margin:0 0 18px}
.smap-page a{font-family:var(--serif);font-size:20px;color:var(--ink);text-underline-offset:5px}
@media (max-width:860px){.smap{grid-template-columns:repeat(2,minmax(0,1fr))}.smap-page{grid-template-columns:1fr}}

/* direct line card: solid, sticky, one row per channel */
.dline{position:sticky;top:110px;background:#1B1B1B;border:1px solid var(--rule-d);padding:30px 28px;z-index:1}
.dline .eye{font-style:normal;color:var(--gold)}
.dl-list{list-style:none;margin:18px 0 0;padding:0}
.dl-list li+li{border-top:1px solid var(--rule-d)}
.dl-list a{display:grid;grid-template-columns:40px minmax(0,1fr) 16px;align-items:center;gap:14px;padding:14px 0;text-decoration:none;color:var(--on)}
.dl-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(247,244,238,.06);border:1px solid var(--rule-d);transition:background .25s,border-color .25s}
.dl-ic svg{width:18px;height:18px;fill:none;stroke:var(--gold-l);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dl-t{display:grid;gap:2px;min-width:0}
.dl-t small{font-family:var(--display);font-stretch:110%;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--on-muted)}
.dl-t b{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:.01em;overflow-wrap:anywhere}
.dl-go{color:var(--on-muted);transition:transform .25s,color .25s}
.dl-list a:hover .dl-ic{background:var(--gold);border-color:var(--gold)}.dl-list a:hover .dl-ic svg{stroke:var(--ink)}
.dl-list a:hover .dl-go{color:var(--gold-l);transform:translate(2px,-2px)}
.dl-note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;margin:16px 0 0!important;padding-top:16px;border-top:1px solid var(--rule-d);font-size:14px!important}
@media (max-width:860px){.dline{position:static}}

/* hub: shadows follow the tilt (light from above, shadow falls away from the raised side) */
.hub-stage{position:relative;--sx:0;--sy:0}
.hub-shadow{position:absolute;left:8%;right:8%;bottom:-5%;height:24%;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,rgba(19,19,19,.38),rgba(19,19,19,.12) 60%,transparent);filter:blur(22px);
  transform:translate(calc(var(--sx) * 34px),calc(var(--sy) * 18px)) scaleX(calc(1 + var(--sx) * var(--sx) * .1));transition:transform .6s cubic-bezier(.2,.75,.15,1)}
.hub-plane{z-index:1}
.hub-sh{transform:translate(calc(9% + var(--sx) * 8%),calc(18% + var(--sy) * 6%)) scale(1.04);transition:transform .6s cubic-bezier(.2,.75,.15,1)}
.ht-box{position:relative}
.ht-box::after{content:"";position:absolute;left:10%;right:10%;bottom:-14%;height:30%;z-index:-1;border-radius:50%;background:rgba(19,19,19,.32);filter:blur(8px);
  transform:translate(calc(var(--sx) * 10px),calc(var(--sy) * 6px));transition:transform .6s cubic-bezier(.2,.75,.15,1)}
.hc::after{content:"";position:absolute;left:8%;right:8%;bottom:-12px;height:16px;z-index:-1;border-radius:50%;background:rgba(19,19,19,.22);filter:blur(8px);
  transform:translate(calc(var(--sx) * 10px),calc(var(--sy) * 5px));transition:transform .6s cubic-bezier(.2,.75,.15,1)}
.hub-shadow{left:4%;right:4%;bottom:-7%;height:30%;background:radial-gradient(closest-side,rgba(19,19,19,.55),rgba(19,19,19,.18) 55%,transparent);filter:blur(26px);
  transform:translate(calc(var(--sx) * 70px),calc(10px + var(--sy) * 30px)) scaleX(calc(1 + var(--sx) * var(--sx) * .15))}
.ht-box::after{background:rgba(19,19,19,.4);transform:translate(calc(var(--sx) * 16px),calc(var(--sy) * 10px))}

/* service pages: mid page call to action */
.svc-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;margin:10px 0 0;padding:34px 38px;background:var(--navy);color:var(--on)}
.svc-cta .eye{color:var(--gold)}
.svc-l{margin:10px 0 0;font-family:var(--serif);font-size:clamp(19px,1.8vw,24px);line-height:1.35;max-width:46ch;color:var(--on)}
@media (max-width:560px){.svc-cta{padding:26px 22px}}

/* self check: readiness % with meter and bands */
.sc-out{grid-template-columns:auto minmax(0,1fr)}
.sc-score b{font-size:56px;white-space:nowrap}
.sc-meter{grid-column:1/-1;position:relative;height:10px;background:#E4DCCB;overflow:hidden}
.sc-meter i{display:block;height:100%;width:0;background:var(--red);transition:width .5s cubic-bezier(.2,.75,.15,1),background .3s}
.sc-meter span{position:absolute;top:0;bottom:0;width:2px;background:var(--paper-2)}
.sc-out[data-band="2"] .sc-meter i{background:var(--gold)}
.sc-out[data-band="3"] .sc-meter i{background:var(--navy)}
.sc-out[data-band="3"] .sc-score b{color:var(--navy)}
.sc-key{grid-column:1/-1;display:grid;grid-template-columns:40% 30% 30%;margin:-12px 0 0!important;font-family:var(--display);font-stretch:110%;font-size:10px!important;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.sc-fine{margin:0 0 18px;font-size:14px;font-style:italic;color:var(--muted)}
.sc-ctas{margin-top:0}
.tm-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 30px;margin-top:22px}
.tm-foot .tm-note{margin:0;order:2}
.tm-foot .ctas{margin:0}

/* ===== trust monitor v2: light glass, big GK centrepiece, 3D camera like the reference ===== */
.tm-frame{perspective:1800px;background:#EFE9DD}
.tm-cam{transform-origin:50% 50%;transform-style:preserve-3d}
.tm-bg{background:radial-gradient(70% 70% at 50% 45%,#FFFFFF 0,#F6F2EA 45%,#E9E1D2 100%)}
.tm-bg .b1{background:#F3D27A;opacity:.45}.tm-bg .b2{background:#272F48;opacity:.12}.tm-bg .b3{background:#D9A632;opacity:.3}
.tm-top{background:rgba(255,255,255,.55);border-color:rgba(19,19,19,.08);color:var(--ink)}
.tm-top span{color:var(--gold-d)}
.tm-card{background:rgba(255,255,255,.72);box-shadow:0 calc(var(--u)*24) calc(var(--u)*50) calc(var(--u)*-20) rgba(39,47,72,.35),inset 0 1px 0 #fff;border:1px solid rgba(255,255,255,.9);filter:blur(6px)}
.tm.on .tm-card,.tm.on .tm-dock,.tm.on .tm-core>*{animation-name:tm-in2}
@keyframes tm-in2{to{opacity:1;transform:none;filter:none}}
/* centrepiece */
.tm-disc{width:calc(var(--u)*320);left:calc(var(--u)*10);top:calc(var(--u)*20);background:radial-gradient(circle at 40% 35%,rgba(255,255,255,.95),rgba(255,255,255,.35) 55%,rgba(243,210,122,.25) 100%);
  border:1px solid rgba(255,255,255,.95);box-shadow:0 0 0 calc(var(--u)*26) rgba(255,255,255,.28),0 0 0 calc(var(--u)*27) rgba(168,116,26,.18),0 calc(var(--u)*40) calc(var(--u)*80) calc(var(--u)*-30) rgba(39,47,72,.45)}
.tm-ring{border-width:calc(var(--u)*2);border-color:rgba(168,116,26,.55);box-shadow:none}
.tm-logo{width:60%;filter:drop-shadow(0 calc(var(--u)*14) calc(var(--u)*14) rgba(39,47,72,.3))}
.tm.on .tm-logo{animation:tm-float 6s ease-in-out infinite}
@keyframes tm-float{50%{transform:translateY(calc(var(--u)*-10)) rotate(-2deg)}}
.tm-scan{height:calc(var(--u)*3);background:linear-gradient(90deg,transparent,#F3D27A 20%,#D9A632 50%,#F3D27A 80%,transparent);box-shadow:0 0 calc(var(--u)*18) calc(var(--u)*4) rgba(243,210,122,.75);mix-blend-mode:normal}
@keyframes tm-scan{from{transform:translateY(calc(var(--u)*40))}to{transform:translateY(calc(var(--u)*280))}}
.tm-score{left:calc(var(--u)*200);top:calc(var(--u)*262)}
.tm-call{background:rgba(255,255,255,.8);border-color:rgba(255,255,255,.95);color:var(--ink);box-shadow:0 calc(var(--u)*12) calc(var(--u)*24) calc(var(--u)*-12) rgba(39,47,72,.4)}
.tm-call i{background:var(--gold);box-shadow:0 0 0 calc(var(--u)*4) rgba(217,166,50,.25)}
.tm-call::after{content:"";position:absolute;top:50%;height:1px;width:calc(var(--u)*70);background:linear-gradient(90deg,rgba(168,116,26,.7),transparent)}
.tm-call.a::after{left:100%}.tm-call.b::after{right:100%;transform:scaleX(-1);transform-origin:right}
.tm-call small{opacity:.65}
.tm-check b{background:#fff;box-shadow:0 calc(var(--u)*8) calc(var(--u)*16) calc(var(--u)*-8) rgba(39,47,72,.4)}
.tm-chip{background:rgba(255,255,255,.7);border-color:rgba(255,255,255,.95);color:var(--ink);box-shadow:0 calc(var(--u)*8) calc(var(--u)*16) calc(var(--u)*-8) rgba(39,47,72,.35)}
@keyframes tm-chip{0%{background:var(--gold);color:var(--ink);border-color:var(--gold)}25%,100%{background:rgba(255,255,255,.7);color:var(--ink);border-color:rgba(255,255,255,.95)}}
/* camera: zoom, pan and tilt in 3D */
@keyframes tm-cam{
  0%,10%{transform:none}
  15%,26%{transform:translate(37.5%,30.5%) scale(1.75) rotateY(12deg) rotateX(5deg)}
  31%,42%{transform:translate(37.5%,-37.5%) scale(1.75) rotateY(10deg) rotateX(-5deg)}
  47%,57%{transform:translate(0,0) scale(1.65) rotateX(8deg)}
  62%,72%{transform:translate(-37.5%,27.5%) scale(1.75) rotateY(-12deg) rotateX(5deg)}
  77%,87%{transform:translate(-37.5%,-37.5%) scale(1.75) rotateY(-10deg) rotateX(-5deg)}
  93%,100%{transform:none}}
@keyframes tm-cam-m{
  0%,8%{transform:scale(2.4)}
  12%,22%{transform:translate(70%,43%) scale(2.4) rotateY(8deg)}
  26%,36%{transform:translate(70%,-58%) scale(2.4) rotateY(8deg)}
  40%,50%{transform:translate(-70%,55%) scale(2.4) rotateY(-8deg)}
  54%,64%{transform:translate(-70%,-3%) scale(2.4) rotateY(-8deg)}
  68%,78%{transform:translate(-70%,-66%) scale(2.4) rotateY(-8deg)}
  82%,92%{transform:translate(0,-70%) scale(2.4) rotateX(6deg)}
  96%,100%{transform:scale(2.4)}}
@media (prefers-reduced-motion: reduce){.tm-card{filter:none!important}}
@media (max-width:700px){.tm-frame{perspective:none}.tm-cam{transform-style:flat}.tm.on .tm-cam{animation-name:tm-cam-m2}}
@keyframes tm-cam-m2{
  0%,8%{transform:scale(2.4)}
  12%,22%{transform:translate(70%,43%) scale(2.4)}
  26%,36%{transform:translate(70%,-58%) scale(2.4)}
  40%,50%{transform:translate(-70%,55%) scale(2.4)}
  54%,64%{transform:translate(-70%,-3%) scale(2.4)}
  68%,78%{transform:translate(-70%,-66%) scale(2.4)}
  82%,92%{transform:translate(0,-70%) scale(2.4)}
  96%,100%{transform:scale(2.4)}}

/* self check: result locked behind an audit */
.sc-lock{position:relative;margin:22px 0 18px;background:var(--paper-2);overflow:hidden;min-height:170px}
.sc-blur{padding:22px;filter:blur(7px);opacity:.55;user-select:none;pointer-events:none;display:grid;gap:14px}
.sc-blur b{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:56px;line-height:.9;color:var(--navy)}
.sc-blur .sc-meter{display:block;height:10px;background:#E4DCCB}.sc-blur .sc-meter i{display:block;height:100%;width:30%;background:var(--gold);transition:width .6s}
.sc-lock.on .sc-blur .sc-meter i{width:72%}
.sc-blur .sc-key{display:grid;grid-template-columns:40% 30% 30%;margin:0;font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.sc-gate{position:absolute;inset:0;display:grid;grid-template-columns:44px minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:16px;align-content:center;padding:22px 24px;background:linear-gradient(90deg,rgba(239,233,221,.96) 0,rgba(239,233,221,.85) 70%,rgba(239,233,221,.6))}
.sc-ic{grid-row:1/3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--navy)}
.sc-ic svg{width:20px;fill:none;stroke:var(--gold-l);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sc-gate h3{font-size:18px;margin:0}
.sc-gate p{margin:6px 0 0;font-size:16px;color:var(--muted)}
.sc-lock{display:grid;min-height:0}
.sc-blur,.sc-gate{grid-area:1/1}
.sc-blur{align-content:space-between;justify-items:end;padding:20px 22px;opacity:.7}
.sc-blur .sc-meter,.sc-blur .sc-key{width:100%}
.sc-gate{position:relative;inset:auto;padding:22px 24px 58px;background:linear-gradient(90deg,rgba(239,233,221,.97) 0,rgba(239,233,221,.92) 55%,rgba(239,233,221,.35) 100%)}
@media (max-width:560px){.sc-gate{grid-template-columns:1fr;padding:20px 18px 60px;background:rgba(239,233,221,.9)}.sc-ic{grid-row:auto;margin-bottom:12px}.sc-blur b{font-size:44px}}
.tm-chip .tm-mi svg{width:100%;height:100%}

/* ===== home: Wikipedia page monitor on a brushed gold device (NOC style) ===== */
.nd{padding:120px 0 90px;background:var(--paper)}
.nd-frame{margin-top:52px;container-type:inline-size}
.nd-stage{--u:calc(100cqw / 1200);position:relative;aspect-ratio:1200/760;overflow:hidden;border-radius:calc(var(--u)*28);perspective:calc(var(--u)*1800);
  background:radial-gradient(70% 70% at 55% 45%,#FFFFFF 0,#F4EFE6 55%,#E7DFD0 100%);box-shadow:inset 0 0 0 1px rgba(19,19,19,.06)}
.nd-cables{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.nd-cables .cb{fill:none;stroke-width:5;stroke-linecap:round;opacity:.9;transform-origin:50% 50%;animation:nd-sway 7s ease-in-out infinite alternate}
.nd-cables .n{stroke:#272F48}.nd-cables .n2{stroke:#3A4566;stroke-width:3;animation-delay:-2s}.nd-cables .g{stroke:#D9A632;animation-delay:-4s}.nd-cables .g2{stroke:#C9952A;stroke-width:3;animation-delay:-1s}.nd-cables .r{stroke:#E62030;stroke-width:3;animation-delay:-3s}
@keyframes nd-sway{to{transform:translate(6px,-4px) rotate(.6deg)}}
.nd-cam{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 50%}
.nd-dev{position:absolute;left:calc(var(--u)*160);top:calc(var(--u)*90);width:calc(var(--u)*880);height:calc(var(--u)*580);box-sizing:border-box;padding:calc(var(--u)*22);border-radius:calc(var(--u)*30);
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 3px),linear-gradient(135deg,#F0CB66 0,#C9952A 38%,#F3D27A 55%,#B07D20 80%,#D9A632 100%);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.55),inset 0 -3px 0 rgba(0,0,0,.18),0 calc(var(--u)*50) calc(var(--u)*80) calc(var(--u)*-30) rgba(39,47,72,.55),0 calc(var(--u)*12) calc(var(--u)*20) rgba(39,47,72,.18);
  transform:rotateY(-18deg) rotateX(12deg) rotateZ(-3deg);transform-style:preserve-3d}
.nd-plug{position:absolute;left:calc(var(--u)*-44);top:calc(var(--u)*300);width:calc(var(--u)*48);height:calc(var(--u)*76);border-radius:calc(var(--u)*6);
  background:linear-gradient(90deg,#B07D20,#F3D27A 50%,#C9952A);box-shadow:0 calc(var(--u)*6) calc(var(--u)*12) rgba(39,47,72,.3)}
.nd-scr{position:relative;height:100%;box-sizing:border-box;border-radius:calc(var(--u)*14);background:#111216;padding:calc(var(--u)*18);display:flex;flex-direction:column;gap:calc(var(--u)*12);overflow:hidden;
  box-shadow:inset 0 0 0 calc(var(--u)*3) #0A0A0C,inset 0 0 calc(var(--u)*40) rgba(0,0,0,.6);color:#EDE7DA;font-family:var(--display);font-stretch:100%}
.nd-head{display:flex;align-items:center;gap:calc(var(--u)*12)}
.nd-gk{width:calc(var(--u)*52);height:auto}
.nd-head b{display:block;font-size:calc(var(--u)*18);font-weight:700;letter-spacing:.01em}
.nd-head small{font-size:calc(var(--u)*11);color:#8D8778}
.nd-pill{margin-left:auto;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:calc(var(--u)*8);align-items:center;padding:calc(var(--u)*8) calc(var(--u)*14);border-radius:calc(var(--u)*10);background:#1C1D23;border:1px solid rgba(255,255,255,.08)}
.nd-pill .nd-dot{grid-row:1}.nd-pill .nd-st{font-size:calc(var(--u)*16);letter-spacing:.08em;color:var(--gold-l)}.nd-pill small{grid-column:1/-1;font-size:calc(var(--u)*11);color:#CFC8B8}
.nd-dot{display:inline-block;width:calc(var(--u)*8);height:calc(var(--u)*8);border-radius:50%;background:var(--gold);box-shadow:0 0 calc(var(--u)*8) var(--gold);animation:tm-blink 1.6s ease-in-out infinite}
.nd-grid{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:calc(var(--u)*128) calc(var(--u)*128) minmax(0,1fr);gap:calc(var(--u)*10)}
.nd-t{position:relative;background:#1A1B21;border:1px solid rgba(255,255,255,.06);border-radius:calc(var(--u)*10);padding:calc(var(--u)*12) calc(var(--u)*14);overflow:hidden;min-width:0}
.nd-t header{display:flex;justify-content:space-between;align-items:center;font-size:calc(var(--u)*12);font-weight:600;color:#CFC8B8}
.nd-row{display:flex;align-items:center;gap:calc(var(--u)*10);margin-top:calc(var(--u)*8)}
.nd-ic{flex:none;width:calc(var(--u)*32);height:calc(var(--u)*32);border-radius:calc(var(--u)*8);border:1px solid rgba(255,255,255,.14);display:grid;place-items:center}
.nd-ic svg{width:55%;fill:none;stroke:var(--gold-l);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nd-row b{font-size:calc(var(--u)*32);font-weight:600;line-height:1;white-space:nowrap}.nd-row b small{font-size:calc(var(--u)*15);color:#8D8778;font-weight:500}
.nd-tr{margin-left:auto;font-size:calc(var(--u)*11);color:var(--gold-l);white-space:nowrap;text-align:right}.nd-tr em{display:block;font-style:normal;color:#8D8778}
.nd-sp{display:block;width:100%;height:calc(var(--u)*34);margin-top:calc(var(--u)*8);overflow:visible}
.nd-sp .ln,.nd-big .ln{fill:none;stroke:var(--gold);stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1}
.nd-sp.r .ln,.nd-big .ln.r{stroke:var(--red)}
.nd-sp .ar,.nd-big .ar{fill:rgba(217,166,50,.16)}.nd-big .ar.r{fill:rgba(230,32,48,.12)}
.nd-bars{display:flex;align-items:flex-end;gap:calc(var(--u)*2);height:calc(var(--u)*40);margin-top:calc(var(--u)*8)}
.nd-bars i{flex:1;height:var(--h);background:linear-gradient(180deg,#F3D27A,#A8741A);border-radius:1px;transform-origin:bottom;transform:scaleY(0)}
.nd-bars i.r{background:var(--red)}
.nd-ticks{position:relative;display:flex;gap:calc(var(--u)*2);height:calc(var(--u)*24);margin-top:calc(var(--u)*10)}
.nd-ticks i{flex:1;background:#3A3A40}
.nd-ticks i:nth-child(-n+30){background:linear-gradient(180deg,#F3D27A,#D9A632)}.nd-ticks i:nth-child(-n+8){background:#E62030}
.nd-mk{position:absolute;left:75%;top:calc(var(--u)*-4);bottom:calc(var(--u)*-4);width:calc(var(--u)*3);background:#FBF9F4;border-radius:2px;box-shadow:0 0 calc(var(--u)*6) rgba(255,255,255,.8)}
.nd-tl{display:flex;justify-content:space-between;margin:calc(var(--u)*4) 0 0;padding-left:50%;font-size:calc(var(--u)*10);color:#8D8778}
.t7{grid-column:1/-1;display:flex;flex-direction:column}
.nd-lg{display:flex;align-items:center;gap:calc(var(--u)*6);margin-left:auto;margin-right:calc(var(--u)*14);font-size:calc(var(--u)*10);color:#8D8778}
.nd-lg i{width:calc(var(--u)*8);height:calc(var(--u)*8);border-radius:50%}.nd-lg i.g{background:var(--gold)}.nd-lg i.r{background:var(--red);margin-left:calc(var(--u)*8)}
.nd-sel{font-size:calc(var(--u)*10);padding:calc(var(--u)*4) calc(var(--u)*10);border-radius:calc(var(--u)*6);background:#24252C;color:#CFC8B8}
.nd-big{flex:1;width:100%;margin-top:calc(var(--u)*8)}
.nd-big .grid path{stroke:rgba(255,255,255,.06);stroke-width:1;vector-effect:non-scaling-stroke}
.nd-tip{position:absolute;left:60%;top:calc(var(--u)*42);display:grid;padding:calc(var(--u)*6) calc(var(--u)*10);border-radius:calc(var(--u)*6);background:#24252C;border:1px solid rgba(243,210,122,.45);opacity:0}
.nd-tip b{font-size:calc(var(--u)*11);color:#FBF9F4}.nd-tip small{font-size:calc(var(--u)*10);color:#8D8778}
.nd-pin{position:absolute;left:calc(60% + var(--u)*40);top:calc(var(--u)*88);bottom:calc(var(--u)*14);width:0;border-left:1px dashed rgba(243,210,122,.6);opacity:0}
.nd-static{position:absolute;inset:0;pointer-events:none;opacity:0;mix-blend-mode:screen;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(207,200,184,.12) 0 2px,transparent 2px 5px)}
/* timeline */
.nd.on .nd-sp .ln,.nd.on .nd-big .ln{animation:gx-draw 1.8s cubic-bezier(.65,0,.35,1) .6s forwards}
.nd.on .nd-big .ln.r{animation-delay:1s}
.nd.on .nd-bars i{animation:tm-grow .7s cubic-bezier(.3,1.4,.5,1) forwards;animation-delay:calc(.5s + var(--k)*.04s)}
.nd.on .nd-tip,.nd.on .nd-pin{animation:nd-tip 14s ease infinite}
@keyframes nd-tip{0%,8%{opacity:0;transform:translateY(6px)}12%,100%{opacity:1;transform:none}}
.nd.on .nd-cam{animation:nd-cam 14s cubic-bezier(.65,0,.35,1) 1s infinite}
.nd.on .nd-dev{animation:nd-dev 14s cubic-bezier(.65,0,.35,1) 1s infinite}
.nd.on .nd-static{animation:nd-static 14s steps(1) 1s infinite}
.nd.on .nd-t{animation:nd-reboot 14s steps(1) 1s infinite}
.nd-frame:hover .nd-cam,.nd-frame:hover .nd-dev,.nd-frame:hover .nd-static,.nd-frame:hover .nd-t{animation-play-state:paused}
@keyframes nd-cam{
  0%,12%{transform:none}
  18%,30%{transform:translate(-62%,74%) scale(2.6)}
  36%,40%{transform:translate(40%,0) scale(1.8)}
  48%,52%{transform:translate(-40%,0) scale(1.8)}
  58%,66%{transform:scale(.96)}
  74%,100%{transform:none}}
@keyframes nd-dev{
  0%,12%{transform:rotateY(-18deg) rotateX(12deg) rotateZ(-3deg)}
  18%,52%{transform:none}
  58%,66%{transform:rotateY(8deg) rotateX(4deg)}
  74%,100%{transform:rotateY(-18deg) rotateX(12deg) rotateZ(-3deg)}}
@keyframes nd-static{0%,58%{opacity:0}59%{opacity:.9}60%{opacity:.4}61.5%{opacity:.85}63%,100%{opacity:0}}
@keyframes nd-reboot{0%,58%{filter:none}59%,62.5%{filter:brightness(.35) blur(1px)}63%,100%{filter:none}}
@media (max-width:700px){.nd{padding:90px 0 60px}.nd-frame{width:calc(100% - 16px)}}
@media (prefers-reduced-motion: reduce){.nd *{animation:none!important}.nd-sp .ln,.nd-big .ln{stroke-dashoffset:0}.nd-bars i{transform:none}.nd-tip,.nd-pin{opacity:1}}

/* enquiry form alignment */
.form{gap:20px}
.form h2{margin:0 0 4px}
.form .f2>.field{min-width:0}
.form .field input,.form .field select,.form .field textarea{width:100%;box-sizing:border-box;min-width:0}
.form .field label,.form .field legend{margin:0}
.form fieldset.field legend{padding:0;margin-bottom:10px}
.form .chips{display:flex;flex-wrap:wrap;gap:8px}
.form .chips label{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;min-height:44px;box-sizing:border-box;border:1px solid rgba(19,19,19,.22);background:#fff;cursor:pointer;
  font-family:var(--display);font-stretch:100%;font-size:14px;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--ink);transition:border-color .2s,background .2s}
.form .chips label:has(input:checked){border-color:var(--red-ink);background:#FCEDEE}
.form .chips input{width:16px;height:16px;margin:0;accent-color:var(--red-ink)}
.form .err:empty{display:none}
@media (max-width:560px){.form{padding:24px 18px}.form .chips label{font-size:13px;padding:9px 12px}}
.form .chips input{min-height:0!important;height:16px!important;width:16px!important;padding:0;border:0;flex:none}

/* contact page hero: one top line, two even columns that start together */
.ct{padding-bottom:110px}
.ct-top{display:grid;gap:22px}
.ct-top .eye{margin:0}
.hero.plain .ct-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start;margin-top:26px}
.ct-left h1{margin:0}
.ct-left .lede{margin-top:26px}
.ct-steps{list-style:none;margin:40px 0 0;padding:0;border-top:1px solid var(--rule)}
.ct-steps li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:0;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--rule)}
.ct-steps .n{font-family:var(--display);font-stretch:110%;font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--red-ink)}
.ct-steps b{display:block;font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:.01em;color:var(--ink)}
.ct-steps p{margin:4px 0 0;font-size:17px;color:var(--muted)}
.ct-grid .form{margin:0}
@media (max-width:900px){.hero.plain .ct-grid{grid-template-columns:1fr;gap:40px}}
.hero.plain.ct{padding-bottom:120px}

/* page loader: the GK mark draws itself once per visit */
.ldr{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:var(--paper);animation:ldr-out .45s ease 1.65s forwards;pointer-events:none}
.ldr-mk{width:128px;height:auto;overflow:visible}
.ldr-mk path{stroke-dasharray:1;stroke-dashoffset:1;animation:orb-draw .8s cubic-bezier(.65,0,.35,1) .1s forwards}
.ldr-mk .d2{animation-delay:.75s;animation-duration:.5s}.ldr-mk .d3{animation-delay:1.15s;animation-duration:.35s}
@keyframes ldr-out{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion: reduce){.ldr{display:none}}

/* brand card sequence: draw in centre (0 to 2.6s), slide to place, rule grows, name writes in */
.bc-word span{display:inline-block}
.brandcard.bc-ready .orb-mark{transform:translateX(var(--dx,0)) scale(1.15)}
.brandcard.bc-ready .bc-rule{transform:scaleY(0)}
.brandcard.bc-ready .bc-word span{opacity:0;transform:translateY(10px);filter:blur(4px)}
.brandcard.bc-play .orb-mark{animation:bc-move .8s cubic-bezier(.7,0,.2,1) 2.7s forwards}
.brandcard.bc-play .bc-rule{animation:bc-rule .45s cubic-bezier(.2,.75,.15,1) 3.35s forwards}
.brandcard.bc-play .bc-word b span{animation:bc-ch .5s cubic-bezier(.2,.75,.15,1) forwards;animation-delay:calc(3.55s + var(--k) * .07s)}
.brandcard.bc-play .bc-word i span{animation:bc-ch .5s cubic-bezier(.2,.75,.15,1) forwards;animation-delay:calc(4.0s + var(--k) * .05s)}
@keyframes bc-move{to{transform:none}}
@keyframes bc-rule{to{transform:none}}
@keyframes bc-ch{to{opacity:1;transform:none;filter:none}}
/* three service cards in one row */
.mgrid>*{border-right:1px solid var(--rule);border-bottom:0}
.mgrid>*:last-child{border-right:0}
@media (max-width:960px) and (min-width:761px){.mgrid>*{padding:32px 24px}}
