:root{
    --ink:#211812;
    --songket:#6E1220;      /* merah marun songket Jambi */
    --songket-deep:#4E0C17;
    --gold:#B98D3E;         /* benang emas */
    --gold-soft:#CBA25A;
    --parchment:#F4EEE0;    /* kertas naskah */
    --sand:#E9DFC7;
    --line:#D8CBAB;
    --muted:#6A5A47;
    --dark:#2A1D15;
    --maxw:1180px;
  }

  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:"Newsreader",Georgia,serif;
    background:var(--parchment);
    color:var(--ink);
    line-height:1.6;
    font-size:18px;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,.display{font-family:"Fraunces",Georgia,serif;font-weight:500;line-height:1.05;letter-spacing:-.01em}
  .eyebrow{
    font-family:"Archivo",sans-serif;font-weight:600;
    text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;
  }
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}

  /* ---- Songket belah-ketupat gold thread motif ---- */
  .songket-band{
    position:relative;
    height:26px;
    background-color:#5A101B;
    background-image:
      repeating-linear-gradient(45deg, transparent 0 10px, rgba(203,162,90,.55) 10px 11px),
      repeating-linear-gradient(-45deg, transparent 0 10px, rgba(203,162,90,.55) 10px 11px);
    background-size:22px 22px;
  }

  /* ---------- NAV ---------- */
  header.nav{
    position:sticky;top:0;z-index:50;
    background:rgba(244,238,224,.86);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:76px}
  .brand{display:flex;align-items:center;gap:14px}
  .seal{
    width:44px;height:44px;flex:none;border-radius:50%;
    background:radial-gradient(circle at 35% 30%, #FFFDF8 0%, #EBE0C8 78%);
    display:grid;place-items:center;
    border:1.5px solid var(--gold);
    box-shadow:0 0 0 3px rgba(185,141,62,.18);
  }
  .seal img{width:30px;height:30px;object-fit:contain}
  .brand-name{font-family:"Fraunces";font-size:1.18rem;line-height:1;font-weight:600}
  .brand-sub{font-family:"Archivo";font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--songket);margin-top:4px}
  nav.links{display:flex;gap:22px;align-items:center;font-family:"Archivo";font-size:.86rem;font-weight:500}
  nav.links a{position:relative;padding:4px 0;color:var(--dark)}
  .links a,.foot-links a{display:inline-flex;align-items:center;gap:7px}
  .nav-ic{width:15px;height:15px;flex:none;opacity:.82}
  nav.links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--gold);transition:width .3s ease}
  nav.links a:hover::after,nav.links a:focus-visible::after{width:100%}
  .nav-cta{
    font-family:"Archivo";font-weight:600;font-size:.82rem;
    background:var(--songket);color:var(--parchment);
    padding:11px 20px;border-radius:2px;transition:background .25s;
  }
  .nav-cta:hover{background:var(--songket-deep)}
  .menu-btn{display:none;background:none;border:1px solid var(--line);border-radius:2px;padding:8px 12px;font-family:"Archivo";cursor:pointer}

  /* ---------- HERO ---------- */
  .hero{position:relative;background:var(--parchment);color:var(--parchment);overflow:hidden}
  .hero-stage{
    --hero-fade-height:clamp(124px,10vw,160px);
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:linear-gradient(180deg,#450A14 0%,var(--songket-deep) 44%,#5A101B 72%,#5A101B 100%);
  }
  .hero-weave{
    position:absolute;
    inset:0 0 calc(var(--hero-fade-height) + 96px) 0;
    z-index:0;
    opacity:.14;
    pointer-events:none;
    background-image:
      repeating-linear-gradient(45deg, transparent 0 26px, var(--gold) 26px 27px),
      repeating-linear-gradient(-45deg, transparent 0 26px, var(--gold) 26px 27px);
    background-size:54px 54px;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 76%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 76%,transparent 100%);
  }
  .hero-stage::after{
    content:"";
    position:absolute;
    z-index:0;
    left:0;
    right:0;
    bottom:var(--hero-fade-height);
    height:150px;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(90,16,27,0) 0%,rgba(90,16,27,.42) 45%,#5A101B 100%);
  }
  .hero-inner{position:relative;z-index:1;padding:92px 28px 84px;max-width:var(--maxw)}
  .hero-stats{display:flex;gap:46px;margin-top:44px;flex-wrap:wrap}
  .hstat{display:flex;flex-direction:column;gap:3px}
  .hstat b{font-family:"Fraunces";font-size:2.1rem;font-weight:600;color:var(--gold-soft);line-height:1}
  .hstat span{font-family:"Archivo";font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#C6B69B}
  .hero-shelf{margin-top:46px}
  .hs-label{font-family:"Archivo";font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
  .hs-row{display:flex;gap:16px;flex-wrap:wrap}
  .hs-item{display:block;width:82px;flex:none;border-radius:3px;overflow:hidden;box-shadow:0 14px 28px -14px rgba(0,0,0,.7);transition:transform .3s ease,box-shadow .3s ease}
  .hs-item img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block}
  .hs-item:hover{transform:translateY(-7px);box-shadow:0 22px 38px -14px rgba(0,0,0,.8)}
  @media (max-width:640px){
    .hero-stats{gap:28px;margin-top:34px}
    .hstat b{font-size:1.7rem}
    .hero-shelf{margin-top:36px}
    .hs-item{width:66px}
  }
  @media (max-width:460px){.hs-item{width:58px}.hs-row{gap:11px}}

  .hero .eyebrow{color:var(--gold-soft)}
  .hero h1{
    font-size:clamp(2.2rem,7vw,5.2rem);
    margin:22px 0 26px;color:var(--parchment);
    font-weight:500;
  }
  .hero h1 em{font-style:italic;color:var(--gold-soft)}
  .hero-lead{
    font-size:clamp(1.05rem,2vw,1.32rem);
    max-width:640px;color:#E7DCC6;line-height:1.55;
  }
  .hero-profile{max-width:660px;margin-top:12px;display:flex;flex-direction:column;gap:15px}
  .hero-profile p{font-family:"Newsreader";font-size:1.04rem;line-height:1.72;color:#E7DCC6;margin:0}
  .hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:40px}
  .btn{
    font-family:"Archivo";font-weight:600;font-size:.92rem;
    padding:15px 30px;border-radius:2px;cursor:pointer;transition:.25s;display:inline-block;
  }
  .btn-gold{background:var(--gold);color:var(--songket-deep)}
  .btn-gold:hover{background:var(--gold-soft)}
  .btn-ghost{border:1.5px solid rgba(203,162,90,.55);color:var(--gold-soft)}
  .btn-ghost:hover{border-color:var(--gold-soft);background:rgba(203,162,90,.1)}
  .hero-pillars{
    display:flex;gap:38px;flex-wrap:wrap;margin-top:64px;
    padding-top:30px;border-top:1px solid rgba(203,162,90,.25);
  }
  .pillar{max-width:210px}
  .pillar .p-t{font-family:"Fraunces";font-size:1.15rem;color:var(--gold-soft);margin-bottom:4px}
  .pillar .p-d{font-family:"Archivo";font-size:.82rem;color:#D9CDB6;line-height:1.5}

  /* ---------- SECTION SHELL ---------- */
  section{padding:104px 0}
  .sec-head{max-width:720px;margin-bottom:56px}
  .sec-head .eyebrow{color:var(--songket)}
  .sec-head h2{font-size:clamp(2rem,4.5vw,3.1rem);margin:16px 0 18px}
  .sec-head p{color:var(--muted);font-size:1.08rem}

  /* ---------- TENTANG ---------- */
  #tentang{background:var(--sand)}
  .about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:start}
  .about-grid p{margin-bottom:20px;color:#3E3226}
  .about-grid p:first-of-type{font-size:1.22rem;font-family:"Fraunces";font-weight:400;line-height:1.4;color:var(--ink)}
  .adat-card{
    background:var(--songket);color:var(--parchment);
    padding:38px 34px;border-radius:3px;position:relative;
    border-top:3px solid var(--gold);
  }
  .adat-card .eyebrow{color:var(--gold-soft)}
  .adat-card h3{font-size:1.5rem;margin:14px 0 16px;color:var(--parchment)}
  .adat-card p{font-size:.98rem;color:#E7DCC6;line-height:1.6}
  .adat-term{display:flex;gap:14px;margin-top:22px;padding-top:22px;border-top:1px solid rgba(203,162,90,.3)}
  .adat-term dt{font-family:"Fraunces";font-style:italic;color:var(--gold-soft);flex:none;width:96px}
  .adat-term dd{font-family:"Archivo";font-size:.84rem;color:#D9CDB6}

  /* ---------- LAYANAN ---------- */
  .svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
  .svc{
    position:relative;background:var(--parchment);border:1px solid var(--line);border-radius:8px;
    padding:32px 30px;overflow:hidden;transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .svc::before{content:"";position:absolute;left:0;top:0;height:100%;width:3px;background:linear-gradient(180deg,var(--gold),transparent);opacity:0;transition:opacity .3s ease}
  .svc:hover{transform:translateY(-5px);box-shadow:0 26px 50px -26px rgba(78,12,23,.45);border-color:var(--gold-soft)}
  .svc:hover::before{opacity:1}
  .svc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
  .svc-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:rgba(185,141,62,.13);color:var(--songket);transition:background .3s ease,color .3s ease}
  .svc-ic svg{width:23px;height:23px}
  .svc:hover .svc-ic{background:var(--songket);color:var(--gold-soft)}
  .svc:hover{transform:translateY(-4px);box-shadow:0 16px 40px -22px rgba(78,12,23,.4)}
  .svc-num{font-family:"Fraunces";font-weight:600;color:rgba(185,141,62,.42);font-size:1.7rem;letter-spacing:.02em;line-height:1}
  .svc h3{font-size:1.42rem;margin:12px 0 12px}
  .svc p{color:var(--muted);font-size:.98rem}
  .svc ul{list-style:none;margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
  .svc li{font-family:"Archivo";font-size:.74rem;font-weight:500;background:var(--sand);color:var(--songket);padding:5px 11px;border-radius:2px}

  /* ---------- KATALOG ---------- */
  #katalog{background:var(--dark);color:var(--parchment)}
  #katalog .sec-head .eyebrow{color:var(--gold-soft)}
  #katalog .sec-head h2{color:var(--parchment)}
  #katalog .sec-head p{color:#C9BBA4}
  .book-row{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
  .book{transition:transform .35s ease}
  .book:hover{transform:translateY(-6px)}
  .cover{
    aspect-ratio:3/4.2;border-radius:2px;padding:22px 20px;
    display:flex;flex-direction:column;justify-content:space-between;
    position:relative;overflow:hidden;
    box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
  }
  .cover::before{
    content:"";position:absolute;inset:0;opacity:.14;
    background-image:repeating-linear-gradient(45deg,transparent 0 12px,#fff 12px 13px),repeating-linear-gradient(-45deg,transparent 0 12px,#fff 12px 13px);
    background-size:26px 26px;
    mask-image:linear-gradient(to bottom,#000,transparent 55%);
  }
  .cover .spine{position:absolute;left:0;top:0;bottom:0;width:8px;background:var(--gold);opacity:.85}
  .cover .c-cat{font-family:"Archivo";font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;position:relative}
  .cover .c-title{font-family:"Fraunces";font-size:1.28rem;line-height:1.12;position:relative;font-weight:500}
  .c1{background:linear-gradient(160deg,#6E1220,#4E0C17)}
  .c2{background:linear-gradient(160deg,#2F4A3C,#1C3226)}
  .c3{background:linear-gradient(160deg,#5A4326,#3A2A14)}
  .c4{background:linear-gradient(160deg,#333B52,#1F2536)}
  .cover .c-cat,.cover .c-title{color:var(--parchment)}
  .book-meta{margin-top:14px}
  .book-meta .bt{font-family:"Fraunces";font-size:1.02rem;line-height:1.2}
  .book-meta .ba{font-family:"Archivo";font-size:.78rem;color:#B7A88E;margin-top:3px}
  .katalog-note{font-family:"Archivo";font-size:.78rem;color:#9C8E76;margin-top:38px;font-style:normal}
  .cover-img{position:relative;aspect-ratio:2/3;border-radius:2px;overflow:hidden;background:#1B120C;box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
  .cover-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .book:hover .cover-img img{transform:scale(1.04)}
  .book-status{position:absolute;top:10px;right:10px;font-family:"Archivo";font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--songket-deep);background:var(--gold-soft);padding:4px 9px;border-radius:2px}
  .b-cat{font-family:"Archivo";font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:6px}
  .book-search{max-width:440px;margin-bottom:38px;position:relative}
  .book-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--gold-soft);pointer-events:none}
  .book-search input{width:100%;font-family:"Newsreader";font-size:1rem;color:var(--parchment);background:rgba(255,255,255,.05);border:1px solid rgba(203,162,90,.35);border-radius:3px;padding:13px 16px 13px 44px}
  .book-search input::placeholder{color:#A99B82}
  .book-search input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
  .book-none{display:none;color:#C9BBA4;font-family:"Newsreader";font-size:1rem;margin-top:6px}
  .book-actions{display:flex;gap:8px;margin-top:14px}
  .book-btn{flex:1;text-align:center;font-family:"Archivo";font-size:.72rem;font-weight:600;letter-spacing:.04em;padding:9px 8px;border-radius:3px;cursor:pointer;text-decoration:none;transition:background .2s,color .2s}
  .book-btn.syn{background:transparent;border:1px solid var(--gold-soft);color:var(--gold-soft)}
  .book-btn.syn:hover{background:var(--gold-soft);color:var(--songket-deep)}
  .book-btn.buy{background:var(--gold);border:1px solid var(--gold);color:#2A1206}
  .book-btn.buy:hover{background:var(--gold-soft);border-color:var(--gold-soft)}
    .syn-hold{flex:1;position:relative;display:flex}
  .syn-hold .book-btn.syn{width:100%}
  .book-syn{position:absolute;left:50%;bottom:calc(100% + 11px);transform:translateX(-50%) translateY(6px);width:min(300px,80vw);background:var(--parchment);color:#3E3226;text-align:left;font-family:"Newsreader";font-size:.92rem;line-height:1.6;padding:15px 17px;border-radius:6px;border:1px solid var(--gold-soft);box-shadow:0 20px 46px -14px rgba(0,0,0,.55);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,transform .22s ease;z-index:60}
  .book-syn::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:var(--parchment)}
  .syn-hold:hover .book-syn,.book-btn.syn:focus + .book-syn{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);pointer-events:auto}
  .book{position:relative}
  .book:hover,.book:focus-within{z-index:30}
  .syn-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px}
  .syn-modal[hidden]{display:none}
  .syn-backdrop{position:absolute;inset:0;background:rgba(20,8,10,.74)}
  .syn-box{position:relative;background:var(--parchment);color:var(--ink);max-width:560px;width:100%;max-height:82vh;overflow-y:auto;border-radius:6px;padding:40px 36px 36px;box-shadow:0 30px 70px -20px rgba(0,0,0,.7)}
  .syn-close{position:absolute;top:12px;right:16px;background:none;border:none;font-size:2rem;line-height:1;color:var(--muted);cursor:pointer}
  .syn-close:hover{color:var(--songket)}
  .syn-cat{font-family:"Archivo";font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
  #syn-title{font-family:"Fraunces";font-size:1.5rem;color:var(--songket);margin-bottom:16px;line-height:1.22}
  #syn-text{font-family:"Newsreader";font-size:1.06rem;line-height:1.72;color:#3E3226}
  /* ---------- HALAMAN DETAIL BUKU ---------- */
  .book-detail{background:var(--sand)}
  .detail-back{display:inline-flex;align-items:center;gap:10px;font-family:"Archivo";font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--songket);text-decoration:none;background:var(--parchment);border:1px solid var(--line);border-radius:30px;padding:9px 20px 9px 10px;margin-bottom:34px;box-shadow:0 4px 14px -8px rgba(78,12,23,.5);transition:background .22s,color .22s,border-color .22s,transform .22s}
  .db-ic{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--songket);color:var(--parchment);flex:none;transition:transform .22s,background .22s}
  .db-ic svg{width:14px;height:14px}
  .detail-back:hover{background:var(--songket);color:var(--parchment);border-color:var(--songket);transform:translateX(-3px)}
  .detail-back:hover .db-ic{background:var(--gold);color:#2A1206;transform:translateX(-2px)}
  .detail-grid{display:grid;grid-template-columns:300px 1fr;gap:52px;align-items:start}
  .detail-cover{position:sticky;top:96px}
  .detail-cover .cover-img{aspect-ratio:2/3;border-radius:3px;overflow:hidden;background:#1B120C;box-shadow:0 24px 48px -22px rgba(0,0,0,.6)}
  .detail-cover .cover-img img{width:100%;height:100%;object-fit:cover}
  .detail-body .b-cat{font-family:"Archivo";font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
  .detail-body h2{font-family:"Fraunces";font-weight:500;font-size:clamp(1.7rem,3.4vw,2.5rem);color:var(--songket);line-height:1.15;margin-bottom:18px}
  .detail-authors{font-family:"Newsreader";font-size:1.02rem;color:var(--ink);padding-bottom:22px;margin-bottom:24px;border-bottom:1px solid var(--line)}
  .da-label{display:block;font-family:"Archivo";font-size:.62rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
  .detail-desc p{font-family:"Newsreader";font-size:1.1rem;line-height:1.78;color:#3E3226;margin-bottom:18px}
  .detail-body .btn{margin-top:12px}
  @media (max-width:760px){
    .detail-grid{grid-template-columns:1fr;gap:32px}
    .detail-cover{position:static;max-width:240px}
    .detail-body .btn{width:100%;text-align:center}
  }

  /* ---------- JURNAL ---------- */
  #jurnal{background:var(--parchment)}
  .jur-cta{margin-top:44px;text-align:center}
  .jur-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .jur{position:relative;background:var(--parchment);border:1px solid var(--line);border-radius:10px;padding:24px 24px 22px;display:flex;flex-direction:column;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
  .jur::after{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-soft));opacity:0;transition:opacity .3s ease}
  .jur .ed{font-family:"Archivo";font-size:.72rem;color:var(--muted);margin-top:12px}
    .jur-head{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--line)}
  .jur-cover{transition:transform .3s ease}
  .jur:hover .jur-cover{transform:scale(1.04)}
  .jur-cover{width:88px;height:120px;object-fit:cover;border-radius:3px;border:1px solid var(--line);box-shadow:0 10px 22px -10px rgba(78,12,23,.5);flex:none;background:var(--sand)}
  .jur-head .abbr{display:none}
  .jur-head.noimg 
  .jur-head.noimg .abbr{display:block}
    .jur:hover{transform:translateY(-6px);box-shadow:0 26px 48px -26px rgba(78,12,23,.45);border-color:var(--gold-soft)}
  .jur:hover::after{opacity:1}
  .jur .abbr{font-family:"Fraunces";font-size:1.55rem;font-weight:600;color:var(--songket);line-height:1.1;letter-spacing:.02em}
  .jur h3{font-family:"Newsreader";font-weight:500;font-size:1.08rem;color:var(--ink);margin:0 0 8px;line-height:1.3}
  .jur p{font-family:"Archivo";font-size:.8rem;color:var(--muted);line-height:1.5}
  .jur   .badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
  .badge{display:inline-block;align-self:flex-start;font-family:"Archivo";font-size:.66rem;font-weight:600;letter-spacing:.08em;color:var(--songket);background:rgba(185,141,62,.15);border:1px solid rgba(185,141,62,.4);padding:4px 11px;border-radius:20px}
  .jur-go{display:inline-flex;align-items:center;gap:7px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-family:"Archivo";font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);opacity:.75;transition:opacity .3s ease,gap .3s ease}
  .jur-go svg{width:14px;height:14px}
  .jur:hover .jur-go{opacity:1;gap:11px}
  .jur-platform{margin-top:40px;display:flex;align-items:center;gap:12px;font-family:"Archivo";font-size:.9rem;color:var(--muted);flex-wrap:wrap}
  .jur-platform b{color:var(--songket);font-weight:600}

  /* ---------- PROSES ---------- */
  .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;padding-top:34px}
  .steps::before{content:"";position:absolute;top:12px;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,var(--gold-soft),transparent)}
  .step .n{position:relative}
  .step .n::before{content:"";position:absolute;top:-34px;left:50%;transform:translateX(-50%);width:11px;height:11px;border-radius:50%;background:var(--parchment);border:2px solid var(--gold)}
  .step{text-align:center}
  .step{padding:0 20px;position:relative}
  .step:not(:last-child)::after{content:"";position:absolute;right:0;top:14px;width:1px;height:calc(100% - 14px);background:var(--line)}
  .step .n{font-family:"Fraunces";font-size:2.6rem;color:var(--gold);line-height:1}
  .step h3{font-family:"Newsreader";font-weight:500;font-size:1.12rem;margin:16px 0 10px;color:var(--ink)}
  .step p{font-family:"Archivo";font-size:.82rem;color:var(--muted);line-height:1.55}

  /* ---------- SUB-BLOK GABUNGAN ---------- */
  .sub-block{margin-top:72px;padding-top:56px;border-top:1px solid var(--line)}
  .sub-block .sec-head{margin-bottom:44px}

  /* ---------- KONTAK ---------- */
  #kontak{background:var(--sand);padding-top:72px}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
  .contact-grid h2{font-size:clamp(2rem,4.5vw,3rem);margin-bottom:18px}
  .contact-grid p{color:var(--muted);margin-bottom:28px}
  .contact-list{list-style:none}
    .contact-list{display:flex;flex-direction:column;gap:10px}
  .contact-list li{padding:16px 20px;background:var(--parchment);border:1px solid var(--line);border-radius:8px;display:flex;justify-content:space-between;align-items:baseline;gap:20px;transition:border-color .25s ease,transform .25s ease}
  .contact-list li:hover{border-color:var(--gold-soft);transform:translateY(-2px)}
  .contact-list li:last-child{border-bottom:1px solid var(--line)}
  .contact-list .k{font-family:"Archivo";text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;color:var(--songket);flex:none}
  .contact-list .v{font-family:"Newsreader";font-size:1.05rem;text-align:right}

  /* ---------- WHATSAPP CTA ---------- */
  .wa-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}
  .wa-btn{
    font-family:"Archivo";font-weight:600;font-size:.9rem;
    display:inline-flex;align-items:center;gap:9px;
    background:var(--songket);color:var(--parchment);
    padding:14px 24px;border-radius:2px;
    border-top:2px solid var(--gold);
    transition:transform .3s ease, box-shadow .3s ease, background .25s;
  }
  .wa-btn:hover{transform:translateY(-2px);background:var(--songket-deep);box-shadow:0 12px 30px -16px rgba(78,12,23,.5)}
  .wa-btn svg{width:18px;height:18px;flex:none;fill:var(--gold-soft)}

  /* ---------- JAMBI ---------- */
  .jambi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .jphoto{position:relative;margin:0;border-radius:3px;overflow:hidden;aspect-ratio:3/2;border-top:3px solid var(--gold)}
  .jphoto img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
  .jphoto::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(38,16,10,.82) 0%,rgba(38,16,10,.15) 45%,transparent 70%)}
  .jphoto figcaption{
    position:absolute;left:16px;right:16px;bottom:14px;z-index:2;
    font-family:"Fraunces";font-weight:500;font-size:1rem;line-height:1.2;color:var(--parchment);
  }
  .jphoto figcaption::before{content:"";display:block;width:26px;height:2px;background:var(--gold-soft);margin-bottom:8px}
  .jphoto .jloc{display:block;font-family:"Archivo";font-size:.64rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-soft);margin-top:5px}
  .jphoto:hover img{transform:scale(1.06)}

  /* ---------- DIREKSI ---------- */
  #direksi{background:var(--parchment)}
  .team-tabs{display:inline-flex;flex-wrap:wrap;gap:5px;margin-bottom:46px;background:var(--sand);border:1px solid var(--line);border-radius:4px;padding:5px;max-width:100%}
  .team-tab{font-family:"Archivo";font-size:.82rem;font-weight:600;letter-spacing:.03em;color:var(--muted);background:none;border:none;cursor:pointer;padding:11px 22px;border-radius:2px;transition:background .25s,color .25s}
  .team-tab.active{background:var(--songket);color:var(--parchment)}
  .team-tab:hover:not(.active){color:var(--songket)}
  .team-panel[hidden]{display:none}
  .team-label{
    font-family:"Archivo";font-weight:600;text-transform:uppercase;letter-spacing:.18em;
    font-size:.74rem;color:var(--songket);margin:0 0 26px;
    padding-bottom:12px;border-bottom:1px solid var(--line);
    display:flex;align-items:center;gap:12px;
  }
  .team-label::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--gold),transparent)}
  .team-label:not(:first-of-type){margin-top:66px}
  .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
  .team-lead{grid-template-columns:repeat(2,1fr);max-width:600px;gap:34px}
  .person{margin:0;display:block;transition:transform .35s ease}
  .person:hover{transform:translateY(-5px)}
  .person-photo{
    aspect-ratio:1/1;border-radius:3px;overflow:hidden;position:relative;
    border-top:3px solid var(--gold);background:var(--sand);
    box-shadow:0 16px 34px -22px rgba(78,12,23,.5);
  }
  .person-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
  .person:hover .person-photo{box-shadow:0 24px 44px -20px rgba(78,12,23,.55)}
  .person-cap{margin-top:16px}
  .person-gs{display:inline-flex;align-items:center;gap:5px;margin-top:9px;font-family:"Archivo";font-size:.66rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
  .person-gs svg{width:12px;height:12px}
  .person:hover .person-gs{color:var(--songket)}
  .person-name{font-family:"Fraunces";font-weight:500;font-size:1.06rem;line-height:1.22;color:var(--ink)}
  .person-role{font-family:"Archivo";font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--songket);margin-top:6px}
  .team-lead .person-name{font-size:1.2rem}
  .team-lead .person-role{color:var(--gold);font-weight:700}

  /* ---------- ROUTER / HALAMAN ---------- */
  .js .page{display:none}
  .js .page.active{display:block;animation:pageIn .45s ease both}
  @keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .links a.active{color:var(--songket)}
  .links a.active::after{width:100%}
  .foot-links a.active{color:var(--gold-soft)}
  .menu-btn{font-size:1.15rem;line-height:1;color:var(--dark)}

  /* ---------- FORM NASKAH ---------- */
  .naskah-form{margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}
  .nf-title{font-family:"Fraunces";font-size:1.18rem;margin-bottom:16px;color:var(--ink)}
  .nf-row{display:flex;gap:16px;flex-wrap:wrap}
  .naskah-form label{display:flex;flex-direction:column;flex:1 1 200px;gap:6px;margin-bottom:14px;font-family:"Archivo";font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--songket)}
  .naskah-form input,.naskah-form select,.naskah-form textarea{font-family:"Newsreader";font-size:1rem;font-weight:400;letter-spacing:normal;text-transform:none;color:var(--ink);background:var(--parchment);border:1px solid var(--line);border-radius:3px;padding:11px 13px;width:100%}
  .naskah-form input:focus,.naskah-form select:focus,.naskah-form textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
  .naskah-form textarea{resize:vertical}
  .nf-note{font-family:"Archivo";font-size:.78rem;font-weight:400;letter-spacing:normal;text-transform:none;color:var(--muted);margin:2px 0 16px}
  .nf-submit{background:var(--songket);color:var(--parchment);border:none}
  .nf-submit:hover{background:var(--songket-deep)}
  .biaya-note{font-family:"Archivo";font-size:.82rem;color:#3E3226;margin-top:16px;padding:12px 16px;background:var(--parchment);border-left:3px solid var(--gold);border-radius:2px}

  /* ---------- FAQ ---------- */
  #faq{background:var(--sand)}
  .faq-list{max-width:820px;border-top:1px solid var(--line)}
    .faq-group{max-width:860px;margin-bottom:18px}
  .faq-group-2{margin-top:52px;padding-top:44px;border-top:1px solid var(--line)}
  .faq-group h3{font-family:"Fraunces";font-size:1.35rem;color:var(--songket)}
  .faq-list{display:flex;flex-direction:column;gap:12px;max-width:860px}
  .faq-item{background:var(--parchment);border:1px solid var(--line);border-radius:8px;overflow:hidden;transition:border-color .3s ease,box-shadow .3s ease}
  .faq-item:hover{border-color:var(--gold-soft)}
  .faq-item.open{border-color:var(--gold-soft);box-shadow:0 18px 38px -24px rgba(78,12,23,.4)}
  .faq-item.open .faq-ic{background:var(--songket);color:var(--gold-soft)}
  .faq-q{width:100%;background:none;border:none;cursor:pointer;text-align:left;font-family:"Fraunces";font-size:1.12rem;font-weight:500;color:var(--ink);padding:20px 22px;display:flex;justify-content:space-between;align-items:center;gap:20px}
  .faq-ic{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(185,141,62,.15);font-family:"Archivo";font-size:1.15rem;line-height:1;color:var(--songket);flex:none;transition:transform .3s ease,background .3s ease}
  .faq-item.open .faq-ic{transform:rotate(45deg)}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
  .faq-a p{padding:0 22px 22px;color:var(--muted);font-size:1rem;max-width:74ch}

  /* ---------- KEBIJAKAN ---------- */
  #kebijakan{background:var(--parchment)}
    .policy h3{background:var(--songket);color:var(--parchment);font-family:"Fraunces";font-size:1.2rem;padding:14px 22px;border-radius:8px 8px 0 0;margin-bottom:0}
  .policy h3+p{border-radius:0}
  .policy p{background:var(--parchment);border:1px solid var(--line);border-top:none;padding:18px 22px}
  .policy p+h3{margin-top:30px}
  .policy p:last-of-type,.policy h3+p:last-child{border-radius:0 0 8px 8px}
  .policy{max-width:820px}
  .policy h3{font-size:1.4rem;margin:34px 0 12px;color:var(--songket)}
  .policy h3:first-child{margin-top:0}
  .policy p{margin-bottom:14px;color:#3E3226}
  .policy-note{font-size:.9rem;color:var(--muted);margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}

  /* ---------- FOOTER LEGAL ---------- */
  .foot-legal{display:flex;flex-wrap:wrap;gap:16px 44px;padding:26px 0;border-bottom:1px solid rgba(203,162,90,.2);font-size:.84rem;color:#C9BBA4}
  .fl-item{display:flex;flex-direction:column;gap:3px}
  .fl-k{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-soft)}

  /* ---------- FOOTER PARTNERS ---------- */

  /* ---------- LEGALITAS ---------- */
  #legalitas{background:var(--sand)}
    .legal-badge{display:flex;align-items:center;gap:18px;background:var(--songket);color:var(--parchment);border-radius:10px;padding:22px 26px;margin-bottom:26px}
  .lb-ic{display:grid;place-items:center;width:50px;height:50px;flex:none;border-radius:50%;background:rgba(203,162,90,.2);color:var(--gold-soft)}
  .lb-ic svg{width:26px;height:26px}
  .lb-text{display:flex;flex-direction:column;gap:4px}
  .lb-text b{font-family:"Fraunces";font-size:1.2rem;font-weight:600}
  .lb-text span{font-family:"Archivo";font-size:.82rem;color:#E2D6BE;line-height:1.5}
  .legal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:52px}
    .legal-item{background:var(--parchment);border:1px solid var(--line);border-radius:8px;padding:20px 22px;display:flex;align-items:flex-start;gap:14px;transition:border-color .3s ease,transform .3s ease}
  .legal-item:hover{border-color:var(--gold-soft);transform:translateY(-3px)}
  .lg-ic{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:9px;background:rgba(185,141,62,.13);color:var(--songket)}
  .lg-ic svg{width:20px;height:20px}
  .lg-txt{display:flex;flex-direction:column;gap:5px;min-width:0}
  .legal-item.legal-wide{grid-column:1 / -1}
  .lg-k{font-family:"Archivo";font-size:.64rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--songket)}
  .lg-v{font-family:"Newsreader";font-size:1.08rem;color:var(--ink);line-height:1.4}
  .legal-kbli h3{font-size:1.4rem;color:var(--songket);margin-bottom:18px}
    .kbli-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .kbli-item{display:flex;align-items:baseline;gap:11px;background:var(--parchment);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:5px;padding:13px 16px}
  .kbli-item b{font-family:"Archivo";font-size:.78rem;font-weight:700;letter-spacing:.04em;color:var(--songket);flex:none}
  .kbli-item span{font-family:"Newsreader";font-size:.96rem;color:#3E3226;line-height:1.4}
  .legal-note{margin-top:28px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:.95rem;max-width:840px}

  /* ---------- FAQ FLOATING BUTTON ---------- */
  .faq-fab{position:fixed;right:22px;bottom:22px;z-index:70;display:block;line-height:0;text-decoration:none;filter:drop-shadow(0 10px 18px rgba(78,12,23,.45));transition:transform .25s}
  .faq-fab img{height:58px;width:auto;display:block}
  .faq-fab:hover{transform:translateY(-3px) scale(1.03)}

  /* ---------- HARGA / KATALOG PRICE ---------- */
  .b-price{font-family:"Fraunces";font-size:1.05rem;font-weight:500;color:var(--gold-soft);margin-top:9px}
  .detail-price{font-family:"Fraunces";font-size:1.7rem;font-weight:600;color:var(--songket);margin-bottom:20px}
  #harga{background:var(--sand)}
  .calc-grid{display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:start}
  .calc-inputs{display:flex;gap:18px;margin-bottom:22px;flex-wrap:wrap}
  .calc-field{flex:1;min-width:170px;display:flex;flex-direction:column;gap:7px}
  .calc-field label{font-family:"Archivo";font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--songket)}
  .calc-field input{font-family:"Newsreader";font-size:1.05rem;padding:12px 14px;border:1px solid var(--line);border-radius:4px;background:var(--parchment);color:var(--ink)}
  .calc-field input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
  .calc-services{display:flex;flex-direction:column;gap:10px}
  .calc-svc{display:flex;align-items:center;gap:14px;background:var(--parchment);border:1px solid var(--line);border-radius:5px;padding:15px 18px;cursor:pointer;transition:border-color .2s}
  .calc-svc:hover{border-color:var(--gold-soft)}
  .calc-svc input{width:18px;height:18px;flex:none;accent-color:var(--songket)}
  .cs-name{flex:1;font-family:"Newsreader";font-size:1.05rem;color:var(--ink);display:flex;flex-direction:column}
  .cs-name small{font-family:"Archivo";font-size:.72rem;color:var(--muted);margin-top:3px}
  .calc-svc b{font-family:"Fraunces";font-size:1.05rem;color:var(--songket);white-space:nowrap}
  .calc-summary{position:sticky;top:96px;background:var(--songket);color:var(--parchment);border-radius:6px;padding:28px 26px;text-align:center}
  .cs-label{font-family:"Archivo";font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:8px}
  .cs-total{font-family:"Fraunces";font-size:2.4rem;color:var(--parchment);line-height:1;margin-bottom:12px}
  .cs-note{font-family:"Archivo";font-size:.74rem;color:#D9CDB6;line-height:1.55;margin-bottom:20px}
  .calc-summary .btn{width:100%;text-align:center}
  @media (max-width:820px){.calc-grid{grid-template-columns:1fr}.calc-summary{position:static}}

  /* ---------- PAKET ---------- */
  .pkg-group{margin-bottom:22px}
  .pkg-group-2{margin-top:70px;padding-top:56px;border-top:1px solid var(--line)}
  .pkg-group h3{font-family:"Fraunces";font-size:1.45rem;color:var(--songket);margin-bottom:6px}
  .pkg-group p{font-family:"Newsreader";color:var(--muted);font-size:1rem}
  .pkg-sub{font-family:"Archivo";font-size:.78rem;color:var(--muted);line-height:1.55;margin:-12px 0 20px}
  .pkg-note{margin-top:18px;font-family:"Archivo";font-size:.8rem;color:var(--muted);line-height:1.6}
  .pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .pkg-single{grid-template-columns:minmax(0,380px)}
  .pkg-card{display:flex;flex-direction:column;background:var(--parchment);border:1px solid var(--line);border-radius:8px;padding:30px 26px;position:relative}
  .pkg-featured{background:var(--songket);border-color:var(--songket);color:var(--parchment);box-shadow:0 24px 52px -22px rgba(78,12,23,.6)}
  .pkg-tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--gold);color:#2A1206;font-family:"Archivo";font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:5px 14px;border-radius:20px;white-space:nowrap}
  .pkg-name{font-family:"Archivo";font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
  .pkg-featured .pkg-name{color:var(--gold-soft)}
  .pkg-price{font-family:"Fraunces";font-size:2rem;font-weight:600;color:var(--songket);margin-bottom:22px}
  .pkg-featured .pkg-price{color:var(--parchment)}
  .pkg-feats{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:26px}
  .pkg-feats li{font-family:"Newsreader";font-size:1rem;color:#3E3226;padding-left:26px;position:relative}
  .pkg-featured .pkg-feats li{color:#EFE6D2}
  .pkg-feats li::before{content:"";position:absolute;left:2px;top:7px;width:11px;height:6px;border-left:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(-45deg)}
  .pkg-card{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
  .pkg-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -26px rgba(78,12,23,.4);border-color:var(--gold-soft)}
  .pkg-featured:hover{box-shadow:0 32px 60px -24px rgba(78,12,23,.7)}
  .kbli-item{transition:transform .25s ease,border-color .25s ease}
  .kbli-item:hover{transform:translateX(4px);border-color:var(--gold-soft)}
  .pkg-card .btn{width:100%;text-align:center;margin-top:auto}
  .btn-line{background:transparent;border:1.5px solid var(--songket);color:var(--songket)}
  .btn-line:hover{background:var(--songket);color:var(--parchment)}
  .calc-divider{margin-top:58px;padding-top:46px;border-top:1px solid var(--line);margin-bottom:30px}
  .calc-divider h3{font-family:"Fraunces";font-size:1.5rem;color:var(--songket);margin-bottom:8px}
  .calc-divider p{font-family:"Newsreader";color:var(--muted)}
  @media (max-width:820px){.pkg-grid{grid-template-columns:1fr;gap:28px}}

  /* ---------- BERANDA TAMBAHAN ---------- */
  .hero-fade{
    position:relative;
    z-index:1;
    height:var(--hero-fade-height);
    margin-top:-1px;
    margin-bottom:-1px;
    background-color:var(--parchment);
    background-image:linear-gradient(180deg,
      #5A101B 0%,
      rgba(90,16,27,.92) 18%,
      rgba(90,16,27,.72) 42%,
      rgba(90,16,27,.46) 64%,
      rgba(90,16,27,.22) 82%,
      rgba(90,16,27,0) 100%);
  }
  .home-extra{
    position:relative;
    margin-top:-1px;
    background:linear-gradient(180deg,var(--parchment) 0%,#F1E8D5 42%,var(--sand) 100%);
    color:var(--ink);
    padding:56px 0 84px;
  }
  .home-extra>.wrap{position:relative;z-index:1}
  .trust{text-align:center;padding-bottom:52px;margin-bottom:56px;border-bottom:1px solid var(--line)}
  .trust-label{font-family:"Archivo";font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
  .trust-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px}
  .trust-row span{font-family:"Archivo";font-size:.82rem;font-weight:600;letter-spacing:.03em;color:var(--songket);background:var(--parchment);border:1px solid var(--line);border-radius:20px;padding:8px 18px}
  .why-head{margin-bottom:34px}
  .why-head h2{font-family:"Fraunces";font-weight:500;font-size:clamp(1.6rem,3vw,2.1rem);color:var(--songket);line-height:1.2}
  .why-head .eyebrow{color:var(--gold)}
  .why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
  .why-item{display:flex;gap:16px;background:var(--parchment);border:1px solid var(--line);border-radius:8px;padding:24px 24px;transition:border-color .3s ease,transform .3s ease}
  .why-item:hover{border-color:var(--gold-soft);transform:translateY(-4px)}
  .wu-ic{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:11px;background:rgba(185,141,62,.13);color:var(--songket)}
  .wu-ic svg{width:22px;height:22px}
  .why-item b{display:block;font-family:"Newsreader";font-weight:500;font-size:1.1rem;color:var(--ink);margin-bottom:6px}
  .why-item p{font-family:"Archivo";font-size:.84rem;color:var(--muted);line-height:1.6}
  .home-cta{margin-top:58px;background:var(--songket);color:var(--parchment);border-radius:12px;padding:40px 42px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
  .hc-text h2{font-family:"Fraunces";font-weight:500;font-size:clamp(1.5rem,2.6vw,1.95rem);margin-bottom:10px;line-height:1.2}
  .hc-text p{font-family:"Archivo";font-size:.9rem;color:#E2D6BE;line-height:1.6;max-width:56ch}
  .hc-act{display:flex;gap:12px;flex-wrap:wrap}
  .home-cta .btn-ghost{border-color:var(--gold-soft);color:var(--gold-soft)}
  .home-cta .btn-ghost:hover{background:var(--gold-soft);color:var(--songket-deep)}
  @media (max-width:820px){
    .hero-stage{--hero-fade-height:112px}
    .why-grid{grid-template-columns:1fr}
    .home-cta{flex-direction:column;align-items:flex-start;padding:32px 28px}
    .hc-act{width:100%}
    .hc-act .btn{flex:1;text-align:center}
  }

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink);color:#C9BBA4;padding:56px 0 30px;font-family:"Archivo"}
  .foot-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;padding-bottom:34px;border-bottom:1px solid rgba(203,162,90,.2)}
  .foot-brand{font-family:"Fraunces";font-size:1.3rem;color:var(--parchment)}
  .foot-brand span{display:block;font-family:"Archivo";font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-soft);margin-top:6px}
  .foot-links{display:flex;gap:34px;flex-wrap:wrap;font-size:.86rem}
  .foot-links a:hover{color:var(--gold-soft)}
  .foot-bottom{padding-top:24px;font-size:.78rem;color:#8A7C64;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

  .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}

  :focus-visible{outline:2px solid var(--gold);outline-offset:3px}

  @media (max-width:960px){
    .about-grid,.contact-grid{grid-template-columns:1fr;gap:40px}
    .svc-grid{grid-template-columns:1fr}
    .book-row{grid-template-columns:repeat(2,1fr)}
    .jur-grid{grid-template-columns:1fr 1fr}
    .steps{grid-template-columns:1fr 1fr;gap:36px 20px}
    .step:not(:last-child)::after{display:none}
    .team-grid{grid-template-columns:repeat(3,1fr)}
    .team-lead{grid-template-columns:repeat(2,1fr)}
    .jambi-grid{grid-template-columns:repeat(2,1fr)}
  }

  @media (max-width:1150px){
    nav.links{
      position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
      background:var(--parchment);border-bottom:1px solid var(--line);
      padding:6px 28px 16px;display:none;
      box-shadow:0 22px 30px -24px rgba(0,0,0,.45);
    }
    nav.links.open{display:flex}
    nav.links a{padding:13px 0;border-bottom:1px solid var(--line);width:100%}
    nav.links a:last-child{border-bottom:none}
    nav.links a::after{display:none}
    .menu-btn{display:inline-flex;align-items:center;margin-left:auto;order:2}
    .nav-cta{order:3}
  }
  @media (max-width:640px){
    .nav-cta{padding:9px 15px;font-size:.76rem}
    body{font-size:17px}
    .book-row{grid-template-columns:1fr 1fr;gap:16px}
    .jur-grid{grid-template-columns:1fr}
    .steps{grid-template-columns:1fr}
    .hero-inner{padding:60px 24px 54px}
    section{padding:68px 0}
    .hero-actions{gap:12px}
    .hero-actions .btn{flex:1 1 46%;text-align:center;padding:14px 18px}
    .hero-pillars{gap:24px 30px;margin-top:42px}
    .contact-list .v{text-align:left}
    .wa-btn{width:100%;justify-content:center}
    .nf-row{flex-direction:column;gap:0}
    .team-grid,.team-lead{grid-template-columns:repeat(2,1fr);gap:18px}
    .team-label:not(:first-of-type){margin-top:48px}
    .jambi-grid{grid-template-columns:1fr 1fr;gap:12px}
    .jphoto figcaption{font-size:.86rem}
    .legal-grid{grid-template-columns:1fr 1fr}
    .kbli-grid{grid-template-columns:1fr 1fr}
  }

  @media (max-width:460px){
    .hero h1{font-size:2.15rem;line-height:1.1}
    .hero-inner{padding:46px 22px 44px}
    section{padding:52px 0}
    .sec-head{margin-bottom:38px}
    .sec-head h2{font-size:1.6rem}
    .hero-actions{flex-direction:column}
    .hero-actions .btn{width:100%;flex:none;padding:14px 20px}
    .hero-pillars{margin-top:36px}
    .team-tabs{display:flex;flex-wrap:wrap;width:100%}
    .team-tab{flex:1 1 46%;padding:11px 8px;font-size:.72rem;text-align:center;letter-spacing:.02em}
    .team-grid,.team-lead{gap:14px}
    .person-name{font-size:.98rem}
    .team-lead .person-name{font-size:1.06rem}
    .jur-cover{width:76px;height:104px}
    .adat-card{padding:28px 22px}
    .svc{padding:26px 22px}
    .legal-grid{grid-template-columns:1fr}
    .kbli-grid{grid-template-columns:1fr}
    .legal-badge{flex-direction:column;text-align:center}
    .faq-fab{right:16px;bottom:16px}
    .faq-fab img{height:48px}
  }
  @media (prefers-reduced-motion:reduce){
    .reveal{opacity:1;transform:none;transition:none}
    html{scroll-behavior:auto}
    *{transition:none!important}
  }


  /* ======================================================================
     POLISH PASS — visual consistency, responsiveness, accessibility
     ====================================================================== */
  :root{
    --surface:#FBF7EE;
    --surface-warm:#F3E9D6;
    --surface-deep:#E7D9BD;
    --radius-sm:6px;
    --radius-md:12px;
    --radius-lg:18px;
    --shadow-sm:0 10px 28px -24px rgba(78,12,23,.45);
    --shadow-md:0 24px 54px -34px rgba(78,12,23,.56);
    --ease:cubic-bezier(.2,.7,.2,1);
  }
  html{scrollbar-gutter:stable}
  body{min-height:100vh;text-rendering:optimizeLegibility}
  button,input,select,textarea{font:inherit}
  button{color:inherit}
  ::selection{background:rgba(185,141,62,.28);color:var(--songket-deep)}
  .visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
  .skip-link{position:fixed;left:18px;top:14px;z-index:9999;background:var(--songket);color:var(--parchment);font-family:"Archivo",sans-serif;font-size:.82rem;font-weight:700;padding:11px 16px;border-radius:var(--radius-sm);transform:translateY(-160%);transition:transform .2s ease}
  .skip-link:focus{transform:none}
  .wrap{width:100%}

  /* Header */
  header.nav{background:rgba(248,242,229,.92);border-bottom:1px solid rgba(185,141,62,.24);box-shadow:0 1px 0 rgba(255,255,255,.5);transition:box-shadow .25s ease,background .25s ease}
  header.nav.scrolled{background:rgba(248,242,229,.97);box-shadow:0 14px 34px -28px rgba(42,29,21,.65)}
  .nav-inner{height:78px;gap:18px}
  .brand{min-width:0}
  .seal{width:46px;height:46px;border-width:1px;box-shadow:0 0 0 4px rgba(185,141,62,.12),var(--shadow-sm)}
  .seal img{width:29px;height:29px}
  .brand-name{display:block;font-size:1.12rem;white-space:nowrap}
  .brand-sub{display:block;font-family:"Archivo",sans-serif;font-size:.56rem;line-height:1.1;letter-spacing:.18em;text-transform:uppercase;color:var(--songket);margin-top:5px;white-space:nowrap}
  nav.links{gap:18px}
  nav.links a{font-size:.82rem;padding:8px 0}
  nav.links a.active{font-weight:600}
  .nav-cta{border-radius:var(--radius-sm);padding:12px 18px;box-shadow:0 12px 26px -20px rgba(78,12,23,.75);white-space:nowrap;transition:transform .25s var(--ease),background .25s ease,box-shadow .25s ease}
  .nav-cta:hover{transform:translateY(-2px);box-shadow:0 18px 30px -20px rgba(78,12,23,.8)}
  .cta-short{display:none}
  .menu-btn{width:44px;height:44px;align-items:center;justify-content:center;padding:0;border-radius:var(--radius-sm);background:rgba(255,255,255,.28);transition:background .2s ease,border-color .2s ease}
  .menu-btn svg{width:22px;height:22px}
  .menu-btn:hover{background:var(--surface);border-color:var(--gold-soft)}
  body.menu-open{overflow:hidden}

  /* Hero */
  .hero-stage{
    --hero-fade-height:clamp(102px,8.4vw,132px);
    background:
      radial-gradient(circle at 78% 20%,rgba(185,141,62,.10),transparent 28%),
      radial-gradient(circle at 20% 24%,rgba(255,255,255,.035),transparent 30%),
      linear-gradient(180deg,#450A14 0%,#520D18 42%,#5A101B 76%,#5A101B 100%);
  }
  .hero-stage::after{display:none}
  .hero-weave{inset:0 0 calc(var(--hero-fade-height) + 34px) 0;opacity:.115;background-size:58px 58px;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 78%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 78%,transparent 100%)}
  .hero-inner{
    display:grid;
    grid-template-columns:minmax(0,1.14fr) minmax(330px,.86fr);
    grid-template-areas:
      "eyebrow shelf"
      "title shelf"
      "lead shelf"
      "actions shelf"
      "stats shelf"
      "pillars pillars";
    column-gap:72px;
    align-items:start;
    padding:96px 28px 72px;
  }
  .hero-inner>.eyebrow{grid-area:eyebrow}
  .hero h1{grid-area:title;font-size:clamp(2.65rem,5.5vw,5.05rem);max-width:760px;margin:20px 0 24px;text-wrap:balance}
  .hero-lead{grid-area:lead;max-width:690px}
  .hero-actions{grid-area:actions;margin-top:36px}
  .hero-stats{grid-area:stats;margin-top:38px;gap:38px}
  .hero-shelf{grid-area:shelf;align-self:center;margin:0;padding:25px;border:1px solid rgba(203,162,90,.24);border-radius:var(--radius-lg);background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 30px 70px -48px rgba(0,0,0,.9);backdrop-filter:blur(3px)}
  .hs-label{margin-bottom:18px;color:#E2BD72}
  .hs-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;align-items:end}
  .hs-item{width:auto;grid-column:span 2;border-radius:7px;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 34px -18px rgba(0,0,0,.85)}
  .hs-item:nth-child(4){grid-column:2/span 2}
  .hs-item:nth-child(5){grid-column:4/span 2}
  .hs-item:hover{transform:translateY(-7px) rotate(-.5deg)}
  .hero-pillars{grid-area:pillars;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:58px;padding-top:26px}
  .pillar{max-width:none;padding:0 30px;border-left:1px solid rgba(203,162,90,.22)}
  .pillar:first-child{padding-left:0;border-left:0}
  .pillar:last-child{padding-right:0}
  .pillar .p-t{font-size:1.12rem}
  .pillar .p-d{max-width:31ch}
  .hero-fade{
    height:var(--hero-fade-height);
    background-color:var(--parchment);
    background-image:
      radial-gradient(ellipse at 22% 0%,rgba(255,255,255,.07),transparent 52%),
      linear-gradient(180deg,#5A101B 0%,#6E202C 22%,#92505A 48%,#C6908E 70%,#E4C8B8 86%,var(--parchment) 100%);
  }
  @supports (background:linear-gradient(in oklab,#000,#fff)){
    .hero-fade{background-image:radial-gradient(ellipse at 22% 0%,rgba(255,255,255,.07),transparent 52%),linear-gradient(180deg in oklab,#5A101B 0%,#711E2B 24%,#A75E66 55%,#D9AEA5 79%,var(--parchment) 100%)}
  }
  .home-extra{padding:48px 0 88px;background:linear-gradient(180deg,var(--parchment) 0%,#F3EAD9 50%,var(--sand) 100%)}
  .trust{padding-bottom:44px;margin-bottom:52px}
  .trust-row span{background:rgba(255,253,248,.62);border-color:rgba(185,141,62,.30);box-shadow:0 8px 20px -18px rgba(78,12,23,.5)}
  .why-item{border-radius:var(--radius-md);background:rgba(255,253,248,.62);box-shadow:var(--shadow-sm)}
  .home-cta{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--songket) 0%,#5A101B 100%);border:1px solid rgba(203,162,90,.28);box-shadow:0 26px 56px -38px rgba(78,12,23,.75)}
  .home-cta::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.08;background-image:repeating-linear-gradient(45deg,transparent 0 18px,var(--gold-soft) 18px 19px),repeating-linear-gradient(-45deg,transparent 0 18px,var(--gold-soft) 18px 19px);background-size:38px 38px;mask-image:linear-gradient(to right,transparent,#000)}
  .home-cta>*{position:relative;z-index:1}

  /* Shared section and card polish */
  section{padding:96px 0}
  .sec-head{margin-bottom:50px}
  .sec-head h2{text-wrap:balance}
  .svc,.jur,.why-item,.pkg-card,.legal-item,.faq-item,.contact-list li{box-shadow:var(--shadow-sm)}
  .svc{display:flex;flex-direction:column;min-height:100%;border-radius:var(--radius-md);background:rgba(255,253,248,.55)}
  .svc ul{margin-top:auto;padding-top:18px}
  .svc:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--gold-soft)}
  .svc-ic{border-radius:10px}
  .sub-block{margin-top:66px;padding-top:54px}

  /* About */
  #tentang{background:linear-gradient(180deg,var(--sand) 0%,#F1E8D5 100%)}
  .adat-card{position:sticky;top:108px;border-radius:var(--radius-md);box-shadow:0 28px 62px -42px rgba(78,12,23,.8);overflow:hidden}
  .adat-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:28px;padding-top:24px;border-top:1px solid rgba(203,162,90,.28)}
  .adat-facts div{min-width:0}
  .adat-facts b{display:block;font-family:"Fraunces",serif;font-size:1.05rem;color:var(--gold-soft);line-height:1.1}
  .adat-facts span{display:block;font-family:"Archivo",sans-serif;font-size:.62rem;line-height:1.45;color:#D9CDB6;margin-top:5px}
  .jphoto{border-radius:10px;box-shadow:0 18px 34px -26px rgba(42,29,21,.65)}
  .jphoto::after{background:linear-gradient(to top,rgba(38,16,10,.86) 0%,rgba(38,16,10,.15) 52%,transparent 74%)}

  /* Team */
  .team-tabs{border-radius:10px;padding:6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
  .team-tab{border-radius:6px}
  .person{padding:10px 10px 16px;border:1px solid transparent;border-radius:var(--radius-md)}
  .person:hover{background:rgba(255,253,248,.55);border-color:rgba(185,141,62,.34);box-shadow:var(--shadow-sm)}
  .person-photo{border-radius:9px}

  /* Catalog */
  .book-search{max-width:520px;margin-bottom:14px}
  .book-search input{border-radius:8px;background:rgba(255,255,255,.065)}
  .book-count{font-family:"Archivo",sans-serif;font-size:.72rem;color:#AFA089;margin-bottom:28px;min-height:1.2em}
  .book-row{align-items:stretch}
  .book{display:flex;flex-direction:column;min-width:0}
  #book-list .book[hidden]{display:none!important}
  .cover-link{display:block}
  .cover-img{border-radius:8px;box-shadow:0 24px 46px -26px rgba(0,0,0,.8)}
  .book-meta{display:flex;flex:1;flex-direction:column}
  .book-meta .bt{font-size:1.04rem;min-height:2.45em}
  .book-meta .ba{min-height:2.4em;line-height:1.45}
  .book-actions{margin-top:auto;padding-top:14px}
  .book-btn{border-radius:6px;min-height:40px;display:grid;place-items:center}
  .book-status{border-radius:5px;box-shadow:0 8px 18px -14px rgba(0,0,0,.7)}
  .book-syn{border-radius:10px}
  .syn-modal{isolation:isolate}
  .syn-backdrop{border:0;cursor:pointer}
  .syn-box{border-radius:var(--radius-lg);border-top:4px solid var(--gold);padding:44px 38px 38px;animation:dialogIn .22s var(--ease) both}
  .syn-close{display:grid;place-items:center;width:42px;height:42px;top:10px;right:12px;border-radius:50%;font-size:1.75rem}
  .syn-close:hover{background:rgba(185,141,62,.13)}
  body.modal-open{overflow:hidden}
  @keyframes dialogIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

  /* Services timeline */
  .steps{gap:0}
  .step .n::before{box-shadow:0 0 0 5px var(--parchment)}

  /* Journals */
  .jur{border-radius:var(--radius-md);padding:26px;min-height:100%;background:rgba(255,253,248,.62)}
  .jur-head{position:relative;display:block;height:142px;margin-bottom:18px;padding-bottom:18px}
  .jur-cover{position:relative;z-index:2;width:92px;height:124px;border-radius:6px}
  .jur-head .abbr{display:none;width:92px;height:124px;border-radius:6px;place-items:center;background:linear-gradient(155deg,var(--songket),var(--songket-deep));color:var(--gold-soft);border:1px solid rgba(185,141,62,.45);box-shadow:0 12px 24px -14px rgba(78,12,23,.65)}
  .jur-cover[hidden]+.abbr{display:grid}
  .jur h3{font-size:1.13rem}
  .jur-go{margin-top:auto}
  .jur:hover{box-shadow:var(--shadow-md)}

  /* Contact */
  .contact-grid{gap:54px}
  .naskah-form{margin-top:34px;padding:28px;border:1px solid rgba(185,141,62,.30);border-radius:var(--radius-md);background:rgba(255,253,248,.50);box-shadow:var(--shadow-sm)}
  .nf-title{font-size:1.26rem}
  .naskah-form input,.naskah-form select,.naskah-form textarea{border-radius:7px;background:rgba(255,253,248,.88)}
  .form-status{min-height:1.2em;font-family:"Archivo",sans-serif;font-size:.76rem;color:var(--songket);margin:0 0 10px}
  .contact-list li{border-radius:10px;background:rgba(255,253,248,.64)}
  .contact-list .v a{text-decoration:underline;text-decoration-color:rgba(185,141,62,.55);text-underline-offset:3px}
  .contact-list .v a:hover{color:var(--songket)}
  .wa-btn{border-radius:7px}

  /* Pricing and legal */
  .pkg-card{border-radius:var(--radius-md);background:rgba(255,253,248,.62)}
  .pkg-featured{background:linear-gradient(160deg,var(--songket),#5B101B)}
  .calc-svc{border-radius:9px;background:rgba(255,253,248,.62)}
  .calc-svc:has(input:checked){border-color:var(--gold);background:#FBF4E5;box-shadow:0 10px 24px -22px rgba(78,12,23,.55)}
  .calc-summary{border-radius:var(--radius-md);box-shadow:0 26px 54px -36px rgba(78,12,23,.8)}
  .legal-badge{border-radius:var(--radius-md)}
  .legal-item{border-radius:10px;background:rgba(255,253,248,.62)}
  .kbli-item{border-radius:8px;background:rgba(255,253,248,.58)}

  /* FAQ */
  .faq-list{border-top:0}
  .faq-item{border-radius:10px;background:rgba(255,253,248,.68)}
  .faq-q{min-height:68px}
  .faq-q:hover{color:var(--songket)}
  .faq-a p{line-height:1.7}
  .faq-fab{right:22px;bottom:22px;display:inline-flex;align-items:center;gap:7px;line-height:1;background:linear-gradient(135deg,var(--gold-soft),var(--gold));color:#35140C;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:7px 13px 7px 7px;filter:none;box-shadow:0 16px 34px -20px rgba(78,12,23,.75);transition:transform .25s var(--ease),opacity .2s ease,visibility .2s ease}
  .faq-fab-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--songket);color:var(--parchment);font-family:"Archivo",sans-serif;font-size:.9rem;font-weight:700}
  .faq-fab-text{font-family:"Archivo",sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.08em}
  .faq-fab.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(10px)}
  .faq-fab:hover{transform:translateY(-3px)}

  /* Policy cards — fixes invisible headings and creates clear grouping */
  .policy{display:grid;gap:22px;max-width:880px}
  .policy-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:rgba(255,253,248,.62);box-shadow:var(--shadow-sm)}
  .policy-card h3{margin:0!important;padding:16px 22px!important;background:linear-gradient(135deg,var(--songket),#5B101B)!important;color:var(--parchment)!important;font-family:"Fraunces",serif!important;font-size:1.3rem!important;border-radius:0!important}
  .policy-body{padding:6px 22px 10px}
  .policy-body p{margin:0!important;padding:16px 0!important;background:transparent!important;border:0!important;border-top:1px solid rgba(216,203,171,.75)!important;border-radius:0!important;color:#3E3226!important;line-height:1.72}
  .policy-body p:first-child{border-top:0!important}
  .policy .policy-note{margin:2px 0 0!important;padding:17px 20px!important;border:1px solid var(--line)!important;border-left:3px solid var(--gold)!important;border-radius:9px!important;background:rgba(255,253,248,.50)!important;font-family:"Archivo",sans-serif;font-size:.8rem;color:var(--muted)!important}
  .policy-note a{font-weight:700;color:var(--songket);text-decoration:underline;text-underline-offset:3px}

  /* Footer */
  .songket-band{height:20px}
  footer{padding-top:52px}
  .foot-links{gap:24px 28px}

  @media (max-width:1240px){
    nav.links{position:absolute;top:100%;left:0;right:0;display:flex;flex-direction:column;gap:0;max-height:0;overflow:hidden;visibility:hidden;opacity:0;transform:translateY(-8px);background:rgba(248,242,229,.985);border-bottom:1px solid var(--line);padding:0 28px;box-shadow:0 22px 34px -24px rgba(0,0,0,.45);transition:max-height .35s var(--ease),opacity .22s ease,transform .25s var(--ease),visibility .22s ease,padding .35s var(--ease)}
    nav.links.open{max-height:calc(100vh - 78px);overflow-y:auto;visibility:visible;opacity:1;transform:none;padding-top:8px;padding-bottom:18px}
    nav.links a{width:100%;padding:13px 0;border-bottom:1px solid rgba(216,203,171,.75)}
    nav.links a:last-child{border-bottom:0}
    nav.links a::after{display:none}
    .menu-btn{display:inline-flex;margin-left:auto;order:2}
    .nav-cta{order:3}
  }

  @media (max-width:960px){
    .hero-inner{grid-template-columns:1fr;grid-template-areas:"eyebrow" "title" "lead" "actions" "stats" "shelf" "pillars";padding-top:78px;row-gap:0}
    .hero-shelf{width:min(100%,650px);margin-top:46px}
    .hero-pillars{margin-top:46px}
    .adat-card{position:static}
  }

  @media (max-width:700px){
    .wrap{padding-left:20px;padding-right:20px}
    section{padding:68px 0}
    .sec-head{margin-bottom:38px}
    .hero-inner{padding:58px 20px 52px}
    .hero h1{font-size:clamp(2.25rem,10vw,3.15rem)}
    .hero-actions .btn{border-radius:7px}
    .hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
    .hstat b{font-size:1.7rem}
    .hstat span{font-size:.58rem;line-height:1.35}
    .hero-shelf{padding:18px;border-radius:14px}
    .hs-row{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
    .hs-item,.hs-item:nth-child(4),.hs-item:nth-child(5){grid-column:auto}
    .hero-pillars{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border-top:0;padding-top:0}
    .pillar{padding:17px;border:1px solid rgba(203,162,90,.18);border-radius:9px;background:rgba(255,255,255,.025)}
    .pillar:first-child{padding-left:17px;border-left:1px solid rgba(203,162,90,.18)}
    .pillar:last-child{grid-column:1/-1;padding-right:17px}
    .pillar .p-d{max-width:none}
    .hero-fade{height:104px}
    .home-extra{padding-top:42px}
    .adat-facts{grid-template-columns:1fr;gap:15px}
    .team-tabs{display:flex;flex-wrap:nowrap;width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:none}
    .team-tabs::-webkit-scrollbar{display:none}
    .team-tab{flex:0 0 auto;scroll-snap-align:start;padding:11px 16px}
    .steps{display:grid;grid-template-columns:1fr;gap:0;padding:0 0 0 34px}
    .steps::before{top:7px;bottom:20px;left:10px;right:auto;width:1px;height:auto;background:linear-gradient(180deg,var(--gold-soft),rgba(203,162,90,.15))}
    .step{text-align:left;padding:0 0 30px 18px}
    .step:last-child{padding-bottom:0}
    .step .n{font-size:1.65rem}
    .step .n::before{top:6px;left:-42px;transform:none;width:10px;height:10px;box-shadow:0 0 0 5px var(--parchment)}
    .step h3{margin:5px 0 7px}
    .step p{max-width:45ch}
    .book-actions{flex-direction:column}
    .syn-hold{width:100%}
    .book-btn{width:100%}
    .contact-grid{gap:38px}
    .naskah-form{padding:22px 18px}
    .contact-list li{align-items:flex-start;flex-direction:column;gap:6px}
    .contact-list .v{text-align:left}
    .faq-fab{right:14px;bottom:14px;padding:6px}
    .faq-fab-text{display:none}
    .faq-fab-icon{width:34px;height:34px}
    .foot-top{gap:28px}
    .foot-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px;width:100%}
  }

  @media (max-width:520px){
    .nav-inner{height:68px;gap:9px}
    .seal{width:39px;height:39px}
    .seal img{width:25px;height:25px}
    .brand{gap:10px}
    .brand-name{font-size:.98rem;white-space:normal;line-height:1.08;max-width:110px}
    .brand-sub{display:none}
    .nav-cta{padding:10px 12px;font-size:.72rem}
    .cta-full{display:none}
    .cta-short{display:inline}
    nav.links.open{max-height:calc(100vh - 68px)}
    .hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hstat:last-child{grid-column:1/-1}
    .hero-pillars{grid-template-columns:1fr}
    .pillar:last-child{grid-column:auto}
    .book-row{gap:14px}
    .book-meta .bt{font-size:.94rem;min-height:0}
    .book-meta .ba{font-size:.7rem;min-height:0}
    .b-price{font-size:.94rem}
    .book-btn{font-size:.68rem;min-height:38px}
    .book-status{font-size:.49rem;padding:4px 6px;right:6px;top:6px}
    .syn-box{padding:42px 22px 26px}
    .jur{padding:22px}
    .policy-card h3{font-size:1.15rem!important;padding:14px 18px!important}
    .policy-body{padding:4px 18px 8px}
    .policy-body p{font-size:.98rem;padding:14px 0!important}
  }

  @media (hover:none){
    .book-syn{display:none}
  }


  /* ======================================================================
     FINAL QA REFINEMENTS — spacing, image sizing, resilient fallbacks
     ====================================================================== */
  body{overflow-x:clip}

  /* A real, continuous maroon-to-parchment blend with valid OKLab syntax. */
  .hero-stage{--hero-fade-height:clamp(154px,11vw,184px)}
  .hero-fade{
    height:var(--hero-fade-height);
    background-color:var(--parchment);
    background-image:linear-gradient(180deg,
      #5A101B 0%,
      #651620 14%,
      #762833 30%,
      #93464F 47%,
      #B97978 64%,
      #D5AAA1 79%,
      #E9D4C7 90%,
      var(--parchment) 100%);
  }
  @supports (background:linear-gradient(in oklab,#000,#fff)){
    .hero-fade{background-image:linear-gradient(180deg in oklab,#5A101B 0%,#711E2B 24%,#A75E66 55%,#D9AEA5 79%,var(--parchment) 100%)}
  }
  @media (max-width:700px){
    .hero-stage{--hero-fade-height:148px}
    .hero-fade{height:var(--hero-fade-height)}
  }

  /* Keep the skip link genuinely off-canvas until keyboard focus. */
  .skip-link{top:-100px;transform:none}
  .skip-link:focus{top:14px;transform:none}

  /* HTML image dimensions reserve layout space, but the shelf must scale. */
  .hs-item img{height:auto!important}

  /* The synopsis is now handled by the accessible modal, not a wide tooltip. */
  .book-syn{display:none!important}

  /* Clear hierarchy on the About page. */
  .about-copy>.eyebrow{
    margin:0!important;
    color:var(--songket)!important;
    font-family:"Archivo",sans-serif!important;
    font-size:.72rem!important;
    font-weight:600!important;
    line-height:1.45!important;
    letter-spacing:.22em!important;
    text-transform:uppercase!important;
  }
  .about-copy>h2{font-size:clamp(2.15rem,4vw,3.45rem);margin:17px 0 24px;text-wrap:balance}
  .about-copy>h2+p{font-family:"Fraunces",Georgia,serif;font-size:1.22rem;line-height:1.48;color:var(--ink)}

  /* Form rows use an explicit grid so flex-basis cannot create huge gaps. */
  .nf-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .nf-row>label{min-width:0;flex:none}

  /* Journal monograms remain visible while remote covers load or fail. */
  .jur-head{position:relative}
  .jur-head .abbr{
    display:grid;
    position:absolute;
    left:0;
    top:0;
    z-index:1;
    background:
      linear-gradient(145deg,rgba(255,255,255,.05),transparent 42%),
      linear-gradient(155deg,var(--songket),var(--songket-deep));
  }
  .jur-cover{
    position:absolute;
    left:0;
    top:0;
    z-index:2;
    color:transparent;
    background:transparent;
  }

  @media (max-width:700px){
    .nf-row{grid-template-columns:1fr;gap:0}
    .nf-row>label{flex:none;min-height:0}
    .book-actions{flex-direction:row}
    .syn-hold,.book-btn{min-width:0}
  }

  @media (max-width:420px){
    .book-btn{padding:8px 4px;font-size:.62rem;letter-spacing:.02em}
  }

  @media (prefers-reduced-motion:reduce){
    *{animation:none!important}
  }


  /* Hash navigation lands below the sticky header instead of hiding headings. */
  .page[hidden]{display:none!important}
  .page{scroll-margin-top:79px}
  @media (max-width:520px){.page{scroll-margin-top:69px}}

  /* Mobile menu carries the secondary pages, so no floating button blocks forms. */
  .mobile-only-nav{display:none!important}
  @media (max-width:1240px){.mobile-only-nav{display:inline-flex!important}}
  @media (max-width:700px){.faq-fab{display:none!important}}

  /* Standard focusable skip-link pattern that stays out of visual captures. */
  .skip-link{
    top:14px;
    width:1px;
    height:1px;
    padding:0;
    overflow:hidden;
    clip-path:inset(50%);
    white-space:nowrap;
  }
  .skip-link:focus{
    width:auto;
    height:auto;
    padding:11px 16px;
    overflow:visible;
    clip-path:none;
  }

  /* Jurnal Mitra — horizontal sliding cards below the accreditation CTA. */
  .mitra{margin-top:64px;padding-top:44px;border-top:1px solid var(--line)}
  .mitra-head{max-width:640px;margin-bottom:26px}
  .mitra-head h2{font-family:"Fraunces";font-weight:500;font-size:clamp(1.5rem,2.6vw,2rem);color:var(--ink);margin:0 0 10px}
  .mitra-head p{font-family:"Archivo";font-size:.92rem;color:var(--muted);line-height:1.55;margin:0}
  .mitra-slider{position:relative}
  .mitra-track{
    display:flex;
    gap:18px;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    scroll-behavior:auto;
    padding:10px 6px 24px;
    margin:0 -6px;
    -ms-overflow-style:none;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
  }
  .mitra-track::-webkit-scrollbar{display:none}
  .mitra-card{
    flex:0 0 auto;
    width:272px;
    scroll-snap-align:start;
    scroll-snap-stop:normal;
    transform:translate3d(0,0,0);
    will-change:transform;
    transition:
      transform .48s cubic-bezier(.22,1,.36,1),
      box-shadow .48s cubic-bezier(.22,1,.36,1),
      border-color .38s ease,
      background-color .38s ease;
  }
  .mitra-card::after{transition:opacity .42s ease}
  .mitra-card .jur-cover{transition:transform .48s cubic-bezier(.22,1,.36,1)}
  .mitra-card .jur-go{transition:opacity .4s ease,gap .42s cubic-bezier(.22,1,.36,1)}
  .mitra-card:hover{
    transform:translate3d(0,-5px,0);
    box-shadow:0 24px 46px -28px rgba(78,12,23,.42);
  }
  .mitra-card:hover .jur-cover{transform:scale(1.025)}
  .mitra-card .jur-head{height:132px}
  .mitra-card h3{min-height:2.6em}
  .mitra-nav{
    position:absolute;
    top:44px;
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid rgba(185,141,62,.4);
    background:var(--parchment);
    color:var(--songket);
    display:grid;
    place-items:center;
    cursor:pointer;
    box-shadow:var(--shadow-sm);
    transition:background .32s ease,color .32s ease,transform .36s cubic-bezier(.22,1,.36,1),box-shadow .32s ease;
    z-index:3;
  }
  .mitra-nav:hover{background:var(--songket);color:var(--parchment);transform:translateY(-2px);box-shadow:0 14px 28px -18px rgba(78,12,23,.55)}
  .mitra-nav:active{transform:translateY(0) scale(.96)}
  .mitra-nav svg{width:18px;height:18px}
  .mitra-prev{left:-14px}
  .mitra-next{right:-14px}
  .mitra-platform{margin-top:10px;font-family:"Archivo";font-size:.82rem;color:var(--muted)}

  @media (max-width:820px){
    .mitra-nav{display:none}
    .mitra-track{margin:0 -20px;padding-left:20px;padding-right:20px}
  }
  @media (max-width:520px){
    .mitra-card{width:78vw}
  }

/* ======================================================================
   DISTRIBUTION MOTION & INTERACTION SYSTEM
   One consistent motion language for routing, reveals, cards, controls,
   navigation, dialogs, accordions, catalogue filtering, and sliders.
   ====================================================================== */
:root{
  --motion-fast:160ms;
  --motion-base:280ms;
  --motion-slow:480ms;
  --motion-reveal:680ms;
  --ease-standard:cubic-bezier(.2,.65,.25,1);
  --ease-smooth:cubic-bezier(.22,1,.36,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --focus-ring:0 0 0 4px rgba(185,141,62,.22);
}

html{
  scroll-padding-top:88px;
  scrollbar-color:rgba(110,18,32,.58) rgba(233,223,199,.72);
}
body{
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior-x:none;
}
:is(a,button,input,select,textarea){touch-action:manipulation}

/* Route changes: View Transitions where available, graceful enter fallback elsewhere. */
.js .page.active{animation:none;opacity:1;transform:none}
.js .page.active.route-enter{animation:routeEnter var(--motion-slow) var(--ease-smooth) both}
@keyframes routeEnter{
  from{opacity:.001;transform:translate3d(0,14px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes routeViewOut{
  from{opacity:1;transform:translate3d(0,0,0)}
  to{opacity:0;transform:translate3d(0,-7px,0)}
}
@keyframes routeViewIn{
  from{opacity:0;transform:translate3d(0,16px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@supports (view-transition-name:page-content){
  .page.active{view-transition-name:page-content}
  ::view-transition-old(root),
  ::view-transition-new(root){animation:none;mix-blend-mode:normal}
  ::view-transition-group(page-content){animation-duration:var(--motion-slow);animation-timing-function:var(--ease-smooth)}
  ::view-transition-old(page-content){animation:routeViewOut 180ms ease both;mix-blend-mode:normal}
  ::view-transition-new(page-content){animation:routeViewIn var(--motion-slow) var(--ease-smooth) both;mix-blend-mode:normal}
}

/* Scroll reveals are armed only after JS is ready, so content never stays hidden on failure. */
.reveal,.reveal.in{opacity:1;transform:none;transition:none}
html.motion-ready .reveal.is-pending{
  opacity:0;
  transform:translate3d(0,18px,0);
  transition:
    opacity var(--motion-reveal) var(--ease-standard),
    transform var(--motion-reveal) var(--ease-smooth);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform;
}
html.motion-ready .reveal.is-pending:is(.book,.svc,.jur,.why-item,.pkg-card,.legal-item){
  transform:translate3d(0,18px,0) scale(.992);
}
html.motion-ready .reveal.is-pending.in{opacity:1;transform:translate3d(0,0,0) scale(1)}
html.motion-ready .reveal.reveal-complete{will-change:auto}

/* Shared control motion. */
:is(.btn,.book-btn,.nav-cta,.wa-btn,.detail-back,.team-tab,.mitra-nav,.menu-btn,.nf-submit){
  transition:
    transform var(--motion-base) var(--ease-smooth),
    background-color var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    color var(--motion-fast) ease,
    box-shadow var(--motion-base) var(--ease-standard),
    opacity var(--motion-fast) ease;
}
:is(.btn,.book-btn,.nav-cta,.wa-btn,.detail-back,.team-tab,.mitra-nav,.menu-btn,.nf-submit):active:not(:disabled){
  transform:translate3d(0,1px,0) scale(.985);
  transition-duration:90ms;
}
:is(.btn,.book-btn,.nav-cta,.wa-btn,.detail-back,.mitra-nav):focus-visible{
  outline:2px solid var(--gold-soft);
  outline-offset:3px;
}
/* Route headings receive temporary programmatic focus for screen readers. */
.page :is(h1,h2)[tabindex="-1"]:focus{outline:none}

/* Header and desktop navigation. */
header.nav{
  transition:
    background-color 320ms ease,
    box-shadow 420ms var(--ease-standard),
    border-color 320ms ease;
}
nav.links a{
  transition:color var(--motion-fast) ease,opacity var(--motion-fast) ease,transform var(--motion-base) var(--ease-smooth);
}
nav.links a::after{transition:width 340ms var(--ease-smooth)}
.foot-links a{transition:color var(--motion-fast) ease,transform var(--motion-base) var(--ease-smooth)}
.foot-links a:hover{transform:translate3d(0,-1px,0)}

/* Morphing hamburger icon. */
.menu-icon{position:relative;display:block;width:22px;height:20px}
.menu-line{
  position:absolute;
  left:1px;
  width:20px;
  height:1.8px;
  border-radius:999px;
  background:currentColor;
  transform-origin:center;
  transition:
    top 360ms var(--ease-smooth),
    transform 360ms var(--ease-smooth),
    opacity 180ms ease,
    width 300ms var(--ease-smooth);
}
.menu-line:nth-child(1){top:4px}
.menu-line:nth-child(2){top:9px}
.menu-line:nth-child(3){top:14px}
.menu-btn[aria-expanded="true"] .menu-line:nth-child(1){top:9px;transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] .menu-line:nth-child(2){opacity:0;width:10px;transform:translateX(5px)}
.menu-btn[aria-expanded="true"] .menu-line:nth-child(3){top:9px;transform:rotate(-45deg)}
.menu-scrim{display:none}
html:not(.js) .menu-btn,html:not(.js) .menu-scrim{display:none!important}

@media (max-width:1240px){
  .js nav.links{
    display:flex!important;
    position:absolute;
    top:100%;left:0;right:0;
    z-index:2;
    flex-direction:column;
    gap:0;
    max-height:calc(100dvh - 78px);
    padding:8px 28px 18px!important;
    overflow-x:hidden;
    overflow-y:auto;
    background:rgba(248,242,229,.985);
    border-bottom:1px solid var(--line);
    box-shadow:0 24px 44px -28px rgba(42,29,21,.62);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translate3d(0,-12px,0);
    clip-path:inset(0 0 100% 0);
    transition:
      opacity 220ms ease,
      transform 420ms var(--ease-smooth),
      clip-path 420ms var(--ease-smooth),
      visibility 0s linear 420ms;
  }
  .js nav.links.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translate3d(0,0,0);
    clip-path:inset(0 0 0 0);
    transition-delay:0s;
  }
  .js nav.links a{
    opacity:0;
    transform:translate3d(0,-6px,0);
    transition:
      opacity 260ms ease,
      transform 380ms var(--ease-smooth),
      color var(--motion-fast) ease;
  }
  .js nav.links.open a{
    opacity:1;
    transform:translate3d(0,0,0);
    transition-delay:calc(70ms + (var(--nav-order,0) * 34ms));
  }
  .menu-scrim{
    display:block;
    position:fixed;
    z-index:49;
    inset:78px 0 0;
    width:100%;height:auto;
    padding:0;
    border:0;
    background:rgba(30,18,14,.34);
    backdrop-filter:blur(2px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity 280ms ease,visibility 0s linear 280ms;
  }
  body.menu-open .menu-scrim{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition-delay:0s;
  }

  html:not(.js) header.nav{position:static}
  html:not(.js) .nav-inner{height:auto;min-height:68px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
  html:not(.js) nav.links{order:4;width:100%}
  html:not(.js) nav.links{
    display:flex!important;
    position:static;
    max-height:none;
    visibility:visible;
    opacity:1;
    transform:none;
    clip-path:none;
    padding:10px 20px 18px;
    box-shadow:none;
  }
}
@media (max-width:520px){
  .js nav.links{max-height:calc(100dvh - 68px);padding-left:20px!important;padding-right:20px!important}
  .menu-scrim{top:68px}
}

/* Cards, media, and surfaces use the same eased lift instead of abrupt jumps. */
:is(.svc,.jur,.book,.why-item,.pkg-card,.legal-item,.person,.contact-list li,.jphoto,.calc-svc,.kbli-item){
  transition:
    transform 440ms var(--ease-smooth),
    box-shadow 440ms var(--ease-standard),
    border-color var(--motion-base) ease,
    background-color var(--motion-base) ease;
}
.cover-img{transition:box-shadow 460ms var(--ease-standard),transform 460ms var(--ease-smooth)}
.cover-img img{transition:transform 700ms var(--ease-smooth),opacity 320ms ease}
.jphoto img{transition:transform 760ms var(--ease-smooth)}
.jur-cover{transition:opacity 360ms ease,transform 560ms var(--ease-smooth)}
.jur-go{transition:opacity 320ms ease,gap 420ms var(--ease-smooth),color 220ms ease}
.svc::before,.jur::after{transition:opacity 380ms ease}
.svc-ic{transition:background-color 320ms ease,color 320ms ease,transform 420ms var(--ease-smooth)}

@media (hover:hover) and (pointer:fine){
  .book:hover,.book:focus-within{transform:translate3d(0,-7px,0)}
  .book:hover .cover-img,.book:focus-within .cover-img{box-shadow:0 30px 58px -27px rgba(0,0,0,.82)}
  .book:hover .cover-img img,.book:focus-within .cover-img img{transform:scale(1.035)}
  .svc:hover,.jur:hover,.pkg-card:hover,.why-item:hover,.legal-item:hover,.person:hover{transform:translate3d(0,-6px,0)}
  .contact-list li:hover{transform:translate3d(0,-3px,0)}
  .kbli-item:hover{transform:translate3d(5px,0,0)}
  .jphoto:hover img{transform:scale(1.055)}
  .svc:hover .svc-ic{transform:translate3d(0,-2px,0) rotate(-2deg)}
  .hs-item{transition:transform 520ms var(--ease-smooth),box-shadow 520ms var(--ease-standard),border-color 260ms ease}
  .hs-item img{transition:transform 680ms var(--ease-smooth)}
  .hs-item:hover{transform:translate3d(0,-8px,0) rotate(-.35deg)}
  .hs-item:hover img{transform:scale(1.025)}
}

/* Forms and search fields. */
:is(.book-search input,.naskah-form input,.naskah-form select,.naskah-form textarea,.calc-field input){
  transition:
    border-color 220ms ease,
    background-color 220ms ease,
    box-shadow 300ms var(--ease-standard),
    transform 300ms var(--ease-smooth);
}
:is(.book-search input,.naskah-form input,.naskah-form select,.naskah-form textarea,.calc-field input):focus{
  box-shadow:var(--focus-ring);
  transform:translate3d(0,-1px,0);
}
.calc-svc.is-selected{
  border-color:var(--gold);
  background:#FBF4E5;
  box-shadow:0 14px 28px -24px rgba(78,12,23,.68);
}
.calc-total{transform-origin:left center}

/* Synopsis dialog: animate both opening and closing. */
.syn-modal{isolation:isolate}
.syn-backdrop{
  opacity:0;
  transition:opacity 280ms ease;
}
.syn-box{
  animation:none!important;
  opacity:0;
  transform:translate3d(0,18px,0) scale(.982);
  transition:
    opacity 250ms ease,
    transform 440ms var(--ease-smooth);
  overscroll-behavior:contain;
  will-change:opacity,transform;
}
.syn-modal.is-open .syn-backdrop{opacity:1}
.syn-modal.is-open .syn-box{opacity:1;transform:translate3d(0,0,0) scale(1)}
.syn-modal.is-closing .syn-backdrop{opacity:0}
.syn-modal.is-closing .syn-box{opacity:0;transform:translate3d(0,10px,0) scale(.99)}
.syn-close{transition:background-color 180ms ease,color 180ms ease,transform 280ms var(--ease-smooth)}
.syn-close:hover{transform:rotate(4deg)}

/* FAQ uses intrinsic grid-row animation; no measured max-height or resize jank. */
.faq-a{max-height:none!important}
html:not(.js) .faq-a{display:block;overflow:visible}
.js .faq-a{
  display:grid;
  grid-template-rows:0fr;
  overflow:hidden;
  transition:grid-template-rows 460ms var(--ease-smooth);
}
.js .faq-a-inner{
  min-height:0;
  overflow:hidden;
  opacity:0;
  transform:translate3d(0,-7px,0);
  transition:opacity 220ms ease,transform 420ms var(--ease-smooth);
}
.js .faq-item.open .faq-a{grid-template-rows:1fr}
.js .faq-item.open .faq-a-inner{
  opacity:1;
  transform:translate3d(0,0,0);
  transition-delay:70ms;
}
.faq-q{transition:color 220ms ease,background-color 220ms ease}
.faq-ic{transition:transform 460ms var(--ease-smooth),background-color 260ms ease,color 260ms ease}

/* Team-panel switch. */
.team-panel.panel-enter{animation:panelEnter 480ms var(--ease-smooth) both}
@keyframes panelEnter{
  from{opacity:0;transform:translate3d(0,12px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

/* Journal thumbnail fallback fades local/remote covers over the monogram. */
.jur-cover.image-pending{opacity:0;transform:scale(.97)}
.jur-cover.image-ready{opacity:1;transform:scale(1)}
.jur-cover[hidden]{display:none!important}

/* Jurnal Mitra slider: smooth controls, progress, edge cues, and drag feedback. */
.mitra-track{
  scroll-padding-inline:6px;
  cursor:grab;
  outline:none;
}
.mitra-track:focus-visible{box-shadow:0 0 0 3px rgba(185,141,62,.25);border-radius:12px}
.mitra-track.is-dragging{cursor:grabbing;scroll-snap-type:none!important;user-select:none}
.mitra-track.is-animating{scroll-snap-type:none!important}
.mitra-card{will-change:auto}
.mitra-track.is-animating .mitra-card,.mitra-track.is-dragging .mitra-card{pointer-events:none}
.mitra-nav:disabled{
  opacity:.28;
  cursor:not-allowed;
  box-shadow:none;
  transform:none!important;
}
.mitra-slider::before,.mitra-slider::after{
  content:"";
  position:absolute;
  z-index:2;
  top:6px;
  bottom:48px;
  width:34px;
  pointer-events:none;
  opacity:0;
  transition:opacity 260ms ease;
}
.mitra-slider::before{left:0;background:linear-gradient(90deg,var(--parchment),transparent)}
.mitra-slider::after{right:0;background:linear-gradient(-90deg,var(--parchment),transparent)}
.mitra-slider.can-scroll-left::before,.mitra-slider.can-scroll-right::after{opacity:.9}
.mitra-status{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:-4px;
  padding:0 4px;
}
.mitra-progress{
  position:relative;
  flex:1;
  height:3px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(185,141,62,.18);
}
.mitra-progress span{
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--songket),var(--gold));
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 160ms linear;
}
.mitra-counter{
  flex:none;
  min-width:92px;
  text-align:right;
  font-family:"Archivo",sans-serif;
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.06em;
  color:var(--muted);
}

/* Floating FAQ shortcut and status changes. */
.faq-fab{transition:transform 360ms var(--ease-smooth),opacity 240ms ease,visibility 0s linear 240ms,box-shadow 320ms ease}
.faq-fab.is-hidden{transition-delay:0s,0s,240ms,0s}

/* Very narrow phones get a readable one-column catalogue. */
@media (max-width:350px){
  .book-row{grid-template-columns:1fr}
  .book-meta .bt,.book-meta .ba{min-height:0}
  .book-actions{flex-direction:row}
}
@media (max-width:820px){
  .mitra-slider::before,.mitra-slider::after{display:none}
  .mitra-status{padding:0 20px;margin-left:-20px;margin-right:-20px}
}

/* Motion preferences are respected comprehensively. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  .page.route-enter,.team-panel.panel-enter{animation:none!important}
  .reveal,.reveal.is-pending,.reveal.in{opacity:1!important;transform:none!important;transition:none!important}
  .syn-backdrop,.syn-box,.faq-a,.faq-a-inner,.menu-line,.mitra-progress span{transition:none!important}
  ::view-transition-old(root),::view-transition-new(root),
  ::view-transition-old(page-content),::view-transition-new(page-content){animation-duration:1ms!important}
}


/* ======================================================================
   JOURNAL COVER FALLBACK FIX
   Keeps acronym placeholders fully inside the cover area and hides them
   as soon as a real cover is ready.
   ====================================================================== */
.jur-head{
  --journal-cover-width:92px;
  --journal-cover-height:124px;
  position:relative;
  isolation:isolate;
}
.jur-head .jur-cover,
.jur-head .abbr{
  width:var(--journal-cover-width);
  height:var(--journal-cover-height);
  max-width:var(--journal-cover-width);
  max-height:var(--journal-cover-height);
  box-sizing:border-box;
  border-radius:6px;
}
.jur-head .abbr{
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:10px 7px;
  text-align:center;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  hyphens:none;
  font-family:"Archivo",sans-serif;
  font-size:var(--journal-abbr-size,1.05rem);
  font-weight:700;
  line-height:1.1;
  letter-spacing:.025em;
  text-transform:uppercase;
  text-wrap:balance;
  pointer-events:none;
  opacity:1;
  visibility:visible;
  transform:scale(1);
  transition:
    opacity 240ms ease,
    transform 420ms var(--ease-smooth),
    visibility 0s linear 0s;
}
.jur-head .abbr.abbr-medium{--journal-abbr-size:.88rem}
.jur-head .abbr.abbr-long{--journal-abbr-size:.72rem}
.jur-head .jur-cover{
  display:block;
  overflow:hidden;
  object-fit:cover;
  object-position:center;
}
.jur-head.cover-ready .abbr{
  opacity:0;
  visibility:hidden;
  transform:scale(.97);
  transition-delay:0s,0s,240ms;
}
.jur-head.cover-pending .abbr,
.jur-head.cover-failed .abbr,
.jur-head.cover-fallback .abbr{
  opacity:1;
  visibility:visible;
  transform:scale(1);
  transition-delay:0s;
}
.jur-head.cover-ready .jur-cover{opacity:1}
.jur-head.cover-pending .jur-cover{opacity:0}
.jur-head.cover-failed .jur-cover{display:none!important}
.mitra-card .jur-head{height:calc(var(--journal-cover-height) + 8px)}

@media (max-width:460px){
  .jur-head{
    --journal-cover-width:76px;
    --journal-cover-height:104px;
  }
  .jur-head .abbr{padding:8px 6px;--journal-abbr-size:.92rem}
  .jur-head .abbr.abbr-medium{--journal-abbr-size:.76rem}
  .jur-head .abbr.abbr-long{--journal-abbr-size:.64rem}
}

@media (prefers-reduced-motion:reduce){
  .jur-head .abbr{transition:none!important}
}