/* Salinan CSS situs utama (site/index.html). Dibuat ulang oleh source/build_brand.py — jangan edit manual. */

/* Layout: one wide column laid over a living contour map of the home island.
   Ink rules frame each block; blue is kept for actions and the 360. Single light identity by choice. */
:root{
  --paper:#ffffff; --paper-2:#f2f4f6; --paper-3:#e6e9ed;
  --ink:#15171a; --ink-2:#3b4048; --muted:#5b616b;
  --line:#d8dbe1; --line-2:#b5bac3;
  --blue:#e10004; --blue-deep:#a80003; --neon:#ff2a2a; --sky:#ff6b6b;
  --night:#101216; --night-2:#1a1d23; --on-night:#ffffff; --on-night-2:#cdd2da; --night-line:rgba(255,255,255,.13);
  --gasa:#8a6a00; --gasa-bright:#ffe04b; --humaira:#8f6726; --humaira-bright:#e8bd61;
  --display:'Archivo',Arial,Helvetica,sans-serif;
  --body:'Archivo',Arial,Helvetica,sans-serif;
  --gutter:clamp(18px,4.4vw,64px);
  --ease:cubic-bezier(.22,1,.36,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;position:relative;isolation:isolate;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.72;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
[hidden]{display:none!important}
img{max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
p{margin:0}
::selection{background:var(--blue);color:#fff}
:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
h1,h2,h3{font-family:var(--display);font-weight:900;letter-spacing:-.035em;margin:0;text-wrap:balance}
h2{font-size:clamp(32px,4.2vw,60px);line-height:1.06;letter-spacing:-.045em}
.wrap{max-width:1400px;margin-inline:auto;padding-inline:var(--gutter)}
.label{font-weight:600;font-size:13px;line-height:1.5;font-stretch:112%;letter-spacing:.015em;color:var(--muted)}
.sign{font-weight:700;font-size:11.5px;line-height:1.5;font-stretch:112%;letter-spacing:.09em;text-transform:uppercase}
.brand-name{font-weight:700}
.brand-musa{color:var(--blue)}.brand-gasa{color:var(--gasa)}.brand-humaira{color:var(--humaira)}
.on-night .brand-musa{color:var(--sky)}.on-night .brand-gasa{color:var(--gasa-bright)}.on-night .brand-humaira{color:var(--humaira-bright)}

/* Living background */
.ambient{position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(ellipse 70% 65% at -12% 22%,rgba(21,23,26,.10),transparent 72%),
  radial-gradient(ellipse 60% 65% at 112% 80%,rgba(21,23,26,.09),transparent 74%)}
.ambient canvas,.terrain{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.ambient-toggle{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:30;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--line-2);background:rgba(255,255,255,.94);color:var(--ink-2);border-radius:3px;box-shadow:0 3px 14px rgba(21,23,26,.07);transition:background-color .2s,color .2s}
.ambient-toggle svg{display:block;width:14px;height:14px;fill:currentColor}
.ambient-toggle:hover{background:var(--ink);color:#fff}
body:has(dialog[open]) .ambient-toggle{visibility:hidden}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:13px 24px;border:1px solid var(--ink);border-radius:2px;background:transparent;color:var(--ink);font-weight:700;font-size:14px;line-height:1.2;white-space:nowrap;transition:background-color .2s,color .2s,border-color .2s,transform .22s var(--ease)}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 6px 20px rgba(214,27,29,.2)}
.btn-primary:hover{background:var(--blue-deep);border-color:var(--blue-deep)}
.btn-outline{border-color:var(--blue);color:var(--blue)}
.btn-outline:hover{background:var(--blue);color:#fff}
.btn-sky{background:var(--neon);border-color:var(--neon);color:#2c0405;box-shadow:0 0 26px rgba(255,61,63,.22)}
.btn-sky:hover{background:#ff7a7b;border-color:#ff7a7b}
.btn-ghost-night{border-color:rgba(255,255,255,.55);color:#fff}
.btn-ghost-night:hover{background:#fff;color:var(--night)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.btn-primary:hover,.btn-sky:hover{transform:translateY(-2px)}.btn-primary:active,.btn-sky:active{transform:scale(.98)}}

/* Header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(255,255,255,.88);-webkit-backdrop-filter:saturate(1.3) blur(12px);backdrop-filter:saturate(1.3) blur(12px)}
.site-head-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px;border-bottom:2px solid var(--ink)}
.logo{display:inline-flex;flex-shrink:0;width:176px}
.logo img{display:block;width:100%;height:auto;filter:brightness(0)}
.site-nav{display:flex;align-items:center;gap:clamp(16px,2.6vw,36px);font-weight:700;font-size:14px}
.site-nav a:not(.btn){padding-block:8px;text-underline-offset:7px;text-decoration-thickness:2px}
.site-nav a:not(.btn):hover{text-decoration:underline}
.site-nav .btn{min-height:44px;padding:11px 20px}

/* Hero */
.hero{position:relative;padding-block:clamp(26px,4.4vw,54px) 0}
.hero-grid{position:absolute;z-index:-1;pointer-events:none;top:0;right:0;width:46%;height:280px;background-image:linear-gradient(rgba(21,23,26,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(21,23,26,.045) 1px,transparent 1px);background-size:38px 38px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 70%);mask-image:linear-gradient(90deg,transparent,#000 70%)}
.hero-top{display:flex;justify-content:space-between;gap:16px}
.hero-top .label{color:var(--ink-2)}
.hero-heading{display:flex;align-items:center;justify-content:space-between;gap:clamp(18px,3vw,40px);margin-block:clamp(20px,3vw,38px) clamp(26px,3.6vw,46px)}
h1{flex:1;min-width:0;font-size:clamp(38px,6.5vw,98px);line-height:1.02;letter-spacing:-.054em}
h1 .n360{color:var(--hero-accent,var(--blue));text-shadow:0 0 26px rgba(255,61,63,.16);transition:color .45s var(--ease)}
h1 em{font-style:normal;display:inline-block}
h1 em::after{content:'';display:block;width:84px;height:3px;margin-top:clamp(16px,2vw,24px);background:var(--hero-accent,var(--blue));transition:background-color .45s var(--ease),width .45s var(--ease)}
.hero[data-brand] h1 em::after{width:140px}
.hero[data-brand="musa"]{--hero-accent:var(--blue)}.hero[data-brand="gasa"]{--hero-accent:#b98f00}.hero[data-brand="humaira"]{--hero-accent:var(--humaira)}
.seal{position:relative;flex-shrink:0;width:168px;aspect-ratio:1;border-radius:50%;border:1px solid #ee2426;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;transform:rotate(-12deg);background:rgba(255,255,255,.7);box-shadow:0 0 26px rgba(255,61,63,.14),inset 0 0 16px rgba(255,61,63,.07)}
.seal::before{content:'';position:absolute;inset:5px;border-radius:50%;background:repeating-conic-gradient(from -.4deg,rgba(214,27,29,.55) 0 .8deg,transparent .8deg 6deg);-webkit-mask-image:radial-gradient(circle,transparent calc(71% - 7px),#000 calc(71% - 6px),#000 calc(71% - 1px),transparent 71%);mask-image:radial-gradient(circle,transparent calc(71% - 7px),#000 calc(71% - 6px),#000 calc(71% - 1px),transparent 71%)}
.seal strong{font-weight:900;font-size:44px;line-height:1;letter-spacing:-.04em;color:var(--blue)}
.seal span{font-size:11px;letter-spacing:.09em;font-weight:700;font-stretch:108%;line-height:1}
.hero-bottom{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.32fr);gap:5.5%;align-items:stretch}
.intro{display:flex;flex-direction:column;justify-content:space-between;gap:36px}
.intro p{max-width:40ch;font-size:18px;line-height:1.75;color:var(--ink-2);margin-bottom:26px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--ink)}
.facts div{padding:18px 16px 4px 0;font-size:13.5px;line-height:1.45;color:var(--muted)}
.facts div+div{padding-left:16px;border-left:1px solid var(--line)}
.facts b{display:block;margin-bottom:6px;font-weight:900;font-size:clamp(32px,3.6vw,54px);line-height:1;letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.stage{position:relative;isolation:isolate;height:clamp(420px,38vw,560px);overflow:hidden;border:1px solid var(--ink);border-radius:3px;background:var(--night)}
.stage-video{position:absolute;inset:0;z-index:-3;display:block;width:100%;height:100%;object-fit:cover}
.stage-shade{position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse 34% 42% at 50% 54%,rgba(13,15,19,.44),transparent 80%),linear-gradient(180deg,rgba(13,15,19,.72),rgba(13,15,19,.06) 28%,rgba(13,15,19,.1) 66%,rgba(13,15,19,.8))}
.stage::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 36% 42% at 50% 54%,var(--glow,transparent),transparent 72%);opacity:.55;transition:background .5s var(--ease)}
.stage[data-brand="musa"]{--glow:rgba(255,61,63,.55)}.stage[data-brand="gasa"]{--glow:rgba(255,214,60,.5)}.stage[data-brand="humaira"]{--glow:rgba(232,189,97,.5)}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.stage-top,.stage-bottom{position:absolute;left:20px;right:20px;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:12px;pointer-events:none;color:#fff}
.stage-top .label{color:#fff}
.stage-now{display:inline-flex;align-items:center;gap:8px}
.stage-now::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--neon);box-shadow:0 0 10px var(--neon)}
.stage-top{top:18px}
.stage-bottom{bottom:16px;flex-wrap:wrap;font-size:12.5px}
.stage-hint,#motion-reset{display:none}
.is-3d .stage-hint{display:inline}
.is-3d #motion-reset{display:inline-block}
.stage-controls{display:flex;gap:8px;margin-left:auto;pointer-events:auto}
.stage-controls button{min-height:36px;padding:8px 12px;border:1px solid rgba(255,255,255,.5);border-radius:2px;background:rgba(255,255,255,.94);color:var(--ink);font-weight:700;font-size:12px;transition:background-color .2s,color .2s,border-color .2s}
.stage-controls button:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.stage-touch{display:none;position:absolute;inset:50px 0 62px;z-index:2;cursor:grab;touch-action:pan-y}
.is-3d .stage-touch{display:block}
.stage-touch:active{cursor:grabbing}
.stage-touch:focus-visible{outline-offset:-8px}
.orbit-label{position:absolute;z-index:3;max-width:46%;padding:9px 14px;border:1px solid #fff;border-radius:30px;background:rgba(255,255,255,.86);cursor:pointer;transition:background-color .3s,border-color .3s,box-shadow .3s,scale .3s var(--ease);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:12.5px;font-weight:700;line-height:1.35;text-align:center;box-shadow:0 7px 16px rgba(21,23,26,.06)}
.orbit-label:hover,.orbit-label.is-on{background:var(--ink);border-color:rgba(255,255,255,.7);box-shadow:0 10px 24px rgba(21,23,26,.22);scale:1.06}
.orbit-label:hover .brand-musa,.orbit-label.is-on .brand-musa{color:var(--sky)}.orbit-label:hover .brand-gasa,.orbit-label.is-on .brand-gasa{color:var(--gasa-bright)}.orbit-label:hover .brand-humaira,.orbit-label.is-on .brand-humaira{color:var(--humaira-bright)}
.orbit-label .brand-name{transition:color .3s}
.orbit-one{top:22%;left:5%;transform:rotate(-9deg)}
.orbit-two{top:49%;right:4%;transform:rotate(7deg)}
.orbit-three{bottom:19%;left:11%;transform:rotate(-5deg)}
.reel{position:relative;margin-top:clamp(30px,3.6vw,48px);padding-block:10px;overflow:hidden;background:var(--ink)}
.reel-track{display:flex;gap:10px;width:max-content;animation:reel 80s linear infinite}
.reel:hover .reel-track,.reel:focus-within .reel-track,.ambient-paused .reel-track{animation-play-state:paused}
.reel figure{position:relative;flex:none;height:clamp(210px,25vw,340px);margin:0;overflow:hidden;background:var(--night-2)}
.reel img{display:block;width:auto;height:100%;max-width:none}
.reel figcaption{position:absolute;inset:auto 0 0 0;display:flex;align-items:center;gap:8px;padding:30px 12px 10px;background:linear-gradient(transparent,rgba(16,18,22,.82));color:#fff;font-weight:600;font-size:12.5px;line-height:1.3}
.reel figcaption::before{content:'';flex:none;width:7px;height:7px;border-radius:50%;background:var(--dot,var(--sky))}
.reel [data-b="gasa"]{--dot:var(--gasa-bright)}.reel [data-b="humaira"]{--dot:var(--humaira-bright)}
@keyframes reel{to{transform:translateX(calc(-50% - 5px))}}
.disc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:34px 0 0;padding:0;list-style:none;border-top:2px solid var(--ink)}
.disc li{padding:14px 12px 0 0;font-weight:700;font-size:15px;line-height:1.35}
.disc li+li{padding-left:14px;border-left:1px solid var(--line)}
.proof{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:10px 32px;padding-block:24px;border-bottom:1px solid var(--line-2)}
.proof ul{display:flex;flex-wrap:wrap;gap:6px 26px;margin:0;padding:0;list-style:none}
.proof button{padding:4px 0;border:0;background:none;font-weight:700;font-size:16.5px;line-height:1.4;letter-spacing:-.01em;color:var(--ink);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;text-decoration-thickness:2px;transition:color .2s,text-decoration-color .2s}
.proof button:hover{color:var(--blue);text-decoration-color:var(--blue)}

.agenda{position:relative;isolation:isolate;margin-top:clamp(40px,5vw,72px);background:var(--blue);color:#fff;overflow:hidden}
.agenda::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(115deg,transparent 0 46px,rgba(255,255,255,.06) 46px 47px)}
.agenda-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px clamp(24px,4vw,64px);padding-block:clamp(22px,2.8vw,34px)}
.agenda .label{color:#ffd3d3}
.agenda h2{margin-top:4px;font-size:clamp(24px,2.9vw,40px);line-height:1.05;letter-spacing:-.04em}
.agenda-meta{margin-top:6px;font-size:15px;line-height:1.5;color:#ffe4e4}
.count{display:grid;grid-template-columns:repeat(4,auto);gap:0;font-variant-numeric:tabular-nums}
.count div{min-width:74px;padding-inline:14px;text-align:center;border-left:1px solid rgba(255,255,255,.3);font-size:12.5px;line-height:1.3;color:#ffd3d3}
.count div:first-child{border-left:0;padding-left:0}
.count b{display:block;font-weight:900;font-size:clamp(30px,3.4vw,50px);line-height:1;letter-spacing:-.04em;color:#fff}
.agenda .btn{border-color:#fff;background:#fff;color:var(--blue-deep)}
.agenda .btn:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.agenda :focus-visible{outline-color:#fff}
.agenda-list{display:flex;flex-wrap:wrap;gap:6px 26px;margin:0;padding:14px 0 18px;list-style:none;border-top:1px solid rgba(255,255,255,.28);font-size:14px;color:#ffe4e4}
.agenda-list b{color:#fff}
.agenda-list span{margin-right:4px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#ffd3d3}
.agenda-tba{margin:0;padding-left:clamp(16px,2.4vw,32px);border-left:1px solid rgba(255,255,255,.3);font-size:13px;line-height:1.35;color:#ffd3d3}
.agenda-tba b{display:block;font-weight:900;font-size:clamp(30px,3.4vw,50px);line-height:1;letter-spacing:-.04em;color:#fff}

.feat{margin-bottom:clamp(26px,3.4vw,44px);background:var(--night);color:#fff;border:1px solid var(--ink)}
.feat-stage{position:relative;aspect-ratio:2400/1067;overflow:hidden;background:var(--night-2)}
.feat-slide{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;background:none;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s}
.feat-slide.is-on{opacity:1;visibility:visible}
.feat-slide img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.feat-slide:hover img{transform:scale(1.025)}
.feat-slide:focus-visible{outline-offset:-5px;outline-color:var(--neon)}
.feat-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px 28px;padding:16px 20px}
.feat-cap{font-size:15px;line-height:1.5;color:var(--on-night-2)}
.feat-cap b{color:#fff}
.feat-tabs{display:flex;flex-wrap:wrap;gap:8px}
.feat-tabs button{min-height:40px;padding:8px 14px;border:1px solid rgba(255,255,255,.4);border-radius:2px;background:transparent;color:#fff;font-weight:700;font-size:13.5px;line-height:1.2;transition:background-color .2s,color .2s,border-color .2s}
.feat-tabs button:hover{border-color:#fff}
.feat-tabs button[aria-selected="true"]{background:#fff;border-color:#fff;color:var(--night)}
.work-open .work-alt{position:absolute;inset:0;opacity:0;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.work-open:hover .work-alt,.work-open:focus-visible .work-alt{opacity:1}
.work-open span{z-index:1}

.press{isolation:isolate}
.press-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none;border-top:2px solid var(--ink);background:rgba(255,255,255,.82)}
.press-cols li{padding:22px 26px 26px 0}
.press-cols li+li{padding-left:26px;border-left:1px solid var(--line)}
.press-cols time{display:block;font-weight:700;font-size:13.5px;font-variant-numeric:tabular-nums}
.press-cols small{display:block;margin-bottom:12px;font-size:13.5px;color:var(--muted)}
.press-cols h3{font-size:clamp(19px,1.75vw,24px);line-height:1.22;letter-spacing:-.03em;font-weight:900}
.press-cols h3 a{background:linear-gradient(var(--blue),var(--blue)) 0 100%/0 2px no-repeat;transition:background-size .35s var(--ease),color .2s}
.press-cols h3 a:hover{color:var(--blue);background-size:100% 2px}
.press-more{margin-top:26px}

/* Sections */
.sec{position:relative;padding-block:clamp(64px,8vw,112px)}
.sec-head{position:relative;display:flex;justify-content:space-between;align-items:end;gap:32px;padding-top:26px;margin-bottom:clamp(28px,3.6vw,48px);border-top:1px solid var(--line-2)}
.sec-head::before{content:'';position:absolute;left:0;top:-2px;width:64px;height:3px;background:var(--blue);box-shadow:0 0 12px rgba(255,61,63,.22)}
.sec-head h2{margin-top:12px}
.sec-head>p{max-width:38ch;color:var(--muted);line-height:1.7}

/* Tentang */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:7%}
.about{isolation:isolate}
.about::before{content:'';position:absolute;z-index:-1;inset:40px auto 40px 0;width:26%;pointer-events:none;background-image:radial-gradient(rgba(21,23,26,.2) .9px,transparent .9px);background-size:12px 12px;-webkit-mask-image:linear-gradient(120deg,#000,transparent 75%);mask-image:linear-gradient(120deg,#000,transparent 75%)}
.about-label{display:flex;flex-direction:column;justify-content:space-between;gap:36px}
.about-mark{max-width:250px}
.about-mark img{display:block;width:100%;height:auto;filter:brightness(0);opacity:.14}
.about-mark span{display:block;margin-top:14px;color:var(--muted)}
.about h2{font-size:clamp(27px,3vw,42px);line-height:1.18;max-width:26ch}
.about-body p{max-width:68ch;margin-top:26px;color:var(--ink-2)}
.company{margin-top:32px;border-block:1px solid var(--line);padding-block:18px}
.company summary{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:700;font-size:15px;cursor:pointer;list-style:none}
.company summary::-webkit-details-marker{display:none}
.company summary::after{content:'';flex-shrink:0;width:9px;height:9px;margin-right:4px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translateY(-3px) rotate(45deg);transition:transform .2s var(--ease)}
.company[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.company summary:hover{color:var(--blue)}
.company dl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:10px 24px;margin:18px 0 4px;font-size:14.5px;line-height:1.6}
.company dt{color:var(--muted)}.company dd{margin:0}

/* Visi & misi */
.night{background:var(--night);color:var(--on-night);isolation:isolate;overflow:hidden}
.night .terrain{z-index:-1}
.vision::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:url('../ig/vision.webp') 30% center/cover;filter:grayscale(1) contrast(1.08);opacity:.55}
.vision::after{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,rgba(16,18,22,.45),rgba(16,18,22,.94) 66%),linear-gradient(180deg,var(--night),transparent 22%,transparent 74%,var(--night))}
.vision-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8%}
.vision-lead{border-left:3px solid var(--neon);padding-left:28px;align-self:start}
.vision .label{color:var(--sky)}
.vision h2{margin:14px 0 22px}
.vision p{color:var(--on-night-2)}
.vision-lead p{max-width:44ch}
.mission{list-style:none;counter-reset:m;margin:18px 0 0;padding:0}
.mission li{counter-increment:m;display:grid;grid-template-columns:44px minmax(0,1fr);padding-block:20px;border-bottom:1px solid var(--night-line)}
.mission li:last-child{border-bottom:0;padding-bottom:0}
.mission li::before{content:counter(m,decimal-leading-zero);font-weight:700;font-size:14px;line-height:1.75;color:var(--sky);font-variant-numeric:tabular-nums}
.mission h3{font-size:19px;line-height:1.35;letter-spacing:-.02em;font-weight:700}
.mission p{grid-column:2;margin-top:6px;font-size:15.5px;line-height:1.7}

/* Tim */
.team{isolation:isolate;border-bottom:1px solid var(--line)}
.team::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background-color:rgba(238,241,244,.8);background-image:linear-gradient(rgba(21,23,26,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(21,23,26,.035) 1px,transparent 1px);background-size:52px 52px}
.team-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.member{min-width:0;background:var(--paper);border:1px solid var(--line);box-shadow:0 10px 24px rgba(21,23,26,.045)}
.member-photo{aspect-ratio:1;overflow:hidden;background:var(--paper-3)}
.member-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.member-cap{position:relative;padding:16px 18px 20px;border-top:3px solid var(--ink)}
.member-cap::after{content:'';position:absolute;right:16px;top:20px;width:8px;height:8px;border:1px solid var(--line-2)}
.member h3{font-size:22px;line-height:1.25;padding-right:20px}
.member p{margin-top:4px;font-size:14px;line-height:1.5;color:var(--muted)}

/* Tiga brand */
.units{isolation:isolate}
.units::before{content:'';position:absolute;z-index:-1;right:0;top:6%;width:40%;height:86%;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 18px,rgba(21,23,26,.04) 18px 19px);-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)}
.unit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
.unit{position:relative;min-width:0;padding:26px 24px 22px;background:rgba(255,255,255,.9);border:1px solid var(--line);border-top:3px solid var(--ink);box-shadow:0 12px 28px rgba(21,23,26,.04)}
.unit::before{content:'';position:absolute;right:22px;top:25px;width:24px;height:24px;border:1px solid var(--line-2);border-radius:50%}
.unit:nth-child(2)::before{width:19px;height:19px;border-radius:0;transform:rotate(45deg);right:25px;top:27px}
.unit:nth-child(3)::before{width:32px;height:20px;top:27px}
.unit-kind{display:block;padding-right:48px}
.unit-photo{position:relative;margin-top:20px;aspect-ratio:16/10;background:var(--paper-3)}
.unit-photo>img{display:block;width:100%;height:100%;object-fit:cover}
.unit-logo{position:absolute;left:12px;bottom:12px;display:grid;place-items:center;width:104px;height:78px;padding:12px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:0 8px 18px rgba(21,23,26,.12)}
.unit-logo img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;object-position:50% 50%;margin:auto}
.unit-logo-gasa{background:var(--ink);border-color:var(--ink)}
.unit.is-target{outline:3px solid var(--blue);outline-offset:4px}
.unit h3{margin:24px 0 12px;font-size:clamp(24px,2.1vw,30px);line-height:1.15}
.unit h3 .brand-name{font-weight:inherit}
.unit>p{color:var(--ink-2);font-size:16px;line-height:1.75;margin-bottom:14px}
.unit details{border-top:1px solid var(--line)}
.unit summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;font-weight:700;font-size:14.5px;cursor:pointer;list-style:none}
.unit summary::-webkit-details-marker{display:none}
.unit summary::after{content:'';flex-shrink:0;width:9px;height:9px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translateY(-3px) rotate(45deg);transition:transform .2s var(--ease)}
.unit details[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.unit summary:hover{color:var(--blue)}
.unit ul{margin:0 0 16px;padding-left:18px;font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.unit li{margin-bottom:7px;break-inside:avoid}
.unit li::marker{color:var(--line-2)}

/* Portofolio */
.works{isolation:isolate;border-block:1px solid var(--line)}
.works::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-color:rgba(228,231,235,.84);background-image:radial-gradient(ellipse at 2% 0%,rgba(250,251,252,.85),transparent 58%),radial-gradient(ellipse at 100% 100%,rgba(150,156,166,.24),transparent 62%),radial-gradient(rgba(21,23,26,.1) .7px,transparent .7px);background-size:auto,auto,14px 14px}
.works .sec-head{border-top-color:var(--line-2)}
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:22px}
.filters button{min-height:44px;padding:11px 18px;border:1px solid var(--ink);border-radius:2px;background:rgba(255,255,255,.9);font-weight:700;font-size:14px;line-height:1.2;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}
.filters button:hover{background:#fff;box-shadow:inset 0 -3px var(--line-2)}
.filters button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 4px 14px rgba(214,27,29,.16)}
.filters button[data-filter="event"][aria-pressed="true"]{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 -3px var(--neon)}
.filters button[data-filter="event"][aria-pressed="true"] .brand-musa{color:var(--sky)}
.filters button[data-filter="gasa"][aria-pressed="true"]{background:#fffbe6;border-color:var(--ink);color:var(--ink);box-shadow:inset 0 -3px var(--gasa-bright)}
.filters button[data-filter="humaira"][aria-pressed="true"]{background:#fdf6e7;border-color:var(--ink);color:var(--ink);box-shadow:inset 0 -3px var(--humaira-bright)}
.works-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.works-count{font-size:14px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.works-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.work{min-width:0;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);overflow:hidden;transition:border-color .25s,box-shadow .25s}
.work:hover{border-color:var(--ink-2);box-shadow:0 10px 24px rgba(21,23,26,.07)}
.works-more{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:26px}
.works-more .btn{background:rgba(255,255,255,.9)}
.works-more .btn:hover{background:var(--ink);color:#fff}
.works-more .btn-text{min-height:48px;padding:13px 8px;border:0;background:none;font-weight:700;font-size:14px;text-decoration:underline;text-underline-offset:6px}
.works-more .btn-text:hover{color:var(--blue)}
.work-open{position:relative;display:block;width:100%;aspect-ratio:4/3;padding:0;border:0;background:var(--paper-3);overflow:hidden;text-align:left;color:#fff}
.work-open img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s var(--ease)}
.work-open:hover img{transform:scale(1.04)}
.work-open span{position:absolute;inset:auto 0 0 0;padding:34px 16px 13px;background:linear-gradient(transparent,rgba(16,18,22,.86));font-size:13px;font-weight:600}
.work-open:focus-visible{outline-width:3px;outline-offset:-4px}
.work-meta{display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;flex:1;padding:18px 18px 20px;border-top:3px solid var(--ink)}
.work-no{padding-top:3px;font-weight:700;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.work h3{font-size:20px;line-height:1.25;letter-spacing:-.025em;overflow-wrap:anywhere}
.work-brands{margin-top:8px;font-size:13.5px;line-height:1.55}
.work-brands span{display:block}
.work small{display:block;margin-top:8px;font-size:12.5px;color:var(--muted)}
.works-note{max-width:78ch;margin-top:24px;padding:13px 18px;font-size:14px;line-height:1.65;color:var(--ink-2);background:rgba(255,255,255,.6);border:1px solid var(--line)}

/* Proses */
.process{isolation:isolate}
.process::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 0% 50%,rgba(190,196,205,.34),transparent 62%)}
.process-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:8%;align-items:center}
.process h2{margin-top:12px}
.process h2 em{font-style:normal}
.dial{position:relative;width:min(100%,348px);margin-top:clamp(28px,3.4vw,44px);aspect-ratio:1}
.dial svg{display:block;width:100%;height:100%;overflow:visible}
.hud-ring-a,.hud-ring-b,.hud-ring-c,.hud-sweep{transform-origin:150px 150px}
.hud-ring-a{fill:none;stroke:rgba(255,135,136,.6);stroke-width:5;stroke-dasharray:1 6.383;animation:hud-spin 90s linear infinite}
.hud-ring-b{fill:none;stroke:rgba(255,61,63,.42);stroke-width:2;stroke-dasharray:46 14 4 14 4 14;animation:hud-spin 48s linear infinite reverse}
.hud-ring-c{fill:none;stroke:rgba(255,135,136,.34);stroke-width:1;stroke-dasharray:2 7;animation:hud-spin 60s linear infinite}
.hud-line{fill:none;stroke:rgba(255,135,136,.34);stroke-width:1}
.hud-cross{fill:none;stroke:rgba(255,135,136,.75);stroke-width:1.2}
.hud-sweep{animation:hud-spin 7s linear infinite}
.hud-sweep path{fill:var(--neon)}
.hud-sweep .hud-edge{fill:none;stroke:var(--neon);stroke-width:1.2;opacity:.8}
@keyframes hud-spin{to{transform:rotate(360deg)}}
.ambient-paused .hud-ring-a,.ambient-paused .hud-ring-b,.ambient-paused .hud-ring-c,.ambient-paused .hud-sweep{animation-play-state:paused}
.dial-arc{fill:none;stroke:rgba(255,255,255,.13);stroke-width:8;transition:stroke .4s var(--ease),stroke-width .4s var(--ease)}
.dial-arc.done{stroke:rgba(255,125,126,.62)}
.dial-arc.on{stroke:var(--neon);stroke-width:11;filter:url(#hud-glow)}
.dial-prog{fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;opacity:.9}
.hud-nodes circle{fill:#0b0f18;stroke:var(--neon);stroke-width:1.4}
.hud-n{font-family:var(--display);font-weight:800;font-size:9.5px;letter-spacing:.08em;fill:rgba(255,180,181,.5);transition:fill .3s}
.hud-n.on{fill:#fff}
.dial-needle{transform-origin:150px 150px;transition:transform .25s linear}
.dial-needle path{fill:none;stroke:var(--neon);stroke-width:1.4}
.dial-needle circle{fill:#fff;stroke:var(--neon);stroke-width:2.4;filter:url(#hud-glow)}
.dial-read{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;color:#fff}
.dial-read small{font-weight:700;font-size:9.5px;line-height:1;font-stretch:112%;letter-spacing:.2em;color:#ff8f90;font-variant-numeric:tabular-nums}
.dial-read b{font-weight:900;font-size:clamp(46px,5.4vw,66px);line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums;text-shadow:0 0 22px rgba(255,61,63,.75),0 0 2px rgba(255,61,63,.9)}
.dial-read span{max-width:13ch;font-size:12.5px;line-height:1.35;color:#f6c8c9}
.hud-corner{position:absolute;width:20px;height:20px;border:0 solid var(--blue)}
.hud-corner.tl{left:0;top:0;border-width:2px 0 0 2px}.hud-corner.tr{right:0;top:0;border-width:2px 2px 0 0}
.hud-corner.bl{left:0;bottom:0;border-width:0 0 2px 2px}.hud-corner.br{right:0;bottom:0;border-width:0 2px 2px 0}
.hud-tag{position:absolute;font-weight:700;font-size:9.5px;line-height:1;font-stretch:112%;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.hud-tag b{font-weight:900;color:var(--blue)}
.hud-tag.tl{left:8px;top:8px}.hud-tag.tr{right:8px;top:8px}.hud-tag.bl{left:8px;bottom:8px}.hud-tag.br{right:8px;bottom:8px;text-align:right;line-height:1.4}
.steps{background:rgba(255,255,255,.82);border:1px solid var(--line);padding:4px 24px}
.steps details{border-bottom:1px solid var(--line)}
.steps details:last-child{border-bottom:0}
.steps summary{display:flex;align-items:center;gap:22px;padding:20px 0;font-weight:700;font-size:clamp(18px,1.6vw,21px);line-height:1.3;letter-spacing:-.015em;cursor:pointer;list-style:none}
.steps summary::-webkit-details-marker{display:none}
.steps summary span{font-size:13.5px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:0}
.steps summary::after{content:'+';margin-left:auto;font-weight:400;font-size:24px;line-height:1;color:var(--blue)}
.steps details[open] summary::after{content:'−'}
.steps details[open] summary span{color:var(--blue)}
.steps details p{padding:0 0 22px 44px;max-width:60ch;color:var(--ink-2)}

/* Kontak */
.contact{border-top:6px solid var(--line-2);background-image:radial-gradient(ellipse at 0% 100%,rgba(86,92,104,.5),transparent 62%),radial-gradient(ellipse at 100% 0%,rgba(60,70,90,.34),transparent 60%),linear-gradient(115deg,#17191e,#090a0c)}
.contact .label{display:flex;align-items:center;gap:16px;color:var(--sky)}
.contact .label::before{content:'';width:44px;height:1px;background:var(--neon);box-shadow:0 0 14px rgba(255,61,63,.6)}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:8%;align-items:end}
.contact h2{margin-block:18px 20px;font-size:clamp(34px,4.4vw,62px);line-height:1.06}
.contact-lead{max-width:46ch;margin-bottom:28px;color:var(--on-night-2)}
.channels{margin:0;border-top:1px solid rgba(255,255,255,.22)}
.channels>div{display:grid;grid-template-columns:104px minmax(0,1fr);align-items:baseline;gap:16px;padding-block:18px;border-bottom:1px solid rgba(255,255,255,.22)}
.channels dt{font-size:13px;color:var(--on-night-2)}
.channels dd{margin:0;font-weight:700;font-size:clamp(17px,1.5vw,20px);line-height:1.35;letter-spacing:-.01em}
.channels a{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;overflow-wrap:anywhere;transition:color .2s,text-decoration-color .2s}
.channels a:hover{color:var(--sky);text-decoration-color:var(--sky)}
.mail-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.copy-btn{min-height:30px;padding:4px 10px;border:1px solid rgba(255,255,255,.4);border-radius:2px;background:transparent;color:#fff;font-weight:700;font-size:12px;letter-spacing:0;transition:background-color .2s,color .2s}
.copy-btn:hover{background:#fff;color:var(--night)}
.contact :focus-visible{outline-color:var(--sky)}
.brief{margin-top:38px;padding-top:30px;border-top:1px solid rgba(255,255,255,.22)}
.form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.brief label{display:block;font-size:14px;font-weight:600}
.brief input,.brief select,.brief textarea{display:block;width:100%;margin-top:8px;padding:14px;border:1px solid rgba(255,255,255,.42);border-radius:2px;background:var(--night-2);color:#fff;transition:border-color .2s,background-color .2s}
.brief input::placeholder,.brief textarea::placeholder{color:#aeb4bf}
.brief input:focus-visible,.brief select:focus-visible,.brief textarea:focus-visible{outline-offset:2px;border-color:var(--sky)}
.brief textarea{min-height:120px;resize:vertical;line-height:1.6}
.brief .full{grid-column:1/-1}
.brief-note{margin:18px 0;font-size:14px;color:var(--on-night-2)}
.brief-out{margin-top:26px;padding:20px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.04)}
.brief-out textarea{min-height:190px;font-size:14.5px}
.brief-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px}
.status{font-size:14px;line-height:1.5;color:var(--on-night-2)}

/* Footer */
.site-foot{background:rgba(255,255,255,.9)}
.site-foot-in{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;padding-block:34px;border-top:2px solid var(--ink);font-size:13.5px;line-height:1.7;color:var(--muted)}
.site-foot a:not(.logo){font-weight:700;color:var(--ink);text-underline-offset:5px}
.site-foot a:not(.logo):hover{text-decoration:underline}
.foot-nav{display:flex;flex-wrap:wrap;gap:6px 22px}

/* Galeri */
.doc{width:min(760px,94vw);max-height:92dvh;padding:22px;border:1px solid var(--line-2);background:var(--paper);color:var(--ink);overflow:auto}
.doc::backdrop{background:rgba(9,10,12,.82)}
.doc[open]{animation:doc-in .22s var(--ease)}
@keyframes doc-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.doc-head{display:flex;justify-content:space-between;align-items:start;gap:16px;margin-bottom:16px}
.doc h2{font-size:clamp(21px,2.4vw,27px);line-height:1.25;letter-spacing:-.03em}
.doc button{min-height:44px;padding:10px 14px;border:1px solid var(--line-2);border-radius:2px;background:var(--paper);font-weight:700;font-size:14px;transition:background-color .2s,color .2s}
.doc button:hover:not(:disabled){background:var(--ink);color:#fff}
.doc button:disabled{opacity:.38;cursor:default}
.doc-stage{display:flex;align-items:center;justify-content:center;min-height:260px;background:var(--night)}
.doc-stage img{display:block;width:auto;height:auto;min-width:min(100%,420px);max-width:100%;max-height:58dvh;object-fit:contain}
.doc-cap{margin:12px 0;font-size:14px;color:var(--muted)}
.doc-actions{display:flex;align-items:center;justify-content:space-between;gap:14px}
.doc-pos{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}

/* Narrower screens */
@media(max-width:1180px){
  .unit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .unit:last-child:nth-child(odd){grid-column:1/-1}
  .unit:last-child:nth-child(odd) ul{columns:2;column-gap:28px}
  .works-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:960px){
  .team-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .member{grid-column:span 2}
  .member:nth-child(n+4){grid-column:span 3;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .member:nth-child(n+4) .member-cap{border-top:0;border-left:3px solid var(--ink);display:flex;flex-direction:column;justify-content:center}
  .hero-bottom{grid-template-columns:minmax(0,1fr);gap:28px}
  .intro p{max-width:60ch}
  .seal{width:140px}.seal strong{font-size:37px}.seal span{font-size:10px}
  .disc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .disc li{padding:12px 10px 12px 0}
  .disc li:nth-child(odd){padding-left:0;border-left:0}
  .disc li:nth-child(n+3){border-top:1px solid var(--line)}
  .about-grid,.vision-grid,.process-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .about-mark{display:none}
  .dial{width:min(100%,300px)}
  .hero-bottom{align-items:start}
  .agenda-in{grid-template-columns:minmax(0,1fr);gap:18px}
  .count{justify-content:start}
  .agenda-tba{padding-left:0;border-left:0}
  .press-cols{grid-template-columns:minmax(0,1fr)}
  .press-cols li,.press-cols li+li{padding:20px 0;border-left:0}
  .press-cols li+li{border-top:1px solid var(--line)}
  .feat-bar{grid-template-columns:minmax(0,1fr)}
  .proof{grid-template-columns:minmax(0,1fr)}
  .contact-grid{grid-template-columns:minmax(0,1fr);gap:40px;align-items:start}
}
@media(max-width:760px){
  html{scroll-padding-top:84px}
  body{font-size:16px}
  .site-head-in{height:64px}
  .logo{width:148px}
  .site-nav > a:not(.btn):not([href^="artikel"]){display:none}
  .site-nav .btn{padding:10px 14px;font-size:13px}
  .hero-top span:last-child{display:none}
  .hero-heading{display:block}
  .seal{display:none}
  .intro p{font-size:17px}
  .count div{min-width:60px;padding-inline:10px}

  .stage-top span:last-child{display:none}
  .stage-bottom{justify-content:center}
  .stage-hint{width:100%;text-align:center}
  .orbit-label{max-width:48%;padding:8px 10px;font-size:10.5px}
  .orbit-one{left:3%}.orbit-two{right:3%;top:52%}.orbit-three{left:5%;bottom:24%}
  .sec-head{display:block}
  .sec-head>p{max-width:none;margin-top:14px}
  .about::before{width:60%;opacity:.6}
  .facts div{padding:14px 10px 2px 0;font-size:12.5px}
  .facts div+div{padding-left:10px}
  .company dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .company dd{margin-bottom:10px}
  .vision-lead{padding-left:20px}
  .team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .member,.member:nth-child(n+4){grid-column:auto;display:block}
  .member:nth-child(n+4) .member-cap{border-left:0;border-top:3px solid var(--ink);display:block}
  .member:last-child:nth-child(odd){grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .member:last-child:nth-child(odd) .member-cap{border-top:0;border-left:3px solid var(--ink);display:flex;flex-direction:column;justify-content:center}
  .member-cap{padding:13px 13px 16px}
  .member h3{font-size:19px}
  .unit-grid{grid-template-columns:minmax(0,1fr)}
  .unit:last-child:nth-child(odd) ul{columns:1}
  .works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .work-meta{grid-template-columns:minmax(0,1fr);padding:13px 13px 15px}
  .work-no{display:none}
  .work h3{font-size:16.5px}
  .work-brands{font-size:12.5px}
  .work-open span{padding:26px 12px 10px;font-size:12px}
  .channels>div{grid-template-columns:minmax(0,1fr);gap:2px}
  .steps{padding:2px 16px}
  .steps summary{gap:16px}
  .steps details p{padding-left:0}
  .contact{border-top-width:4px}
  .form-grid{grid-template-columns:minmax(0,1fr)}
  .brief .full{grid-column:auto}
  .site-foot-in{padding-bottom:70px}
}

/* ---------- V5: header, logo stripes drift behind the bar; the rule doubles as a reading meter ---------- */
.site-head{overflow:hidden;background:linear-gradient(90deg,rgba(255,255,255,.93),rgba(255,248,245,.86) 50%,rgba(255,255,255,.93))}
.site-head::before{content:'';position:absolute;inset:0 -30px 0 0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(117deg,transparent 0 21.4px,rgba(214,27,29,.085) 21.4px 26.73px);-webkit-mask-image:linear-gradient(90deg,transparent 14%,#000 34%,#000 50%,transparent 72%);mask-image:linear-gradient(90deg,transparent 14%,#000 34%,#000 50%,transparent 72%);animation:head-drift 5s linear infinite}
.ambient-paused .site-head::before{animation-play-state:paused}
@keyframes head-drift{to{transform:translateX(-30px)}}
.site-head-in{position:relative}
.site-head-in::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--blue);transform:scaleX(var(--read,0));transform-origin:0 50%;transition:transform .2s linear}

/* ---------- V5: region strip ---------- */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.regions{position:relative;overflow:hidden;background:var(--blue);color:#fff}
.regions-track{display:flex;align-items:center;width:max-content;padding-block:11px;animation:regions 54s linear infinite}
.regions-track span{font-weight:800;font-size:15px;line-height:1.2;font-stretch:108%;letter-spacing:.02em;white-space:nowrap}
.regions-track i{flex:none;width:17px;height:11px;margin-inline:20px;background:repeating-linear-gradient(90deg,#fff 0 4px,transparent 4px 6.5px);transform:skewX(-27deg);opacity:.85}
.ambient-paused .regions-track{animation-play-state:paused}
@keyframes regions{to{transform:translateX(-50%)}}

/* ---------- V5: cover ---------- */
.cover{position:relative;isolation:isolate;display:grid;place-items:center;min-height:clamp(520px,calc(100svh - 116px),900px);overflow:hidden;background:#2b0304;color:#fff;text-align:center}
.cover-photo{position:absolute;inset:0;z-index:-3;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 58%;animation:cover-drift 26s ease-in-out infinite alternate}
.ambient-paused .cover-photo{animation-play-state:paused}
@keyframes cover-drift{from{transform:scale(1.03)}to{transform:scale(1.11) translateY(-1.2%)}}
.cover::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(rgba(255,255,255,.085) 1px,transparent 1.5px) 0 0/6px 6px,radial-gradient(ellipse 62% 54% at 50% 50%,rgba(41,3,4,.62),transparent 78%),linear-gradient(180deg,rgba(41,3,4,.5),rgba(41,3,4,0) 30%,rgba(41,3,4,.1) 62%,rgba(41,3,4,.88))}
.cover::after{content:'';position:absolute;z-index:-1;right:-6%;bottom:-18%;width:min(56vw,760px);aspect-ratio:333/191;pointer-events:none;background:url(../brand/musa-mark.png) center/contain no-repeat;opacity:.07}
.cover-in{display:grid;justify-items:center;gap:0;padding:clamp(40px,6vw,72px) var(--gutter) clamp(84px,9vw,112px)}
.cover-mark{display:block;width:clamp(92px,10vw,150px);height:auto}
.cover-title{margin:clamp(18px,2.4vw,30px) 0 0;font-family:var(--display);font-weight:900;font-stretch:104%;font-size:clamp(50px,10.4vw,164px);line-height:.9;letter-spacing:-.056em;text-wrap:balance;text-shadow:0 2px 40px rgba(41,3,4,.55)}
.cover-tag{margin-top:clamp(18px,2.2vw,28px);font-weight:600;font-stretch:112%;font-size:clamp(15px,1.7vw,22px);line-height:1.4;letter-spacing:.14em;color:#ffdcdc}
.cover-tag b{font-weight:900;color:var(--neon);letter-spacing:.06em}
.cover-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(24px,3vw,38px)}
.cover-foot{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 var(--gutter) 20px;font-weight:600;font-size:12.5px;font-stretch:112%;letter-spacing:.02em;color:#ffcdce}
.cover-next{display:inline-flex;align-items:center;gap:10px;padding:8px 0;color:#fff;font-weight:700}
.cover-next svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;animation:cover-nudge 1.8s var(--ease) infinite}
.ambient-paused .cover-next svg{animation:none}
@keyframes cover-nudge{0%,100%{transform:none}50%{transform:translateY(5px)}}
.cover :focus-visible{outline-color:#fff}

/* ---------- V5: 360 badge ---------- */
.compass{position:relative;flex-shrink:0;width:clamp(150px,15vw,204px);aspect-ratio:1;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
.compass:active{cursor:grabbing}
.compass svg{display:block;width:100%;height:100%;overflow:visible}
.compass-ring{transform-origin:100px 100px;will-change:transform}
.compass-ring text{font-family:var(--display);font-weight:800;font-size:12.6px;font-stretch:110%;letter-spacing:.13em;fill:none;stroke:#ffc6c7;stroke-width:.7px;paint-order:stroke}
.compass-rim{fill:none;stroke:var(--blue);stroke-width:1}
.compass-rim-in{opacity:.55}
.compass-rim{stroke:var(--neon)!important;opacity:.85}
.cp-ticks,.cp-dash,.cp-sweep{transform-origin:100px 100px}
.cp-ticks{fill:none;stroke:rgba(255,135,136,.55);stroke-width:4;stroke-dasharray:1 4.94;animation:hud-spin 90s linear infinite}
.cp-dash{fill:none;stroke:rgba(255,61,63,.5);stroke-width:1.6;stroke-dasharray:30 9 3 9;animation:hud-spin 48s linear infinite reverse}
.cp-cross{fill:none;stroke:rgba(255,135,136,.8);stroke-width:1.1}
.cp-sweep{animation:hud-spin 7s linear infinite}
.cp-sweep path{fill:var(--neon)}
.cp-sweep .cp-edge{fill:none;stroke:var(--neon);stroke-width:1;opacity:.85}
.cp-corner{position:absolute;width:16px;height:16px;border:0 solid var(--blue);pointer-events:none}
.cp-corner.tl{left:-10px;top:-10px;border-width:2px 0 0 2px}.cp-corner.tr{right:-10px;top:-10px;border-width:2px 2px 0 0}
.cp-corner.bl{left:-10px;bottom:-10px;border-width:0 0 2px 2px}.cp-corner.br{right:-10px;bottom:-10px;border-width:0 2px 2px 0}
.ambient-paused .cp-ticks,.ambient-paused .cp-dash,.ambient-paused .cp-sweep{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.cp-ticks,.cp-dash,.cp-sweep{animation:none}}
.compass-core{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;pointer-events:none}
.compass-core strong{font-weight:900;font-size:clamp(30px,3.1vw,42px);line-height:1;letter-spacing:-.04em;color:#fff;text-shadow:0 0 18px rgba(255,61,63,.75),0 0 2px rgba(255,61,63,.9)}
.compass:focus-visible{outline-offset:6px;border-radius:50%}

/* ---------- V5: IP list in the hero ---------- */
.ips .label{display:block;margin-bottom:10px;color:var(--ink-2)}
.ips ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;margin:0;padding:0;list-style:none;border-top:1px solid var(--line-2)}
.ips li{position:relative;display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-weight:700;font-size:15px;line-height:1.3;color:var(--ink-2);transition:color .4s var(--ease),padding-left .4s var(--ease)}
.ips li::before{content:'';flex:none;width:13px;height:9px;background:repeating-linear-gradient(90deg,currentColor 0 3px,transparent 3px 5px);transform:skewX(-27deg);opacity:.35;transition:opacity .4s}
.ips li.is-on{color:var(--blue);padding-left:6px}
.ips li.is-on::before{opacity:1}

/* ---------- V5: slanted stage, cut like the stripes of the logo ---------- */
.stage-frame{--sl:7%;position:relative;height:clamp(420px,38vw,560px)}
.stage-frame::before,.stage-frame::after{content:'';position:absolute;inset:0;pointer-events:none;clip-path:polygon(var(--sl) 0,100% 0,calc(100% - var(--sl)) 100%,0 100%)}
.stage-frame::before{left:-30px;right:30px;background:var(--ink)}
.stage-frame::after{left:-15px;right:15px;background:var(--blue)}
.stage-frame .stage{z-index:1;height:100%;border:0;border-radius:0;clip-path:polygon(var(--sl) 0,100% 0,calc(100% - var(--sl)) 100%,0 100%)}
.stage-frame .stage-top{left:calc(var(--sl) + 16px)}
.stage-frame .stage-bottom{right:calc(var(--sl) + 12px)}
.stage-frame .orbit-one{left:9%}
.stage-frame .orbit-two{right:7%}

/* ---------- V5: mitra (klien + sponsor) ---------- */
.clients{border-bottom:1px solid var(--line-2)}
.mitra-clients{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:10px 32px;padding-block:30px}
.mitra-clients .label b{display:block;font-weight:900;font-size:20px;letter-spacing:-.02em;font-stretch:100%;color:var(--ink)}
.mitra-clients ul{display:flex;flex-wrap:wrap;gap:6px 26px;margin:0;padding:0;list-style:none}
.mitra-clients button{padding:4px 0;border:0;background:none;font-weight:700;font-size:16.5px;line-height:1.4;letter-spacing:-.01em;color:var(--ink);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;text-decoration-thickness:2px;transition:color .2s,text-decoration-color .2s}
.mitra-clients button:hover{color:var(--blue);text-decoration-color:var(--blue)}
.sponsors{position:relative;border-top:1px solid rgba(255,255,255,.14);display:grid;grid-template-columns:minmax(210px,auto) minmax(0,1fr);align-items:center;background:var(--night);color:#fff;overflow:hidden}
.sponsors-head{position:relative;z-index:1;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:22px clamp(20px,2.6vw,36px) 22px max(var(--gutter),calc((100vw - 1400px)/2 + var(--gutter)));background:var(--night);border-right:1px solid rgba(255,255,255,.16)}
.sponsors-head b{display:block;font-weight:900;font-size:20px;line-height:1.2;letter-spacing:-.02em}
.sponsors-head span{margin-top:4px;font-size:12.5px;line-height:1.45;color:#aeb6c4}
.sponsor-belt{overflow:hidden;background:var(--night);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 94%,transparent)}
.sponsor-track{display:flex;align-items:center;background:var(--night);gap:clamp(34px,4vw,60px);width:max-content;padding:20px clamp(17px,2vw,30px);animation:sponsors 48s linear infinite}
.sponsors:hover .sponsor-track,.sponsors:focus-within .sponsor-track,.ambient-paused .sponsor-track{animation-play-state:paused}
@keyframes sponsors{to{transform:translateX(-50%)}}
.sponsor-track img{display:block;flex:none;height:var(--h,58px);width:auto;max-width:none;mix-blend-mode:lighten}
.sponsor-track span{flex:none;font-weight:800;font-size:17px;letter-spacing:.01em;color:#e7ebf2;white-space:nowrap}

/* ---------- V5: NTB coverage map ---------- */
.ntb{isolation:isolate}
.ntb-head{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:20px 5%;align-items:end}
.ntb-head h2{font-size:clamp(30px,3.7vw,54px)}
.ntb-head h2 em{font-style:normal;color:var(--blue)}
.ntb-head p{font-size:17px;line-height:1.7;color:var(--ink-2)}
.ntb-tally{display:flex;gap:0;margin-top:18px;border-top:2px solid var(--ink)}
.ntb-tally div{flex:1;padding:12px 12px 0 0;font-size:12.5px;line-height:1.4;color:var(--muted)}
.ntb-tally div+div{padding-left:14px;border-left:1px solid var(--line)}
.ntb-tally b{display:block;font-weight:900;font-size:30px;line-height:1;letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.ntb-map{position:relative;margin-top:clamp(26px,3.4vw,46px);padding:clamp(14px,2.4vw,34px) clamp(10px,2vw,30px);background:rgba(255,255,255,.72);border:1px solid var(--line);border-top:3px solid var(--ink)}
.ntb-map svg{display:block;width:100%;height:auto;overflow:visible}
.ntb-grid line{stroke:rgba(21,23,26,.07);stroke-width:1;vector-effect:non-scaling-stroke}
.ntb-area{cursor:pointer;outline:0}
.ntb-area path{fill:#f3ebe8;stroke:var(--ink);stroke-width:.9;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:fill .35s var(--ease)}
.ntb-area.is-on path{fill:var(--blue)}
.ntb-pin circle{fill:var(--ink);stroke:#fff;stroke-width:1.4;vector-effect:non-scaling-stroke;transition:fill .3s}
.ntb-pin .halo{fill:none;stroke:var(--blue);stroke-width:1.4;opacity:0;transform-box:fill-box;transform-origin:center}
.ntb-pin.is-on circle:not(.halo){fill:var(--neon)}
.ntb-pin.is-on .halo{animation:ntb-ping 1.5s var(--ease) infinite}
@keyframes ntb-ping{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(3.4)}}
.ntb-island{font-family:var(--display);font-weight:800;font-size:11px;font-stretch:112%;letter-spacing:.2em;fill:var(--muted)}
.ntb-now{position:absolute;left:clamp(10px,2vw,30px);top:clamp(10px,1.6vw,22px);display:flex;align-items:baseline;gap:10px;font-weight:600;font-size:12.5px;font-stretch:112%;color:var(--muted)}
.ntb-now b{font-weight:900;font-size:clamp(17px,1.9vw,26px);font-stretch:100%;letter-spacing:-.03em;color:var(--blue)}
.ntb-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;padding:0;list-style:none;border-left:1px solid var(--line)}
.ntb-list button{display:flex;align-items:baseline;gap:9px;width:100%;min-height:52px;padding:13px 12px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.72);text-align:left;font-weight:700;font-size:15px;line-height:1.3;color:var(--ink);transition:background-color .3s,color .3s}
.ntb-list small{font-weight:600;font-size:11px;font-variant-numeric:tabular-nums;color:var(--muted);transition:color .3s}
.ntb-list button.is-on,.ntb-list button:hover{background:var(--blue);color:#fff}
.ntb-list button.is-on small,.ntb-list button:hover small{color:#ffcdce}

/* ---------- V5: brand Instagram link ---------- */
.unit-ig{display:inline-flex;align-items:center;gap:7px;margin:-2px 0 14px;padding:4px 0;font-weight:700;font-size:13.5px;line-height:1.3;color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:5px;transition:color .2s,text-decoration-color .2s}
.unit-ig svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2}
.unit-ig:hover{color:var(--blue);text-decoration-color:var(--blue)}
.unit h3{margin-bottom:8px}

@media(max-width:960px){
  .compass{display:none}
  .stage-frame{--sl:6%;height:400px}
  .stage-frame::before{left:-16px;right:16px}.stage-frame::after{left:-8px;right:8px}
  .hero-bottom .stage-frame{margin-left:14px}
  .ntb-head{grid-template-columns:minmax(0,1fr)}
  .cover-foot span:last-child{display:none}
  .ntb-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sponsors{grid-template-columns:minmax(0,1fr)}
  .sponsors-head{padding:16px var(--gutter) 4px;border-right:0}
  .mitra-clients{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
  .regions-track span{font-size:13px}
  .regions-track i{margin-inline:14px}
  .cover{min-height:clamp(480px,calc(100svh - 106px),720px)}
  .cover-foot span{display:none}
  .cover-foot{justify-content:center}
  .ips ul{grid-template-columns:minmax(0,1fr)}
  .stage-frame .orbit-one{left:8%}.stage-frame .orbit-two{right:6%}
  .sponsor-track img{height:calc(var(--h,58px)*.8)}
  .ntb-map{padding:12px 8px}
  .ntb-now{position:static;margin:0 0 8px}
  .ntb-now span{display:none}
  .ntb-island{display:none}
  .stage-frame .stage-top .label{font-size:11.5px}
}

/* ---------- Revisi 8 Okt: event facts ---------- */
.work-facts{display:grid;gap:5px;margin:12px 0 0;padding-top:11px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.4}
.work-facts div{display:grid;grid-template-columns:74px minmax(0,1fr);gap:8px}
.work-facts dt{color:var(--muted)}
.work-facts dd{margin:0;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.doc-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 14px;border-top:2px solid var(--ink)}
.doc-facts div{padding:10px 12px 2px 0}
.doc-facts div+div{padding-left:12px;border-left:1px solid var(--line)}
.doc-facts dt{font-size:11.5px;color:var(--muted)}
.doc-facts dd{margin:2px 0 0;font-weight:700;font-size:14px;line-height:1.35;font-variant-numeric:tabular-nums}
.stage.is-blocked #motion-toggle{background:var(--neon);border-color:var(--neon);color:#2c0405}

/* ---------- Revisi 8 Okt: clients as a wall of names ---------- */
.mitra-clients{align-items:start}
.mitra-clients ul{gap:4px 22px}
.mitra-clients li span{display:block;padding:4px 0;font-weight:700;font-size:16.5px;line-height:1.4;letter-spacing:-.01em;color:var(--ink)}

/* ---------- Revisi 8 Okt: partnership belt runs on script so it can be dragged ---------- */
.sponsor-belt{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.sponsor-belt.is-drag{cursor:grabbing}
.sponsor-track{animation:none;will-change:transform}
.sponsor-track img{pointer-events:none;-webkit-user-drag:none}
.sponsor-track img.tile{mix-blend-mode:normal;border-radius:3px}
@media(max-width:760px){
  .work-facts div{grid-template-columns:minmax(0,1fr);gap:0}
  .work-facts{gap:7px}
  .doc-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doc-facts div:nth-child(odd){padding-left:0;border-left:0}
  .doc-facts div:nth-child(n+3){border-top:1px solid var(--line)}
  .hud-tag.br{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hud-ring-a,.hud-ring-b,.hud-ring-c,.hud-sweep{animation:none}
  .regions-track,.sponsor-track,.site-head::before{animation:none}
  .cover-photo,.cover-next svg,.ntb-pin.is-on .halo{animation:none}
  .reel{overflow-x:auto}
  .reel-track{animation:none}
  .feat-slide img{transition:none}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ---------- 10 Oct: team slider, one member at a time ---------- */
.tslider{position:relative}
.tslider-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;outline-offset:6px;cursor:grab}
.tslider-track::-webkit-scrollbar{display:none}
.tslider-track.is-drag{scroll-snap-type:none;scroll-behavior:auto;cursor:grabbing}
.tslide{flex:0 0 100%;scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:clamp(340px,40vw,520px);background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--ink)}
.tslide-photo{overflow:hidden;background:var(--paper-3)}
.tslide-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;-webkit-user-drag:none;user-select:none;transition:transform .8s var(--ease)}
.tslide.is-on .tslide-photo img{transform:scale(1.03)}
.tslide-cap{position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,4vw,56px);overflow:hidden}
.tslide-cap::before{content:'';position:absolute;right:-8%;top:-12%;width:60%;aspect-ratio:1;border-radius:50%;border:1px solid var(--line);box-shadow:0 0 0 28px rgba(214,27,29,.035),0 0 0 56px rgba(214,27,29,.02)}
.tslide-no{position:absolute;left:clamp(24px,4vw,56px);top:clamp(22px,3.4vw,46px);font-weight:900;font-size:clamp(40px,6vw,88px);line-height:1;letter-spacing:-.05em;color:var(--blue);font-variant-numeric:tabular-nums}
.tslide-no small{font-size:.32em;letter-spacing:0;color:var(--muted);margin-left:6px}
.tslide-cap h3{font-size:clamp(40px,6.2vw,92px);line-height:.95;letter-spacing:-.045em}
.tslide-cap p{margin-top:14px;padding-top:14px;border-top:3px solid var(--blue);max-width:22ch;font-weight:700;font-size:clamp(16px,1.5vw,21px);line-height:1.35;color:var(--ink-2)}
.tslider-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:18px}
.tslider-dots{display:flex;gap:8px}
.tslider-dots button{width:34px;height:24px;padding:0;border:0;background:none;cursor:pointer;position:relative}
.tslider-dots button::after{content:'';position:absolute;left:0;right:0;top:50%;height:3px;margin-top:-1.5px;background:var(--line-2);transition:background .25s}
.tslider-dots button[aria-current="true"]::after{background:var(--blue)}
.tslider-nav{display:flex;gap:8px}
.tslider-nav button{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;transition:background .2s,color .2s}
.tslider-nav button:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.tslider-nav svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
@media (max-width:700px){
  .tslide{grid-template-columns:minmax(0,1fr);min-height:0}
  .tslide-photo{aspect-ratio:4/5}
  .tslide-cap{padding:20px 18px 22px;min-height:150px}
  .tslide-no{left:auto;right:18px;top:18px}
  .tslide-cap h3{font-size:44px}
}
@media (prefers-reduced-motion:reduce){.tslider-track{scroll-behavior:auto}.tslide-photo img{transition:none}}
/* V7: skip layout and paint of long sections until they come near the screen */
#wilayah,#layanan,#liputan{content-visibility:auto;contain-intrinsic-size:auto 1100px}
.is-lite .work-alt{display:none}
.cover{overflow-x:clip}
@media (max-width:700px){.tslider-dots{gap:4px}.tslider-dots button{width:24px}.tslider-bar{gap:10px}}
/* V7.1: team, six members per slide */
.tslider-track{gap:14px}
.tslide{flex:0 0 calc((100% - 70px)/6);display:flex;flex-direction:column;min-height:0}
.tslide-photo{aspect-ratio:375/533}
.tslide-cap{justify-content:flex-start;padding:14px 14px 16px;min-height:0;overflow:visible}
.tslide-cap::before{display:none}
.tslide-no{position:static;font-size:13px;letter-spacing:0;margin-bottom:6px}
.tslide-no small{font-size:1em}
.tslide-cap h3{font-size:clamp(20px,1.7vw,26px);line-height:1.05;letter-spacing:-.03em}
.tslide-cap p{margin-top:8px;padding-top:8px;border-top-width:2px;font-size:14px;max-width:none}
@media (max-width:1100px){.tslide{flex-basis:calc((100% - 28px)/3)}}
@media (max-width:700px){.tslide{flex-basis:calc((100% - 14px)/2)}.tslide-cap{padding:12px 12px 14px;min-height:0}.tslide-cap h3{font-size:20px}}
/* V7.1: plate stays bottom-left; the logo sits in the exact centre of its white plate, nothing clipped */
.unit-logo img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;object-position:50% 50%;margin:0}
/* V7.5: Musa Group box above the three brands */
.group-box{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(18px,3vw,40px);margin:0 0 20px;padding:22px clamp(20px,3vw,32px);background:rgba(255,255,255,.9);border:1px solid var(--line);border-top:3px solid var(--blue);box-shadow:0 12px 28px rgba(21,23,26,.04)}
.group-box-logo{display:block;width:clamp(150px,16vw,210px);height:auto;filter:brightness(0)}
.group-box-text{max-width:52ch;color:var(--ink-2);font-size:15px;line-height:1.6}
.group-box-text b{color:var(--ink)}
.group-box-ig{margin:0}
@media (max-width:700px){.group-box{grid-template-columns:minmax(0,1fr);gap:12px}}
/* V7.5: portfolio strip, scrolled by script so it can be dragged */
.reel-track{animation:none!important;will-change:transform}
.reel{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.reel.is-drag{cursor:grabbing}
.reel img{-webkit-user-drag:none;pointer-events:none}
.cover-video{animation:none!important;object-position:50% 50%}
.cover::after{content:none;display:none}
/* V7.8: brand cards share one row grid, so label, photo, title, Instagram, text and accordions line up */
.unit-grid{align-items:stretch}
@supports (grid-template-rows:subgrid){
  .unit-grid{grid-auto-rows:auto}
  .unit{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0;align-content:start}
  .unit>*{align-self:start}
}
.unit h3{min-height:2.3em}
.unit h3 br{display:block}
.unit-ig{justify-self:start}
.unit>p{margin-bottom:18px}
/* V7.8: brief form, one size for every field */
.form-grid{align-items:start;column-gap:20px;row-gap:22px}
.brief label{font-size:14px;line-height:1.4}
.brief input,.brief select{height:52px;padding:0 16px;font:inherit;font-size:16px;font-weight:400;line-height:1.2}
.brief textarea{padding:14px 16px;font:inherit;font-size:16px;font-weight:400}
.brief select{-webkit-appearance:none;appearance:none;padding-right:52px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23fff' stroke-width='1.8'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 20px center;background-size:12px 8px}
.brief select option{color:#15171a;background:#fff}
/* V7.9: no outline shapes on the brand cards */
.unit::before{content:none;display:none}
.unit-kind{padding-right:0}
/* V7.9: parallax on the process dial (values set by the scroll script) */
.dial{transform:translate3d(0,var(--py,0px),0);will-change:transform}
.dial svg{transform:rotate(var(--pr,0deg))}
@media (prefers-reduced-motion:reduce){.dial,.dial svg{transform:none}}


/* V7.3: language switch, top-right of the header */
.lang-switch{display:inline-flex;align-items:center;border:2px solid var(--ink);font-weight:800;font-size:12px;letter-spacing:.08em;line-height:1;flex:none}
.lang-switch a,.lang-switch span{display:grid;place-items:center;min-width:40px;min-height:40px;padding:0 8px;text-decoration:none!important}
.lang-switch [aria-current]{background:var(--ink);color:var(--paper)}
.lang-switch a:hover{background:var(--blue);color:#fff}
.lang-switch a:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media (max-width:700px){.lang-switch a,.lang-switch span{min-width:34px;min-height:36px;padding:0 5px}.site-nav{gap:10px}}
@media (max-width:480px){.site-head .logo{width:112px}.site-nav .btn{padding:10px 10px}.site-nav > a[href^="artikel"]{display:none}}