/* ============ MERIDIAN — BASE v9 (bersih: .mono/.brass/--grad-line/--obs-4 dihapus) ============ */
:root{
  --obs:#06070a;
  --obs-2:#0f1014;
  --obs-3:#161820;
  --bone:#e8e4dc;
  --bone-2:#d4cfc4;
  --bone-3:#a8a295;
  --ink:#8b8478;
  --ink-2:#5a564d;
  --brass:#c9a961;
  --brass-2:#e0c885;
  --brass-3:#8a7340;
  --signal:#4ade80;
  --line:rgba(232,228,220,.08);
  --line-strong:rgba(232,228,220,.18);
  --grad-brass:linear-gradient(120deg,#c9a961 0%,#e0c885 48%,#c9a961 100%);
  --font-display:'Fraunces',serif;
  --font-body:'Geist',sans-serif;
  --font-mono:'JetBrains Mono',monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-in:cubic-bezier(.87,0,.13,1);
  --container:1280px;
  --sec-y:clamp(64px,5vw,88px);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{
  background:var(--obs);
  color:var(--bone-2);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.7;
  overflow-x:hidden;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:'ss01','cv11';
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:rgba(201,169,97,.3);color:var(--bone)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:4px}

.container{width:min(var(--container),92vw);margin-inline:auto}

.italic{font-family:var(--font-display);font-style:italic;font-weight:300;letter-spacing:-.02em;color:var(--brass-2)}

.label{
  display:inline-flex;align-items:center;gap:.75rem;
  font-family:var(--font-mono);font-size:.68rem;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink);
}
.label__dot{width:6px;height:6px;border-radius:50%;background:var(--brass);box-shadow:0 0 12px rgba(201,169,97,.6)}
.label__dot--signal{background:var(--signal);box-shadow:0 0 12px rgba(74,222,128,.6);animation:sy-pulse 2s ease-in-out infinite}
.label__line{width:32px;height:1px;background:var(--line-strong);flex:none}

.sec{padding:var(--sec-y) 0;position:relative}
.sec-title{
  font-family:var(--font-display);font-weight:300;color:var(--bone);
  font-size:clamp(2.2rem,5.4vw,4.8rem);line-height:1;letter-spacing:-.04em;
  margin:1rem 0 1.5rem;font-variation-settings:'SOFT' 80,'WONK' 0;
}
.lead{font-size:clamp(1rem,1.3vw,1.18rem);line-height:1.65;color:var(--bone-3);max-width:56ch}
.body-text{color:var(--bone-3);max-width:56ch;margin-top:1rem}

.sy-skip{position:fixed;top:-60px;left:16px;z-index:1200;background:var(--grad-brass);color:var(--obs);padding:.7rem 1.2rem;border-radius:999px;font-weight:700;transition:top .3s var(--ease)}
.sy-skip:focus{top:16px}

/* Hero char reveal */
.h-line{display:block;margin-bottom:.15em}
.h-word{display:inline-block;overflow:hidden;vertical-align:top;padding:.08em 0 .14em;margin:-.08em 0 -.14em}
.h-char{display:inline-block;transform:translateY(110%);transition:transform 1.1s var(--ease-in)}
.is-in .h-char{transform:translateY(0)}
.h-italic{font-style:italic;font-weight:300;color:var(--brass);font-variation-settings:'SOFT' 100,'WONK' 1}

/* Utilitas chip row */
.chip-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.chip-row--sm{gap:.5rem;margin-top:1rem}

@media (max-width:900px){.sec{padding:calc(var(--sec-y) * .8) 0}}