/* PPID Kemenag Paser — Portal PPID theme, experimental v0.5.0 */
:root{
  --green:#14604f;
  --deep:#082f2b;
  --lime:#e1b64e;
  --cream:#f5f0e5;
  --ink:#17372f;
  --muted:#637970;
  --line:#d8d0bd;
  --white:#fffdf8;
  --hijau:#0d493f;
  --gold:#e1b64e;
  --clay:#b96d4b;
  --mist:#e9eee5;
}

/* v0.5.0 — feed berita resmi Paser (Humas) */
.news-filter-note{
  max-width:720px;
  margin:12px 0 0;
  color:var(--muted);
  font-size:.86rem;
}
.news-filter-note strong{color:var(--deep);font-family:"Poppins",sans-serif}
.news-image,.mini-image{background-color:#dfe9e3;isolation:isolate}
.news-thumb{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  filter:saturate(.88) contrast(1.04);
  transition:transform .45s ease,filter .3s ease;
}
.news-featured:hover .news-thumb,.news-list article:hover .news-thumb{transform:scale(1.035);filter:saturate(1) contrast(1.04)}
.news-thumb.is-unavailable{display:none}
.news-image::after,.mini-image::after{z-index:1;pointer-events:none}
.news-image .tag{z-index:2}
.news-excerpt{
  display:-webkit-box;
  margin:-3px 0 14px;
  overflow:hidden;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.55;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}
.news-list .news-excerpt{font-size:.76rem;-webkit-line-clamp:2}
.news-grid{grid-template-columns:1fr;gap:18px;align-items:stretch}
.news-featured{
  display:grid;
  min-width:0;
  min-height:350px;
  grid-template-columns:minmax(0,1.35fr) minmax(310px,.65fr);
}
.news-featured .news-image{height:auto;min-height:350px}
.news-featured .news-content{display:flex;flex:1;flex-direction:column}
.news-featured .news-content>a{margin-top:auto;align-self:flex-start}
.news-list{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.news-list article{
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:150px minmax(0,1fr);
  align-items:start;
  gap:13px;
  min-width:0;
  padding:14px;
  border-bottom:1px solid var(--line);
}
.news-list .mini-image{height:150px}
.news-list article>div:last-child{display:flex;min-width:0;height:100%;flex-direction:column}
.news-list h3{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.news-list article a{margin-top:auto;align-self:flex-start}
.image-four{background:linear-gradient(135deg,#d7b792,#8b685a)}
.image-five{background:linear-gradient(135deg,#92b5a1,#315e50)}
@media(min-width:901px){
  .news-list article{min-height:350px}
}
.news-source{
  margin:18px 0 0;
  color:var(--muted);
  font-size:.72rem;
  text-align:right;
}
[data-news-feed][data-state="fallback"]{outline:1px dashed rgba(139,87,48,.25);outline-offset:8px}
html.dark-mode .news-filter-note strong{color:#efc85f}
html.dark-mode .news-image,html.dark-mode .mini-image{background-color:#173b33}
html.dark-mode .news-excerpt,html.dark-mode .news-source,html.dark-mode .news-filter-note{color:#c4d0cc!important}
html.black-white .news-thumb{filter:grayscale(1) contrast(1.1)!important}
@media(max-width:900px){
  .news-grid{grid-template-columns:1fr;gap:24px}
  .news-featured{grid-template-columns:1fr;min-height:0}
  .news-featured .news-image{height:285px;min-height:285px}
  .news-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .news-list article{grid-template-columns:1fr;grid-template-rows:185px minmax(0,1fr);align-content:start;gap:14px;padding:16px}
  .news-list .mini-image{height:185px}
  .news-excerpt{-webkit-line-clamp:2}
}
@media(max-width:650px){
  .news-filter-note{margin-top:8px}
  .news-featured .news-image{height:220px;min-height:220px}
  .news-list{display:grid;grid-template-columns:1fr;gap:16px}
  .news-list article{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);align-items:start;gap:13px;padding:14px}
  .news-list article:nth-child(n+3){display:none}
  .news-list .mini-image{height:auto;aspect-ratio:16/9}
  .news-list .news-excerpt{-webkit-line-clamp:2}
  .news-source{text-align:left}
}
@media(prefers-reduced-motion:reduce){.news-thumb{transition:none}.news-featured:hover .news-thumb,.news-list article:hover .news-thumb{transform:none}}

/* Layanan dropdown and Survey Pelayanan highlight. */
.nav-dropdown{
  position:relative;
  display:grid;
  align-self:stretch;
  grid-template-columns:auto 16px;
  align-items:center;
}
.nav-dropdown-link{padding:27px 0}
.nav-dropdown-toggle{
  display:grid;
  width:18px;
  height:34px;
  padding:0;
  place-items:center;
  border:0;
  background:transparent;
  color:var(--deep);
  cursor:pointer;
}
.nav-dropdown-chevron{
  display:block;
  width:12px;
  height:12px;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .22s ease;
}
.nav-dropdown.is-open .nav-dropdown-chevron{transform:rotate(180deg)}
.nav-dropdown-menu{
  position:absolute;
  z-index:35;
  top:calc(100% - 5px);
  left:50%;
  width:250px;
  padding:9px;
  border:1px solid #d8d0bd;
  border-radius:10px;
  background:rgba(255,253,248,.98);
  box-shadow:0 18px 38px rgba(8,47,43,.18);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,10px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.is-open .nav-dropdown-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%,0);
}
.nav-dropdown-menu>a{
  display:block;
  padding:10px 12px;
  border-radius:7px;
  color:var(--deep);
  font-size:.78rem;
  line-height:1.35;
  white-space:normal;
}
.nav-dropdown-menu>a:hover,.nav-dropdown-menu>a:focus-visible{background:#f0eadc}
.survey-nav-link{
  position:relative;
  display:flex!important;
  gap:8px;
  align-items:center;
  color:#a44f38!important;
  font-weight:800;
  text-align:left;
  animation:survey-text-glow 2.4s ease-in-out infinite;
}
.survey-nav-link .survey-symbol{
  position:static;
  width:27px;
  height:23px;
  flex:0 0 27px;
  transform:none;
  animation:survey-symbol-glow 2.4s ease-in-out infinite;
}
.survey-symbol{
  --survey-bubble:#f1ca67;
  --survey-hand:#0b5c4a;
  --survey-outline:var(--clay);
  --survey-dot:#fffdf8;
  --survey-detail:#f5d77e;
  display:block;
  overflow:visible;
}
.survey-symbol-bubble{fill:var(--survey-bubble)}
.survey-symbol-outline{fill:none;stroke:var(--survey-outline);stroke-width:3;stroke-linejoin:round}
.survey-symbol-dot{fill:var(--survey-dot)}
.survey-symbol-hand{fill:var(--survey-hand)}
.survey-symbol-detail{fill:none;stroke:var(--survey-detail);stroke-width:3;stroke-linecap:round}
.survey-service-cta{
  --survey-motion-line:rgba(185,109,75,.3);
  --survey-motion-fill:rgba(185,109,75,.075);
  --survey-motion-star:rgba(217,170,57,.52);
  --survey-visual-bg:rgba(255,253,248,.62);
  --survey-bar-green:#168064;
  --survey-bar-clay:#c97454;
  position:relative;
  display:grid;
  grid-template-columns:64px minmax(0,1fr) minmax(220px,310px);
  gap:16px;
  align-items:center;
  margin-top:16px;
  padding:17px 22px;
  overflow:hidden;
  border:1px solid rgba(185,109,75,.35);
  border-radius:9px;
  background:linear-gradient(110deg,rgba(225,182,78,.13),rgba(22,128,100,.07),rgba(185,109,75,.11),rgba(225,182,78,.13));
  background-size:220% 100%;
  box-shadow:0 10px 26px rgba(29,66,55,.07);
  color:var(--deep);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
  animation:survey-feedback-wash 7s ease-in-out infinite;
}
.survey-service-cta>*{position:relative;z-index:2}
.survey-service-cta::before,
.survey-service-cta::after{
  position:absolute;
  z-index:0;
  pointer-events:none;
}
.survey-service-cta::before{
  content:"";
  top:13px;
  right:40%;
  width:190px;
  height:70px;
  border:2px solid var(--survey-motion-line);
  border-radius:34px;
  background:
    radial-gradient(circle at 24% 50%,var(--survey-motion-line) 0 4px,transparent 5px),
    radial-gradient(circle at 50% 50%,var(--survey-motion-line) 0 4px,transparent 5px),
    radial-gradient(circle at 76% 50%,var(--survey-motion-line) 0 4px,transparent 5px),
    var(--survey-motion-fill);
  clip-path:polygon(0 0,100% 0,100% 78%,66% 78%,57% 100%,55% 78%,0 78%);
  animation:survey-feedback-bubble 5.2s ease-in-out infinite;
}
.survey-service-cta::after{
  content:"";
  top:50%;
  right:5%;
  width:170px;
  height:170px;
  border:1px solid var(--survey-motion-line);
  border-radius:50%;
  box-shadow:0 0 0 24px var(--survey-motion-fill),0 0 0 48px rgba(225,182,78,.04);
  transform:translateY(-50%);
  animation:survey-feedback-orbit 7.5s ease-in-out infinite;
}
.survey-service-cta:hover{transform:translateY(-3px);border-color:rgba(185,109,75,.65);box-shadow:0 15px 32px rgba(29,66,55,.12)}
.survey-service-cta .survey-symbol{
  width:64px;
  height:54px;
  filter:drop-shadow(0 0 5px rgba(225,182,78,.45));
  animation:survey-symbol-glow 2.4s ease-in-out infinite,survey-feedback-icon 5.2s ease-in-out infinite;
}
.survey-cta-copy{display:grid;gap:2px;min-width:0}
.survey-cta-copy small{color:var(--muted);font-size:.73rem}
.survey-cta-copy strong{
  color:var(--clay);
  font:800 1.12rem/1.25 "Poppins",sans-serif;
  animation:survey-text-glow 2.4s ease-in-out infinite;
}
.survey-feedback-visual{
  justify-self:stretch;
  display:grid;
  grid-template-columns:auto minmax(76px,1fr);
  gap:14px;
  align-items:center;
  min-height:58px;
  padding:9px 16px;
  border:1px solid var(--survey-motion-line);
  border-radius:29px;
  background:var(--survey-visual-bg);
  box-shadow:0 8px 18px rgba(29,66,55,.07),inset 0 0 20px var(--survey-motion-fill);
  backdrop-filter:blur(5px);
}
.survey-feedback-stars{display:flex;gap:5px;align-items:center}
.survey-feedback-stars i{
  color:var(--survey-motion-star);
  font:900 1.08rem/1 "Poppins",sans-serif;
  font-style:normal;
  text-shadow:0 0 8px currentColor;
  transform-origin:center;
  animation:survey-feedback-star-pop 3.6s ease-in-out infinite;
}
.survey-feedback-stars i:nth-child(2){animation-delay:.18s}
.survey-feedback-stars i:nth-child(3){animation-delay:.36s}
.survey-feedback-stars i:nth-child(4){animation-delay:.54s}
.survey-feedback-stars i:nth-child(5){animation-delay:.72s}
.survey-feedback-bars{
  display:grid;
  grid-template-columns:repeat(5,minmax(5px,1fr));
  gap:5px;
  align-items:end;
  height:30px;
  padding:3px 0;
}
.survey-feedback-bars i{
  height:100%;
  border-radius:6px 6px 2px 2px;
  background:linear-gradient(180deg,var(--survey-motion-star),var(--survey-bar-clay));
  transform-origin:bottom;
  animation:survey-feedback-bar 3.6s ease-in-out infinite;
}
.survey-feedback-bars i:nth-child(1){height:38%}
.survey-feedback-bars i:nth-child(2){height:57%;animation-delay:.15s;background:linear-gradient(180deg,var(--survey-motion-star),var(--survey-bar-green))}
.survey-feedback-bars i:nth-child(3){height:74%;animation-delay:.3s}
.survey-feedback-bars i:nth-child(4){height:91%;animation-delay:.45s;background:linear-gradient(180deg,var(--survey-motion-star),var(--survey-bar-green))}
.survey-feedback-bars i:nth-child(5){height:100%;animation-delay:.6s}
.survey-footer-link{display:inline-flex!important;gap:6px;align-items:center;color:var(--clay)!important;font-weight:800;animation:survey-text-glow 2.4s ease-in-out infinite}
.survey-footer-link .survey-symbol{width:23px;height:19px;flex:0 0 23px;animation:survey-symbol-glow 2.4s ease-in-out infinite}
@keyframes survey-text-glow{
  0%,100%{text-shadow:0 0 0 rgba(185,109,75,0)}
  50%{text-shadow:0 0 8px rgba(185,109,75,.38)}
}
@keyframes survey-symbol-glow{
  0%,100%{filter:drop-shadow(0 0 2px rgba(225,182,78,.25))}
  50%{filter:drop-shadow(0 0 9px rgba(225,182,78,.82))}
}
@keyframes survey-feedback-wash{
  0%,100%{background-position:0 50%}
  50%{background-position:100% 50%}
}
@keyframes survey-feedback-bubble{
  0%,100%{opacity:.2;transform:translate3d(14px,5px,0) scale(.94)}
  35%,72%{opacity:.78;transform:translate3d(-6px,-3px,0) scale(1)}
}
@keyframes survey-feedback-orbit{
  0%,100%{opacity:.18;transform:translate3d(12px,-50%,0) scale(.9)}
  50%{opacity:.58;transform:translate3d(-10px,-50%,0) scale(1.04)}
}
@keyframes survey-feedback-star-pop{
  0%,18%,100%{opacity:.3;transform:translateY(2px) scale(.78)}
  38%,68%{opacity:1;transform:translateY(-2px) scale(1.14)}
}
@keyframes survey-feedback-bar{
  0%,100%{opacity:.42;transform:scaleY(.36)}
  42%,72%{opacity:1;transform:scaleY(1)}
}
@keyframes survey-feedback-icon{
  0%,100%{transform:translate3d(0,2px,0) rotate(-2deg)}
  38%,70%{transform:translate3d(0,-3px,0) rotate(2deg)}
}
html.dark-mode .nav-dropdown-toggle{color:#f5f1e8}
html.dark-mode .nav-dropdown-menu{border-color:#315048;background:rgba(13,41,37,.98);box-shadow:0 18px 38px rgba(0,0,0,.3)}
html.dark-mode .nav-dropdown-menu>a{color:#f5f1e8}
html.dark-mode .nav-dropdown-menu>a:hover,html.dark-mode .nav-dropdown-menu>a:focus-visible{background:#173c35}
html.dark-mode .survey-nav-link,html.dark-mode .survey-footer-link{color:#efc85f!important}
html.dark-mode .survey-symbol{--survey-bubble:#79c3b0;--survey-hand:#e3bd61;--survey-outline:#f1ca67;--survey-dot:#071c19;--survey-detail:#173c35}
html.dark-mode .survey-service-cta{--survey-motion-line:rgba(121,195,176,.35);--survey-motion-fill:rgba(121,195,176,.08);--survey-motion-star:rgba(241,202,103,.72);--survey-visual-bg:rgba(8,47,43,.62);--survey-bar-green:#79c3b0;--survey-bar-clay:#d98b6f;border-color:rgba(225,182,78,.32);background:linear-gradient(110deg,rgba(225,182,78,.1),rgba(121,195,176,.08),rgba(185,109,75,.13),rgba(225,182,78,.1));background-size:220% 100%;color:#f5f1e8}
html.dark-mode .survey-cta-copy small{color:#c4d0cc}
html.dark-mode .survey-cta-copy strong{color:#efc85f}
html.black-white .survey-nav-link,
html.black-white .survey-footer-link,
html.black-white .survey-cta-copy strong{color:#242424!important;text-shadow:0 0 6px rgba(60,60,60,.32)!important}
html.black-white .survey-symbol{--survey-bubble:#555;--survey-hand:#202020;--survey-outline:#999;--survey-dot:#fff;--survey-detail:#e0e0e0}
html.black-white .survey-service-cta{--survey-motion-line:rgba(45,45,45,.34);--survey-motion-fill:rgba(80,80,80,.07);--survey-motion-star:rgba(55,55,55,.58);--survey-visual-bg:rgba(255,255,255,.62);--survey-bar-green:#555;--survey-bar-clay:#222}
html.dark-mode.black-white .survey-nav-link,
html.dark-mode.black-white .survey-footer-link,
html.dark-mode.black-white .survey-cta-copy strong{color:#f0f0f0!important;text-shadow:0 0 7px rgba(255,255,255,.32)!important}
html.dark-mode.black-white .survey-symbol{--survey-bubble:#d2d2d2;--survey-hand:#f1f1f1;--survey-outline:#909090;--survey-dot:#181818;--survey-detail:#555}
html.dark-mode.black-white .survey-service-cta{--survey-motion-line:rgba(220,220,220,.36);--survey-motion-fill:rgba(220,220,220,.07);--survey-motion-star:rgba(225,225,225,.65);--survey-visual-bg:rgba(20,20,20,.62);--survey-bar-green:#d0d0d0;--survey-bar-clay:#888}
@media(max-width:1100px){
  .nav-dropdown{
    width:100%;
    min-height:42px;
    grid-template-columns:minmax(0,1fr) 42px;
    align-self:auto;
    border:1px solid transparent;
    border-radius:4px;
    transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
  }
  .nav-dropdown-link{
    display:flex;
    min-width:0;
    min-height:40px;
    align-items:center;
    padding:9px 12px!important;
    border:0!important;
    background:transparent!important;
  }
  .nav-dropdown-toggle{
    justify-self:end;
    width:36px;
    height:36px;
    margin-right:3px;
    border:1px solid var(--line);
    border-radius:7px;
    transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
  }
  .nav-dropdown:hover,
  .nav-dropdown:focus-within{
    border-color:rgba(8,47,43,.16);
    background:#f4ecdb;
    transform:translateX(3px);
  }
  .nav-dropdown.is-active{
    border-color:rgba(8,47,43,.18);
    background:#eee2c6;
    box-shadow:inset 3px 0 var(--gold);
  }
  .nav-dropdown.is-open{transform:none}
  .nav-dropdown-toggle:hover,
  .nav-dropdown-toggle:focus-visible{
    border-color:rgba(8,47,43,.3);
    background:rgba(255,253,248,.72);
    box-shadow:0 4px 12px rgba(8,47,43,.12);
    transform:translateY(-1px);
  }
  .nav-dropdown-menu{
    position:static;
    display:none;
    grid-column:1/-1;
    width:100%;
    margin:2px 0 8px;
    padding:7px;
    border-radius:8px;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
    box-shadow:none;
  }
  .nav-dropdown:hover .nav-dropdown-menu{transform:none}
  .nav-dropdown.is-open .nav-dropdown-menu{display:grid;transform:none}
  .nav-dropdown-link::after{display:none!important}
  html.dark-mode .nav-dropdown:hover,
  html.dark-mode .nav-dropdown:focus-within{
    border-color:rgba(220,184,94,.3);
    background:#12332d;
  }
  html.dark-mode .nav-dropdown.is-active{
    border-color:rgba(220,184,94,.38);
    background:#173b33;
  }
  html.dark-mode .nav-dropdown-toggle:hover,
  html.dark-mode .nav-dropdown-toggle:focus-visible{
    border-color:rgba(220,184,94,.42);
    background:rgba(220,184,94,.1);
    box-shadow:0 4px 12px rgba(0,0,0,.22);
  }
}
@media(min-width:651px) and (max-width:1100px){
  .nav-dropdown-menu{
    position:absolute;
    z-index:45;
    top:calc(100% + 4px);
    left:0;
    margin:0;
    box-shadow:0 14px 30px rgba(8,47,43,.17);
  }
  html.dark-mode .nav-dropdown-menu{box-shadow:0 16px 32px rgba(0,0,0,.3)}
  .survey-service-cta::before{right:auto;left:100px}
}
@media(max-width:650px){
  .nav-dropdown-link{min-height:37px;padding:7px 10px!important}
  .survey-service-cta{grid-template-columns:48px minmax(0,1fr);gap:12px;padding:15px 16px}
  .survey-service-cta .survey-symbol{width:48px;height:40px}
  .survey-feedback-visual{grid-column:1/-1;width:100%;min-height:44px;margin-top:2px;padding:7px 13px;border-radius:22px}
  .survey-feedback-stars{gap:8px;justify-content:center}
  .survey-feedback-stars i{font-size:.92rem}
  .survey-feedback-bars{height:24px}
  .survey-service-cta::before{top:8px;right:24px;width:100px;height:43px}
  .survey-service-cta::after{right:-36px;width:125px;height:125px}
}
@media(prefers-reduced-motion:reduce){
  .survey-nav-link,.survey-nav-link .survey-symbol,.survey-service-cta,.survey-service-cta::before,.survey-service-cta::after,.survey-service-cta .survey-symbol,.survey-cta-copy strong,.survey-feedback-stars i,.survey-feedback-bars i,.survey-footer-link,.survey-footer-link .survey-symbol{animation:none!important}
}
html{background:var(--cream)}
body{
  background:
    radial-gradient(circle at 10% 18%,rgba(225,182,78,.11),transparent 23rem),
    linear-gradient(90deg,rgba(8,47,43,.025) 1px,transparent 1px),
    linear-gradient(rgba(8,47,43,.025) 1px,transparent 1px),
    var(--white);
  background-size:auto,40px 40px,40px 40px,auto;
}
.topbar{
  position:relative;
  overflow:hidden;
  background:linear-gradient(90deg,#061f1d,#0d493f);
  border-bottom:1px solid rgba(225,182,78,.35);
  letter-spacing:.025em;
}
.topbar::after{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(125deg,transparent 0 25px,rgba(225,182,78,.055) 25px 26px);
  pointer-events:none;
}
.topbar-inner{position:relative;z-index:1}
.site-header{
  height:82px;
  background:rgba(255,253,248,.93);
  border-bottom:1px solid rgba(8,47,43,.13);
  box-shadow:0 10px 32px rgba(8,47,43,.07);
  backdrop-filter:blur(14px);
}
.brand{gap:13px}
.brand-mark{
  width:48px;
  height:48px;
  flex-basis:48px;
  padding:2px;
  border:1px solid rgba(225,182,78,.65);
  border-radius:50%;
  background-color:#fff;
}
.brand strong{color:var(--deep);letter-spacing:-.025em}
.brand small{color:#796b4e;letter-spacing:.04em}
.main-nav>a:not(.nav-cta){position:relative}
.main-nav>a:not(.nav-cta)::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:20px;
  height:2px;
  background:var(--gold);
  transition:right .25s ease;
}
.main-nav>a:not(.nav-cta):hover::after,.main-nav>a.active::after{right:0}
.main-nav .active{color:var(--deep)}
.nav-cta{
  color:#132f28;
  background:var(--gold);
  border-radius:5px;
  box-shadow:5px 5px 0 rgba(8,47,43,.12);
}
.site-search{
  border-color:#d8d0bd!important;
  border-radius:5px!important;
  background:#fffdf8!important;
}
.hero{
  min-height:600px;
  color:#fff;
  background:
    radial-gradient(circle at 83% 25%,rgba(225,182,78,.26) 0 1px,transparent 2px 100%),
    linear-gradient(115deg,#061f1d 0%,#0b3d35 55%,#14604f 100%);
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.35;
  background:
    repeating-linear-gradient(135deg,transparent 0 48px,rgba(255,255,255,.055) 48px 49px),
    repeating-linear-gradient(45deg,transparent 0 48px,rgba(225,182,78,.07) 48px 49px);
}
.hero-grid{min-height:565px}
.hero-copy{position:relative}
.hero-copy::before{
  content:"Portal PPID · LAYANAN TERBUKA";
  display:block;
  width:max-content;
  margin-bottom:18px;
  padding:5px 9px;
  border-left:3px solid var(--gold);
  color:#f7d77f;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.16em;
}
.hero .eyebrow{color:#d8e8de}
.hero .eyebrow span{background:var(--gold)}
.hero h1{color:#fff;max-width:760px}
.hero h1 em{color:#f1ca67}
.hero-text{color:#d3e2db}
.hero-note{color:#bdd1c7}
.hero .check{color:#f1ca67}
.button{border-radius:5px}
.button.primary{
  color:#132f28;
  background:var(--gold);
  box-shadow:6px 6px 0 rgba(0,0,0,.2);
}
.button.ghost{color:#fff;border-color:rgba(255,255,255,.38);background:rgba(255,255,255,.07)}
.hero-panel{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(225,182,78,.43);
  border-radius:4px;
  background:rgba(5,35,31,.78);
  box-shadow:18px 18px 0 rgba(225,182,78,.18);
  backdrop-filter:blur(7px);
}
.hero-panel::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-90px;
  top:-90px;
  border:1px solid rgba(225,182,78,.35);
  transform:rotate(45deg);
}
.panel-icon,.panel-link{color:#f1ca67}
.panel-card{border-radius:3px;border-color:rgba(225,182,78,.25);background:rgba(255,255,255,.06)}
.hero-wave{height:52px;background:var(--white);clip-path:polygon(0 72%,20% 40%,38% 68%,58% 24%,79% 60%,100% 36%,100% 100%,0 100%)}
.section{position:relative}
.section-heading .eyebrow,.about-copy .eyebrow,.stats-intro .eyebrow{color:var(--clay)}
.section-heading .eyebrow span,.about-copy .eyebrow span,.stats-intro .eyebrow span{background:var(--gold)}
.section-heading h2,.stats-intro h2,.about-copy h2{color:var(--deep)}
.section-heading h2 em,.stats-intro h2 em,.about-copy h2 em{color:var(--clay)}
.service-card,.procurement-card,.news-featured,.stats-cards>div{
  border-color:var(--line);
  border-radius:3px;
  background:rgba(255,253,248,.93);
  box-shadow:0 9px 0 rgba(8,47,43,.045);
}
.service-card,.procurement-card{border-top:4px solid var(--gold)}
.service-card.featured{
  color:#fff;
  border-color:var(--gold);
  background:linear-gradient(145deg,#082f2b,#14604f);
}
.service-icon,.procurement-icon{border-radius:50%;background:#e7eadc;color:var(--deep)}
.featured .service-icon{background:var(--gold)}
.service-go{color:var(--clay)}
.featured .service-go{color:#f1ca67}
.procurement-section,.stats-section{
  background:
    linear-gradient(135deg,rgba(225,182,78,.09) 25%,transparent 25%) 0 0/24px 24px,
    var(--cream);
  border-color:#e3dac7;
}
.info-band,.faq-section{
  position:relative;
  overflow:hidden;
  background:
    repeating-linear-gradient(135deg,transparent 0 54px,rgba(225,182,78,.055) 54px 55px),
    linear-gradient(115deg,#061f1d,#0d493f);
}
.info-band::after,.faq-section::after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-130px;
  bottom:-130px;
  border:1px solid rgba(225,182,78,.3);
  transform:rotate(45deg);
}
.info-band h2 em,.faq-intro h2 em{color:#f1ca67}
.info-links{border-color:rgba(225,182,78,.25)}
.info-links a{border-color:rgba(255,255,255,.14);transition:padding .2s ease,background .2s ease}
.info-links a:hover{padding-left:12px;background:rgba(255,255,255,.05)}
.info-links span,.info-links i{color:#f1ca67}
.news-image,.mini-image{filter:none}
.image-one{background:linear-gradient(135deg,#082f2b,#b96d4b)}
.image-two{background:linear-gradient(135deg,#e1b64e,#14604f)}
.image-three{background:linear-gradient(135deg,#b96d4b,#355f4f)}
.tag{border-radius:2px;color:var(--deep);background:#f8db88}
.stats-cards>div:nth-child(1),.stats-cards>div:nth-child(4){border-top:4px solid var(--gold)}
.stats-cards>div:nth-child(2),.stats-cards>div:nth-child(3){border-top:4px solid var(--clay)}
.stats-cards b{color:var(--deep)}
.about-photo{border-radius:3px;background:linear-gradient(145deg,#082f2b,#b96d4b)}
.about-photo::before{
  content:"";
  position:absolute;
  inset:18px;
  border:1px solid rgba(225,182,78,.55);
}
.quote-card{border:1px solid var(--line);border-radius:3px;box-shadow:10px 10px 0 rgba(225,182,78,.22)}
.quote-card span{color:var(--clay)}
.faq-visual-card{border-radius:3px}
.faq-card-main b{border-radius:50%;background:var(--gold)}
.faq-list summary::after{color:#f1ca67}
footer{background:#071f1d;color:#d5e2dc}
footer h3{color:#f1ca67}
footer a,footer p{color:#b9cec4}
.footer-brand strong{
  color:#fffdf8!important;
  -webkit-text-stroke:.35px rgba(255,255,255,.9);
  text-shadow:0 1px 0 rgba(0,0,0,.35);
}
.footer-brand small{color:#f1ca67!important}
.footer-brand .brand-mark{
  border-color:#f1ca67;
  background-color:#fffdf8;
  box-shadow:0 0 0 3px rgba(225,182,78,.16);
}
.footer-bottom{border-color:rgba(225,182,78,.18)}
footer .social-links{
  display:flex!important;
  grid-template-columns:none!important;
  align-items:center;
  flex-wrap:wrap;
  gap:10px!important;
  margin-top:20px;
}
footer .social-links a{
  display:grid!important;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  margin:0!important;
  padding:0;
  border:1px solid rgba(225,182,78,.42);
  border-radius:50%;
  background:rgba(255,253,248,.055);
  color:#f1ca67;
  line-height:1;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
  transition:transform .2s ease,background .2s ease,border-color .2s ease,color .2s ease;
}
footer .social-links a:hover{
  border-color:#f1ca67;
  background:#f1ca67;
  color:var(--deep);
  transform:translateY(-3px);
}
footer .social-links a:focus-visible{
  outline:3px solid #fffdf8;
  outline-offset:3px;
}
footer .social-links svg{
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
}
.main-nav .official-nav-link{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:var(--clay)!important;
  white-space:nowrap;
}
.main-nav .official-nav-link::after{
  content:"↗";
  color:var(--gold);
  font-size:.95em;
}
.main-nav .official-nav-link:hover{
  color:var(--deep)!important;
}
.contact-detail{margin-bottom:8px}
.whatsapp-float{
  border:3px solid #f8db88;
  background:#128b63;
  box-shadow:8px 8px 0 rgba(8,47,43,.26);
}
.accessibility-toggle{
  background:#4a90e2;
  color:#081c33;
  border:1px solid #2f76c7;
  box-shadow:5px 8px 22px rgba(32,91,160,.28);
}
.accessibility-toggle .accessibility-symbol,
.accessibility-toggle>span:last-child{color:#fff!important}
.site-notice{border-color:var(--gold);border-radius:3px;background:#fffaf0}
@media(max-width:900px){
  .main-nav{background:#fffdf8!important;border-bottom:2px solid var(--gold)}
  .main-nav>a:not(.nav-cta)::after{bottom:2px}
}
@media(min-width:651px) and (max-width:1100px){
  .menu-toggle{display:block}
  .main-nav{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:77px;
    max-height:calc(100vh - 78px);
    padding:15px 24px 20px;
    overflow-y:auto;
    background:#fffdf8;
    box-shadow:0 12px 20px rgba(20,63,44,.12);
    flex-direction:column;
    align-items:stretch;
  }
  .main-nav.open{display:flex}
  .main-nav>a:not(.nav-cta){display:block;padding:8px 0}
  .main-nav .official-nav-link{display:flex!important}
  .site-search{width:100%;height:43px;margin-top:6px}
  .site-search button{width:43px;height:43px}
}
@media(max-width:650px){
  .site-header{height:72px}
  .main-nav{top:71px}
  .hero{min-height:0}
  .hero-grid{min-height:0}
  .hero-copy::before{font-size:.6rem;letter-spacing:.11em}
  .hero-panel{box-shadow:10px 10px 0 rgba(225,182,78,.18)}
  footer .social-links{
    display:flex!important;
    grid-template-columns:none!important;
    gap:9px!important;
  }
  footer .social-links a{
    flex-basis:40px;
    width:40px;
    height:40px;
  }
}

/* Official PPID Paser brand lockup */
.site-header .brand{
  flex:0 1 auto;
  min-width:0;
}
.site-header .brand-logo{
  display:block;
  width:clamp(205px,22vw,260px);
  height:auto;
  max-height:58px;
  object-fit:contain;
  object-position:left center;
}
.footer-brand{
  display:inline-flex;
  width:min(250px,100%);
}
.footer-brand .brand-logo{
  display:block;
  width:100%;
  height:auto;
  max-height:82px;
  object-fit:contain;
  object-position:left center;
}
html.dark-mode .brand-logo{
  content:url("../images/ppid-paser-logo-dark.svg");
}
@media(max-width:650px){
  .site-header .brand-logo{
    width:min(218px,calc(100vw - 112px));
    max-height:48px;
  }
}

/* Cahaya Hijau — complete light-mode redesign */
:root{
  --green:#0f5a49;
  --deep:#073b33;
  --lime:#d8ad55;
  --cream:#f6f1e6;
  --ink:#173b33;
  --muted:#62786f;
  --line:#ddd4c3;
  --white:#fffdf8;
  --hijau:#0c4b3e;
  --gold:#d8ad55;
  --clay:#c97454;
}
body{
  background:
    radial-gradient(circle at 8% 8%,rgba(216,173,85,.12),transparent 26rem),
    radial-gradient(circle at 92% 30%,rgba(79,154,134,.09),transparent 28rem),
    linear-gradient(90deg,rgba(7,59,51,.025) 1px,transparent 1px),
    linear-gradient(rgba(7,59,51,.025) 1px,transparent 1px),
    #fbf8f0!important;
  background-size:auto,auto,48px 48px,48px 48px,auto!important;
}
.topbar{
  background:linear-gradient(90deg,#052e28,#0b5042)!important;
  border-bottom:1px solid rgba(216,173,85,.38)!important;
}
.site-header{
  height:80px!important;
  background:rgba(255,253,248,.94)!important;
  border-color:rgba(7,59,51,.13)!important;
  box-shadow:0 10px 30px rgba(7,59,51,.075)!important;
  backdrop-filter:blur(14px);
}
.brand strong{color:var(--deep)!important}
.brand small{color:#7c725f!important;letter-spacing:.035em}
.main-nav>a:not(.nav-cta),.nav-dropdown-link{position:relative;color:#294e45}
.nav-dropdown-link.active{color:#294e45!important}
.main-nav>a:not(.nav-cta)::after,.nav-dropdown-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:18px;
  height:2px;
  background:linear-gradient(90deg,var(--gold),var(--clay));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s ease;
}
.main-nav>a:hover::after,
.main-nav>a.active::after,
.nav-dropdown-link:hover::after,
.nav-dropdown-link.active::after{transform:scaleX(1)}
.main-nav .official-nav-link{color:var(--clay)!important}
.hero{
  background:
    radial-gradient(circle at 85% 18%,rgba(216,173,85,.2),transparent 23rem),
    radial-gradient(circle at 15% 100%,rgba(201,116,84,.09),transparent 24rem),
    linear-gradient(118deg,#f5f1e5,#e9f0e3 62%,#edf3e8)!important;
  border-bottom:1px solid #e3dac8;
}
.hero::before{color:#85662b!important}
.hero h1{color:#153d34!important}
.hero h1 em{color:#0f6a55!important}
.hero-text{color:#526f65!important}
.hero-panel{
  background:
    radial-gradient(circle at 100% 0,rgba(216,173,85,.14),transparent 13rem),
    linear-gradient(145deg,#0f5c4b,#073f35)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-left:5px solid var(--gold)!important;
  border-radius:8px!important;
  box-shadow:14px 16px 0 rgba(216,173,85,.2)!important;
}
.panel-card{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.22)!important}
.button,.nav-cta{border-radius:6px!important}
.button.primary,.nav-cta{
  background:linear-gradient(135deg,#0f5a49,#0a493d)!important;
  color:#fffdf8!important;
  box-shadow:0 8px 20px rgba(7,59,51,.16)!important;
}
.button.ghost,.button.outline{
  background:rgba(255,253,248,.72)!important;
  border-color:#a9b9aa!important;
  color:#0f5a49!important;
}
.section{position:relative}
.service-section{
  background:
    radial-gradient(circle at 7% 48%,rgba(79,154,134,.07),transparent 24rem),
    rgba(255,253,248,.46)!important;
}
.procurement-section,
.stats-section{
  background:
    radial-gradient(circle at 88% 16%,rgba(216,173,85,.08),transparent 23rem),
    linear-gradient(135deg,#f1eee4,#edf2e8)!important;
  border-color:#ded6c6!important;
}
.service-card,
.procurement-card,
.news-featured,
.news-list article,
.stats-cards>div{
  background:rgba(255,253,248,.96)!important;
  border:1px solid #ddd4c3!important;
  border-radius:8px!important;
  box-shadow:0 13px 30px rgba(29,66,55,.075)!important;
}
.service-card:nth-child(4n+1),
.stats-cards>div:nth-child(1){border-top:4px solid #d8ad55!important}
.procurement-card:nth-child(3n+1){border-top:4px solid #4f9a86!important}
.service-card:nth-child(4n+2),
.stats-cards>div:nth-child(2){border-top:4px solid #4f9a86!important}
.procurement-card:nth-child(3n+2){border-top:4px solid #d8ad55!important}
.service-card:nth-child(4n+3),
.procurement-card:nth-child(3n+3),
.stats-cards>div:nth-child(3){border-top:4px solid #c97454!important}
.service-card:nth-child(4n),
.stats-cards>div:nth-child(4){border-top:4px solid #8cad78!important}
.service-card.featured{
  background:
    radial-gradient(circle at 100% 0,rgba(216,173,85,.13),transparent 10rem),
    linear-gradient(145deg,#0f5a49,#083f35)!important;
  color:#fff!important;
  border-color:#0f5a49!important;
}
.service-card:hover,.procurement-card:hover,.stats-cards>div:hover{
  transform:translateY(-7px);
  border-color:#a7b8ae!important;
  box-shadow:0 18px 38px rgba(29,66,55,.13)!important;
}
.service-icon,.procurement-icon{
  border-radius:6px!important;
  background:#e4efe8!important;
  color:#0f5a49!important;
}
.service-card:nth-child(4n+2) .service-icon{background:#e1f0ec!important;color:#3c816f!important}
.procurement-card:nth-child(3n+2) .procurement-icon{background:#f4ecd9!important;color:#9f6e1d!important}
.service-card:nth-child(4n+3) .service-icon,
.procurement-card:nth-child(3n+3) .procurement-icon{background:#f4e6df!important;color:#b45f43!important}
.info-band,.faq-section,.cta-section{
  background:
    radial-gradient(circle at 10% 100%,rgba(201,116,84,.09),transparent 22rem),
    radial-gradient(circle at 92% 0,rgba(216,173,85,.09),transparent 22rem),
    repeating-linear-gradient(135deg,transparent 0 54px,rgba(216,173,85,.045) 54px 55px),
    linear-gradient(115deg,#052d27,#0a493d)!important;
}
.info-links a{border-color:rgba(255,255,255,.14)!important}
.info-links a:hover{padding-left:12px;background:rgba(255,255,255,.05)!important}
.news-image,.mini-image{filter:none}
.about-section{
  background:
    radial-gradient(circle at 90% 42%,rgba(201,116,84,.07),transparent 24rem),
    transparent!important;
}
.about-photo{border-radius:8px!important;background:linear-gradient(145deg,#0d5244,#b86c4d)!important}
.quote-card{
  border-radius:6px!important;
  border:1px solid #ddd4c3!important;
  box-shadow:10px 10px 0 rgba(216,173,85,.18)!important;
}
footer{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 0,rgba(216,173,85,.08),transparent 18rem),
    linear-gradient(120deg,#05241f,#073a31)!important;
  color:#c7d6d0!important;
  border-top:3px solid #d8ad55!important;
}
footer::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(circle at 8% 0,rgba(220,184,94,.07),transparent 18rem),
    linear-gradient(120deg,#041310,#061d19);
  opacity:0;
  pointer-events:none;
  transition:opacity .36s ease;
}
footer>.container{position:relative;z-index:1}
footer h3,footer .footer-brand small{color:#e7c879!important}
footer a,footer p{color:#c7d6d0!important}
footer .footer-brand strong{
  color:#fffdf8!important;
  -webkit-text-stroke:0!important;
  text-shadow:0 1px 0 rgba(0,0,0,.28)!important;
}
footer .social-links a{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(216,173,85,.48)!important;
  color:#e7c879!important;
}
footer .social-links a:hover{background:#d8ad55!important;color:#102f28!important}
.site-search{background:#fffdf8!important;border-color:#d6cdbd!important}
.accessibility-panel{
  background:#fffdf8!important;
  border-color:#d7cebd!important;
  box-shadow:12px 0 32px rgba(26,60,49,.16)!important;
}
.accessibility-panel button{border-radius:5px!important}
.theme-mode-switch{
  position:absolute;
  left:50%;
  top:50%;
  z-index:2;
  width:58px;
  height:29px;
  margin:0;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  color:inherit;
  cursor:pointer;
  transform:translate(-50%,-50%);
}
.theme-switch-track{
  position:relative;
  display:block;
  width:58px;
  height:29px;
  overflow:visible;
  border:1px solid rgba(255,255,255,.48);
  border-radius:999px;
  background:rgba(239,244,242,.2);
  box-shadow:inset 0 1px 4px rgba(0,0,0,.22);
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.theme-track-icon{
  position:absolute;
  top:50%;
  z-index:1;
  font:700 14px/1 "Roboto",sans-serif;
  transform:translateY(-50%);
  transition:color .25s ease,opacity .25s ease;
}
.theme-track-icon-sun{left:7px;color:rgba(255,255,255,.42)}
.theme-track-icon-moon{right:7px;color:#d7dfdc}
.theme-switch-thumb{
  position:absolute;
  left:-1px;
  top:-1px;
  z-index:2;
  display:grid;
  width:29px;
  height:29px;
  place-items:center;
  border:1px solid rgba(255,255,255,.86);
  border-radius:50%;
  background:#fffdf8;
  color:#e89b22;
  box-shadow:0 3px 9px rgba(0,0,0,.28);
  transition:transform .25s cubic-bezier(.2,.75,.25,1),background .25s ease,color .25s ease;
}
.theme-thumb-icon{
  position:absolute;
  font:800 17px/1 "Roboto",sans-serif;
  transition:opacity .2s ease,transform .25s ease;
}
.theme-thumb-moon{opacity:0;transform:scale(.7)}
.theme-mode-switch[aria-pressed="true"] .theme-switch-track{background:#34466c;border-color:#7584a8}
.theme-mode-switch[aria-pressed="true"] .theme-switch-thumb{transform:translateX(29px);background:#f4f6fb;color:#4260ba}
.theme-mode-switch[aria-pressed="true"] .theme-thumb-sun{opacity:0;transform:scale(.7)}
.theme-mode-switch[aria-pressed="true"] .theme-thumb-moon{opacity:1;transform:scale(1)}
.theme-mode-switch:focus-visible{outline:2px solid #f1ca67;outline-offset:3px}
.topbar-inner .topbar-theme-switch span{display:block!important}
.topbar-inner .topbar-theme-switch .theme-switch-thumb{display:grid!important}
body,.site-header,.hero,.section,.service-card,.procurement-card,.stats-cards>div,
footer{transition:background-color .28s ease,color .28s ease,border-color .28s ease,box-shadow .28s ease}
footer h3,footer a,footer p,footer .footer-brand small,footer .footer-brand strong,
footer .social-links a,footer .footer-copy,footer .footer-bottom{
  transition:color .28s ease,background-color .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.accessibility-panel{
  transition:transform .28s ease,background-color .28s ease,color .28s ease,border-color .28s ease,box-shadow .28s ease;
}

html.dark-mode{
  --green:#f1ca67;
  --deep:#061f1d;
  --lime:#e3bd61;
  --cream:#0a2420;
  --ink:#f5f1e8;
  --muted:#b5c6bf;
  --line:#315048;
  --white:#0d2925;
  --hijau:#0b342d;
  --gold:#dcb85e;
  --clay:#d58768;
  color-scheme:dark;
  filter:none!important;
}
html.dark-mode body{color:#f5f1e8!important}
html.dark-mode button:focus-visible,
html.dark-mode a:focus-visible,
html.dark-mode input:focus-visible,
html.dark-mode select:focus-visible{
  outline:3px solid #e3bd61!important;
  outline-offset:3px!important;
}
html.dark-mode.black-white{filter:none!important}
html.black-white:not(.dark-mode) body{background:#fff}

html.dark-mode body{
  background:
    radial-gradient(circle at 10% 8%,rgba(220,184,94,.11),transparent 28rem),
    radial-gradient(circle at 90% 28%,rgba(64,143,123,.11),transparent 30rem),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    #071c19!important;
  background-size:auto,auto,48px 48px,48px 48px,auto!important;
}
html.dark-mode .topbar{background:#041310!important;border-color:#29483f!important;color:#c7d5cf!important}
html.dark-mode .site-header{
  background:rgba(7,28,25,.96)!important;
  border-color:#29483f!important;
  box-shadow:0 10px 32px rgba(0,0,0,.2)!important;
}
html.dark-mode .main-nav{background:#071c19!important}
html.dark-mode .brand strong,
html.dark-mode .main-nav>a:not(.nav-cta),
html.dark-mode .nav-dropdown-link{color:#f5f1e8!important}
html.dark-mode .nav-dropdown-link.active{color:#f5f1e8!important}
html.dark-mode .brand small{color:#aebfb8!important}
html.dark-mode .main-nav .active{color:#e3bd61!important}
html.dark-mode .main-nav>a.official-nav-link:not(.nav-cta){color:var(--clay)!important}
html.dark-mode .hero-panel .panel-top p{color:#d98b6f!important}
html.dark-mode .hero{
  background:
    radial-gradient(circle at 82% 12%,rgba(220,184,94,.17),transparent 22rem),
    radial-gradient(circle at 16% 90%,rgba(213,135,104,.1),transparent 24rem),
    linear-gradient(120deg,#092822,#0c3a31 58%,#102f2a)!important;
}
html.dark-mode .hero::before{color:#dcb85e!important}
html.dark-mode .hero h1,
html.dark-mode .hero-note{color:#f5f1e8!important}
html.dark-mode .hero-text{color:#c3d2cc!important}
html.dark-mode .hero h1 em,
html.dark-mode .eyebrow,
html.dark-mode .panel-link{color:#e3bd61!important}
html.dark-mode .hero-panel{
  background:
    radial-gradient(circle at 100% 0,rgba(220,184,94,.13),transparent 13rem),
    linear-gradient(145deg,#0f3a32,#0b2d27)!important;
  border:1px solid #557167!important;
  box-shadow:12px 14px 0 rgba(0,0,0,.18)!important;
}
html.dark-mode .panel-card{
  background:rgba(255,255,255,.055)!important;
  border-color:#46665d!important;
}
html.dark-mode .section{background:transparent!important}
html.dark-mode .service-section{
  background:
    radial-gradient(circle at 8% 50%,rgba(64,143,123,.07),transparent 24rem),
    linear-gradient(180deg,rgba(10,36,32,.15),rgba(13,41,37,.38))!important;
}
html.dark-mode .about-section{
  background:
    radial-gradient(circle at 88% 42%,rgba(213,135,104,.07),transparent 23rem),
    transparent!important;
}
html.dark-mode .procurement-section,
html.dark-mode .stats-section{
  background:
    radial-gradient(circle at 86% 20%,rgba(220,184,94,.055),transparent 22rem),
    linear-gradient(135deg,#09231f,#0b2924)!important;
  border-color:#29483f!important;
}
html.dark-mode .service-card,
html.dark-mode .procurement-card,
html.dark-mode .news-featured,
html.dark-mode .news-list article,
html.dark-mode .stats-cards>div,
html.dark-mode .quote-card,
html.dark-mode .faq-visual-card{
  background:#0d2925!important;
  color:#f5f1e8!important;
  border:1px solid #315048!important;
  box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
}
html.dark-mode .service-card.featured{
  background:
    radial-gradient(circle at 100% 0,rgba(220,184,94,.12),transparent 10rem),
    linear-gradient(145deg,#0f3d34,#0b3029)!important;
  border-color:#5a705d!important;
}
html.dark-mode .service-card:nth-child(4n+1),
html.dark-mode .procurement-card:nth-child(3n+2){border-top:3px solid #dcb85e!important}
html.dark-mode .service-card:nth-child(4n+2),
html.dark-mode .procurement-card:nth-child(3n+1){border-top:3px solid #4f9a86!important}
html.dark-mode .service-card:nth-child(4n+3),
html.dark-mode .procurement-card:nth-child(3n+3){border-top:3px solid #d58768!important}
html.dark-mode .service-card:nth-child(4n),
html.dark-mode .stats-cards>div:nth-child(4){border-top:3px solid #8cad78!important}
html.dark-mode .service-card:hover,
html.dark-mode .procurement-card:hover,
html.dark-mode .stats-cards>div:hover{
  border-color:#60796f!important;
  box-shadow:0 18px 38px rgba(0,0,0,.26),0 0 0 1px rgba(220,184,94,.05)!important;
}
html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3,
html.dark-mode .stats-cards span,
html.dark-mode .news-content h3,
html.dark-mode .news-list h3{color:#f5f1e8!important}
html.dark-mode p,
html.dark-mode small,
html.dark-mode .footer-copy,
html.dark-mode .procurement-note,
html.dark-mode .date{color:#b5c6bf!important}
html.dark-mode .service-icon,
html.dark-mode .procurement-icon{background:#173c35!important;color:#e3bd61!important}
html.dark-mode .service-card:nth-child(4n+2) .service-icon{background:#123e36!important;color:#79c3b0!important}
html.dark-mode .procurement-card:nth-child(3n+2) .procurement-icon{background:#3d3523!important;color:#e3bd61!important}
html.dark-mode .service-card:nth-child(4n+3) .service-icon,
html.dark-mode .procurement-card:nth-child(3n+3) .procurement-icon{background:#3a2b26!important;color:#e6a087!important}
html.dark-mode .service-go,
html.dark-mode .text-link,
html.dark-mode .stats-cards b{color:#e3bd61!important}
html.dark-mode .info-band,
html.dark-mode .faq-section,
html.dark-mode .cta-section{
  background:
    radial-gradient(circle at 12% 100%,rgba(213,135,104,.075),transparent 22rem),
    radial-gradient(circle at 90% 0,rgba(220,184,94,.075),transparent 22rem),
    repeating-linear-gradient(135deg,transparent 0 54px,rgba(220,184,94,.035) 54px 55px),
    linear-gradient(115deg,#041815,#082a24)!important;
}
html.dark-mode .info-links{border-color:#35554c!important}
html.dark-mode .info-links a{border-color:#29483f!important}
html.dark-mode .info-links a:hover{background:rgba(220,184,94,.06)!important}
html.dark-mode .button.primary,
html.dark-mode .nav-cta{
  background:#dcb85e!important;
  color:#10231e!important;
  border-color:#dcb85e!important;
  box-shadow:none!important;
}
html.dark-mode .button.ghost,
html.dark-mode .button.outline,
html.dark-mode .button.white{
  background:transparent!important;
  color:#e3bd61!important;
  border-color:#7e744d!important;
  box-shadow:none!important;
}
html.dark-mode .site-search,
html.dark-mode .site-search input,
html.dark-mode .site-search button{
  background:#0d2925!important;
  color:#f5f1e8!important;
  border-color:#3a594f!important;
}
html.dark-mode .site-search input::placeholder{color:#93aaa1!important}
html.dark-mode footer{
  color:#b5c6bf!important;
  border-top:3px solid #544a31!important;
}
html.dark-mode footer::before{opacity:1}
html.dark-mode footer h3,
html.dark-mode footer .footer-brand small{color:#dcb85e!important}
html.dark-mode footer a,
html.dark-mode footer p{color:#b5c6bf!important}
html.dark-mode footer .social-links a{
  background:#0b2823!important;
  color:#dcb85e!important;
  border-color:#5e5438!important;
  box-shadow:none!important;
}
html.dark-mode footer .social-links a:hover{background:#dcb85e!important;color:#10231e!important}
html.dark-mode .accessibility-panel{
  background:#0d2925!important;
  color:#f5f1e8!important;
  border-color:#3a594f!important;
  box-shadow:12px 0 32px rgba(0,0,0,.28)!important;
}
html.dark-mode .accessibility-panel::before,
html.dark-mode .text-size-control output{color:#e3bd61!important}
html.dark-mode .accessibility-panel>p,
html.dark-mode .text-size-control{color:#c3d2cc!important}
html.dark-mode .accessibility-panel button{
  background:#102f2a!important;
  color:#f5f1e8!important;
  border-color:#46665d!important;
}
html.dark-mode .accessibility-panel button:hover{background:#173c35!important;border-color:#6c8179!important}
html.dark-mode .accessibility-panel button[aria-pressed="true"]{
  background:#dcb85e!important;
  color:#10231e!important;
  border-color:#dcb85e!important;
}
html.dark-mode .theme-mode-switch .theme-switch-track{background:#34466c!important;border-color:#7584a8!important}
html.dark-mode .theme-mode-switch .theme-switch-thumb{background:#f4f6fb!important;color:#4260ba!important;box-shadow:0 3px 9px rgba(0,0,0,.34)!important}
html.dark-mode .accessibility-toggle{
  background:#6aaaf4!important;
  color:#06192e!important;
  border-color:#a7ccff!important;
  box-shadow:5px 8px 24px rgba(0,0,0,.38)!important;
}
html.dark-mode .accessibility-toggle .accessibility-symbol,
html.dark-mode .accessibility-toggle>span:last-child{color:#06192e!important}
html.dark-mode .brand-mark{background-color:#fff!important;border-color:#dcb85e!important}
html.dark-mode .whatsapp-bubble{
  background:#0d2925!important;
  color:#f5f1e8!important;
  border-color:#dcb85e!important;
  box-shadow:0 12px 28px rgba(0,0,0,.38)!important;
}
html.dark-mode .whatsapp-bubble::after{
  background:#0d2925!important;
  border-right-color:#dcb85e!important;
  border-bottom-color:#dcb85e!important;
}
html.dark-mode .site-notice{background:#0d2925!important;color:#f5f1e8!important;border-color:#6d6444!important}
html.dark-mode .stats-cards>div:nth-child(1){
  background:linear-gradient(145deg,#102f2a,#17362c)!important;
  border-top:3px solid #dcb85e!important;
}
html.dark-mode .stats-cards>div:nth-child(2){
  background:linear-gradient(145deg,#0d2d29,#123832)!important;
  border-top:3px solid #4f9a86!important;
}
html.dark-mode .stats-cards>div:nth-child(3){
  background:linear-gradient(145deg,#112b27,#352a25)!important;
  border-top:3px solid #d58768!important;
}
html.dark-mode .quote-card{
  background:
    linear-gradient(145deg,rgba(220,184,94,.06),transparent 55%),
    #0d2925!important;
}

/* Compact responsive navigation patch */
@media(max-width:1100px){
  body.menu-open{overflow:hidden}
  body.menu-open::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:35;
    background:rgba(3,18,15,.58);
    backdrop-filter:blur(2px);
  }
  body.menu-open .site-header{z-index:40!important}
  body.menu-open .accessibility-tools,
  body.menu-open .whatsapp-float{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
  }
  .menu-toggle{
    position:relative;
    z-index:2;
  }
  .menu-toggle span{
    transition:transform .2s ease,opacity .2s ease;
    transform-origin:center;
  }
  .menu-toggle[aria-expanded="true"] span:nth-child(1),
  .menu-toggle[aria-expanded="true"] span:nth-child(3){
    position:absolute;
    left:8px;
    right:8px;
    top:calc(50% - 1px);
    margin:0;
  }
  .menu-toggle[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu-toggle[aria-expanded="true"] span:nth-child(3){transform:rotate(-45deg)}
  .menu-toggle[aria-expanded="true"] span{display:none}
  .menu-toggle[aria-expanded="true"]::before{
    content:"\00d7";
    display:block;
    color:#f1ca67;
    font:400 2.15rem/1 Arial,sans-serif;
  }
  .main-nav{
    display:none!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    align-items:stretch!important;
    gap:6px 14px!important;
    max-height:calc(100vh - 72px)!important;
    max-height:calc(100dvh - 72px)!important;
    margin:0!important;
    padding:14px clamp(16px,4vw,40px) 18px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    border-bottom:2px solid var(--gold)!important;
    background:#fffdf8!important;
    box-shadow:0 18px 34px rgba(3,18,15,.24)!important;
    white-space:normal!important;
  }
  .main-nav.open{display:grid!important}
  .main-nav>a:not(.nav-cta){
    display:flex!important;
    min-height:42px;
    align-items:center;
    padding:9px 12px!important;
    border:1px solid transparent;
    border-radius:4px;
    transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
  }
  .main-nav>a:not(.nav-cta):hover,
  .main-nav>a:not(.nav-cta):focus-visible{
    border-color:rgba(8,47,43,.16);
    background:#f4ecdb;
    transform:translateX(3px);
  }
  .main-nav>a.active{
    border-color:rgba(8,47,43,.18);
    background:#eee2c6;
    box-shadow:inset 3px 0 var(--gold);
  }
  .main-nav>a:not(.nav-cta)::after{display:none!important}
  .main-nav .official-nav-link{display:flex!important}
  .site-search{
    grid-column:1/-1!important;
    width:100%!important;
    height:44px!important;
    margin-top:4px!important;
  }
  .site-search button{width:44px!important;height:44px!important}
  html.dark-mode .main-nav{background:#071c19!important;border-bottom-color:#dcb85e!important}
  html.dark-mode .main-nav>a:not(.nav-cta):hover,
  html.dark-mode .main-nav>a:not(.nav-cta):focus-visible{
    border-color:rgba(220,184,94,.3);
    background:#12332d;
  }
  html.dark-mode .main-nav>a.active{
    border-color:rgba(220,184,94,.38);
    background:#173b33;
  }
}

/* Responsive containment: prevent grid content from defining a wider viewport. */
.hero-grid>*,
.services-grid>*,
.info-band-grid>*,
.news-grid>*,
.stats-grid>*,
.stats-cards>*,
.about-grid>*,
.procurement-grid>*,
.cta-box>*,
.footer-grid>*{
  min-width:0;
}

.hero-copy h1,
.section-heading h2,
.about-copy h2,
.info-band h2,
.cta-box h2{
  overflow-wrap:anywhere;
}

.stats-grid{
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
}
.stats-intro h2{
  font-size:clamp(2rem,3vw,2.5rem);
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}

@media(max-width:1000px){
  .stats-grid{
    grid-template-columns:minmax(0,1fr);
    gap:32px;
  }
}

@media(max-width:900px){
  .stats-grid{
    grid-template-columns:minmax(0,1fr);
    gap:32px;
  }
}

@media(max-width:650px){
  .section-heading h2,
  .stats-intro h2,
  .about-copy h2{
    font-size:clamp(1.7rem,7.6vw,2.05rem);
    line-height:1.12;
  }
  .stats-intro h2{
    font-size:1.6rem;
    overflow-wrap:normal;
  }
}

/* Service card contextual motion */
.service-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.service-card>*{
  position:relative;
  z-index:2;
}
.service-card::before,
.service-card::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  will-change:transform,opacity,background-position;
}
.service-request::before{
  inset:-52%;
  background:
    radial-gradient(circle at 55% 48%,rgba(241,202,103,.2),transparent 30%),
    repeating-linear-gradient(118deg,transparent 0 34px,rgba(241,202,103,.2) 35px 39px,transparent 40px 72px);
  animation:service-request-flow 7s linear infinite;
}
.service-request::after{
  right:-16px;
  bottom:-38px;
  width:122px;
  height:150px;
  border:2px solid rgba(241,202,103,.66);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(241,202,103,.18),rgba(241,202,103,.025));
  box-shadow:-23px -20px 0 -2px rgba(241,202,103,.22),-46px -40px 0 -2px rgba(241,202,103,.11),0 0 28px rgba(241,202,103,.14);
  transform:rotate(-8deg);
  animation:service-request-docs 4.4s ease-in-out infinite;
}
.service-objection{
  --objection-mark:#1f6957;
  --objection-stamp-bg:rgba(246,251,248,.78);
}
.service-objection .service-icon{
  position:relative;
  font-size:0!important;
}
.service-objection .service-icon::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:21px;
  height:25px;
  box-sizing:border-box;
  border:2px solid currentColor;
  border-radius:2px;
  background:transparent;
  transform:translate(-50%,-50%);
}
.service-objection .service-icon::after{
  content:"!";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  padding-top:1px;
  font:900 13px/1 "Poppins",sans-serif;
}
.service-objection::before{
  right:-24px;
  bottom:-38px;
  width:172px;
  height:216px;
  border:2px solid rgba(79,154,134,.48);
  border-radius:13px;
  background:
    linear-gradient(135deg,transparent 0 80%,rgba(79,154,134,.24) 81%),
    repeating-linear-gradient(180deg,rgba(79,154,134,.16) 0 2px,transparent 2px 25px),
    linear-gradient(150deg,rgba(79,154,134,.23),rgba(79,154,134,.055));
  box-shadow:-22px 18px 0 -7px rgba(79,154,134,.12),0 12px 30px rgba(31,105,87,.16);
  transform-origin:bottom center;
  animation:service-objection-submit 4.6s ease-in-out infinite;
}
.service-objection::after{
  content:"";
  right:26px;
  bottom:34px;
  width:66px;
  height:66px;
  display:grid;
  place-items:center;
  border:3px double rgba(31,105,87,.72);
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 70%,var(--objection-mark) 0 4px,transparent 5px),
    linear-gradient(var(--objection-mark),var(--objection-mark)) center 28%/5px 25px no-repeat,
    var(--objection-stamp-bg);
  box-shadow:0 8px 20px rgba(31,105,87,.16);
  animation:service-objection-stamp 4.6s cubic-bezier(.2,.75,.25,1) infinite;
}
.service-directory::before{
  inset:0;
  background-image:linear-gradient(rgba(201,116,84,.17) 1px,transparent 1px),linear-gradient(90deg,rgba(201,116,84,.17) 1px,transparent 1px);
  background-size:24px 24px;
  animation:service-directory-grid 8s linear infinite;
}
.service-directory::after{
  left:-22%;
  right:-22%;
  top:-38%;
  height:42%;
  background:linear-gradient(180deg,transparent,rgba(201,116,84,.14),rgba(201,116,84,.52),rgba(255,249,240,.22),transparent);
  box-shadow:0 10px 22px rgba(201,116,84,.18);
  animation:service-directory-scan 4.5s ease-in-out infinite;
}
.service-periodic::before{
  right:-46px;
  bottom:-66px;
  width:204px;
  height:204px;
  border:2px solid rgba(108,151,85,.58);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(140,173,120,.2),0 0 0 58px rgba(140,173,120,.1),0 0 30px rgba(108,151,85,.18);
  animation:service-periodic-rings 3.8s ease-in-out infinite;
}
.service-periodic::after{
  right:55px;
  bottom:35px;
  width:3px;
  height:76px;
  border-radius:2px;
  background:linear-gradient(180deg,rgba(70,111,57,.24),rgba(70,111,57,.9));
  box-shadow:0 0 9px rgba(90,130,79,.35);
  transform-origin:50% 100%;
  animation:service-periodic-hand 6s linear infinite;
}
@keyframes service-request-flow{
  from{transform:translate3d(-10%,8%,0)}
  to{transform:translate3d(10%,-8%,0)}
}
@keyframes service-request-docs{
  0%,100%{transform:translate3d(0,0,0) rotate(-8deg);opacity:.76}
  50%{transform:translate3d(-13px,-16px,0) rotate(-3deg);opacity:1}
}
@keyframes service-objection-submit{
  0%,100%{transform:translate3d(10px,24px,0) rotate(8deg);opacity:.58}
  42%,76%{transform:translate3d(-4px,-8px,0) rotate(3deg);opacity:1}
}
@keyframes service-objection-stamp{
  0%,20%{transform:scale(1.42) rotate(-17deg);opacity:0}
  36%,86%{transform:scale(1) rotate(-10deg);opacity:1}
  100%{transform:scale(.92) rotate(-8deg);opacity:0}
}
@keyframes service-directory-grid{
  from{background-position:0 0,0 0}
  to{background-position:48px 48px,48px 48px}
}
@keyframes service-directory-scan{
  0%{transform:translateY(-15%);opacity:0}
  18%,82%{opacity:1}
  100%{transform:translateY(480%);opacity:0}
}
@keyframes service-periodic-rings{
  0%,100%{transform:scale(.88);opacity:.62}
  50%{transform:scale(1.05);opacity:1}
}
@keyframes service-periodic-hand{
  to{transform:rotate(360deg)}
}
html.dark-mode .service-objection{--objection-mark:#79c3b0;--objection-stamp-bg:rgba(8,44,38,.82)}
html.dark-mode .service-objection::before{border-color:rgba(121,195,176,.48);background:linear-gradient(135deg,transparent 0 80%,rgba(121,195,176,.22) 81%),repeating-linear-gradient(180deg,rgba(121,195,176,.14) 0 2px,transparent 2px 25px),linear-gradient(150deg,rgba(121,195,176,.2),rgba(121,195,176,.04));box-shadow:-22px 18px 0 -7px rgba(121,195,176,.1),0 12px 30px rgba(0,0,0,.18)}
html.dark-mode .service-objection::after{border-color:rgba(121,195,176,.68);box-shadow:0 8px 20px rgba(0,0,0,.22)}
html.dark-mode .service-directory::before{background-image:linear-gradient(rgba(230,160,135,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(230,160,135,.14) 1px,transparent 1px)}
html.dark-mode .service-periodic::before{border-color:rgba(174,204,150,.48);box-shadow:0 0 0 28px rgba(174,204,150,.14),0 0 0 58px rgba(174,204,150,.07),0 0 30px rgba(174,204,150,.12)}
html.black-white .service-request::before{background:repeating-linear-gradient(118deg,transparent 0 34px,rgba(255,255,255,.25) 35px 39px,transparent 40px 72px)}
html.black-white .service-request::after{border-color:rgba(255,255,255,.78);background:rgba(255,255,255,.12);box-shadow:-23px -20px 0 -2px rgba(255,255,255,.28),-46px -40px 0 -2px rgba(255,255,255,.14)}
html.black-white .service-objection{--objection-mark:#111;--objection-stamp-bg:rgba(255,255,255,.82)}
html.black-white .service-objection::before{border-color:rgba(0,0,0,.46);background:linear-gradient(135deg,transparent 0 80%,rgba(0,0,0,.18) 81%),repeating-linear-gradient(180deg,rgba(0,0,0,.16) 0 2px,transparent 2px 25px),linear-gradient(150deg,rgba(0,0,0,.16),rgba(0,0,0,.025))}
html.black-white .service-objection::after{border-color:rgba(0,0,0,.72)}
html.black-white .service-directory::before{background-image:linear-gradient(rgba(0,0,0,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.18) 1px,transparent 1px)}
html.black-white .service-directory::after{background:linear-gradient(180deg,transparent,rgba(0,0,0,.08),rgba(0,0,0,.42),rgba(255,255,255,.3),transparent)}
html.black-white .service-periodic::before{border-color:rgba(0,0,0,.56);box-shadow:0 0 0 28px rgba(0,0,0,.14),0 0 0 58px rgba(0,0,0,.07)}
html.black-white .service-periodic::after{background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.88))}
html.reduce-motion .service-card::before,
html.reduce-motion .service-card::after{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .service-card::before,
  .service-card::after{animation:none!important}
}
/* End service card contextual motion */

/* Procurement card document motion */
.procurement-card{
  isolation:isolate;
  overflow:hidden;
}
.procurement-card>*{
  position:relative;
  z-index:2;
}
.procurement-card>.procurement-number{
  position:absolute;
  right:20px;
  top:18px;
}
.procurement-card::before,
.procurement-card::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  will-change:transform,opacity;
}
.procurement-card.procurement-plan{border-top-color:#4f9a86!important}
.procurement-card.procurement-notice{border-top-color:#d8ad55!important}
.procurement-plan .procurement-icon{background:#e1f0ec!important;color:#3c816f!important}
.procurement-notice .procurement-icon{background:#f4ecd9!important;color:#9f6e1d!important}
.procurement-plan .procurement-number{color:#3b806f!important;opacity:.88}
.procurement-notice .procurement-number{color:#94691b!important;opacity:.88}
.procurement-report .procurement-number{color:#a6543b!important;opacity:.88}
.procurement-plan::before{
  right:-25px;
  bottom:-42px;
  width:176px;
  height:214px;
  border:2px solid rgba(50,137,115,.52);
  border-radius:12px;
  background:
    linear-gradient(90deg,rgba(50,137,115,.2) 1px,transparent 1px),
    linear-gradient(rgba(50,137,115,.2) 1px,transparent 1px),
    linear-gradient(145deg,rgba(79,154,134,.22),rgba(79,154,134,.04));
  background-size:24px 24px,24px 24px,auto;
  box-shadow:-22px 18px 0 -7px rgba(79,154,134,.15),0 13px 30px rgba(29,100,82,.14);
  transform-origin:bottom center;
  animation:procurement-plan-sheet 5.2s ease-in-out infinite;
}
.procurement-plan::after{
  right:18px;
  bottom:34px;
  width:128px;
  height:8px;
  border-radius:8px;
  background:repeating-linear-gradient(90deg,rgba(38,119,99,.82) 0 22px,rgba(38,119,99,.17) 22px 31px);
  box-shadow:0 -25px 0 -2px rgba(79,154,134,.36),0 -50px 0 -2px rgba(79,154,134,.23);
  transform-origin:left center;
  animation:procurement-plan-progress 4.2s ease-in-out infinite;
}
.procurement-notice::before{
  right:-18px;
  bottom:-35px;
  width:178px;
  height:218px;
  border:2px solid rgba(184,132,45,.55);
  border-radius:12px;
  background:
    linear-gradient(rgba(184,132,45,.57),rgba(184,132,45,.57)) 18px 20px/104px 13px no-repeat,
    repeating-linear-gradient(180deg,rgba(216,173,85,.2) 0 2px,transparent 2px 26px),
    linear-gradient(150deg,rgba(216,173,85,.23),rgba(216,173,85,.04));
  box-shadow:-19px 17px 0 -6px rgba(216,173,85,.15),0 13px 30px rgba(116,82,22,.14);
  transform-origin:bottom right;
  animation:procurement-notice-publish 4.8s ease-in-out infinite;
}
.procurement-notice::after{
  right:10px;
  bottom:8px;
  width:80px;
  height:67px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 100'%3E%3Cellipse cx='60' cy='92' rx='43' ry='6' fill='%230a4d3d' opacity='.16'/%3E%3Cpolygon points='12,30 60,53 60,91 12,68' fill='%23c98b45' stroke='%23744722' stroke-width='2' stroke-linejoin='round'/%3E%3Cpolygon points='108,30 60,53 60,91 108,68' fill='%23a96734' stroke='%23744722' stroke-width='2' stroke-linejoin='round'/%3E%3Cpolygon points='60,7 108,30 60,53 12,30' fill='%23e2b167' stroke='%23744722' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M12 30 60 7l48 23M60 53V91' fill='none' stroke='%23825329' stroke-width='1.6' opacity='.75'/%3E%3Cpolygon points='51,11 63,16 72,47 60,53 49,48 40,16' fill='%23f1d596' opacity='.96'/%3E%3Cpolygon points='60,53 72,47 72,85 60,91' fill='%23dfbd7a' opacity='.95'/%3E%3Cpath d='M51 11 63 16M49 48l11 5 12-6' fill='none' stroke='%23a9783d' stroke-width='1.4' opacity='.75'/%3E%3Cpath d='M24 49v15m0-15-5 6m5-6 5 10M36 55v15m0-15-5 6m5-6 5 10' fill='none' stroke='%23744722' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' opacity='.78'/%3E%3C/svg%3E") center/contain no-repeat;
  filter:drop-shadow(0 10px 10px rgba(29,85,68,.24));
  transform-origin:bottom center;
  animation:procurement-notice-box 4.8s cubic-bezier(.2,.75,.25,1) infinite;
}
.procurement-report::before{
  right:-28px;
  bottom:-46px;
  width:174px;
  height:218px;
  border:2px solid rgba(186,91,60,.55);
  border-radius:12px;
  background:
    linear-gradient(rgba(186,91,60,.56),rgba(186,91,60,.56)) 19px 20px/88px 12px no-repeat,
    repeating-linear-gradient(180deg,rgba(201,116,84,.2) 0 2px,transparent 2px 25px),
    linear-gradient(148deg,rgba(201,116,84,.22),rgba(201,116,84,.045));
  box-shadow:-18px 15px 0 -5px rgba(201,116,84,.2),-36px 29px 0 -10px rgba(201,116,84,.11),0 13px 30px rgba(121,57,35,.14);
  animation:procurement-report-stack 5s ease-in-out infinite;
}
.procurement-report::after{
  right:27px;
  bottom:19px;
  width:116px;
  height:148px;
  border:2px solid rgba(186,91,60,.62);
  border-radius:10px;
  background:
    linear-gradient(rgba(186,91,60,.42),rgba(186,91,60,.42)) 16px 18px/66px 9px no-repeat,
    repeating-linear-gradient(180deg,rgba(201,116,84,.18) 0 2px,transparent 2px 23px),
    rgba(255,250,246,.52);
  transform-origin:bottom right;
  animation:procurement-report-page 5s ease-in-out infinite;
}
@keyframes procurement-plan-sheet{
  0%,100%{transform:translate3d(10px,22px,0) rotate(6deg);opacity:.64}
  50%{transform:translate3d(-5px,-8px,0) rotate(2deg);opacity:1}
}
@keyframes procurement-plan-progress{
  0%,100%{transform:scaleX(.42);opacity:.58}
  50%{transform:scaleX(1);opacity:1}
}
@keyframes procurement-notice-publish{
  0%,100%{transform:translate3d(12px,28px,0) rotate(7deg);opacity:.62}
  45%,78%{transform:translate3d(-5px,-8px,0) rotate(2deg);opacity:1}
}
@keyframes procurement-notice-box{
  0%,100%{transform:translate3d(0,5px,0) rotate(-2deg) scale(.97);opacity:.9}
  48%{transform:translate3d(-4px,-7px,0) rotate(1.5deg) scale(1.03);opacity:1}
  58%{transform:translate3d(-3px,-5px,0) rotate(.5deg) scale(1.01);opacity:1}
}
@keyframes procurement-report-stack{
  0%,100%{transform:translate3d(8px,18px,0) rotate(5deg);opacity:.68}
  50%{transform:translate3d(-5px,-7px,0) rotate(1deg);opacity:1}
}
@keyframes procurement-report-page{
  0%,100%{transform:perspective(420px) rotateY(-14deg) translate3d(12px,12px,0);opacity:.6}
  50%{transform:perspective(420px) rotateY(7deg) translate3d(-8px,-10px,0);opacity:1}
}
html.dark-mode .procurement-plan{border-top-color:#4f9a86!important}
html.dark-mode .procurement-notice{border-top-color:#dcb85e!important}
html.dark-mode .procurement-plan .procurement-icon{background:#123e36!important;color:#79c3b0!important}
html.dark-mode .procurement-notice .procurement-icon{background:#3d3523!important;color:#e3bd61!important}
html.dark-mode .procurement-plan .procurement-number{color:#88cdbc!important;opacity:.9}
html.dark-mode .procurement-notice .procurement-number{color:#dfc46f!important;opacity:.9}
html.dark-mode .procurement-report .procurement-number{color:#e4a087!important;opacity:.9}
html.dark-mode .procurement-plan::before{border-color:rgba(121,195,176,.5);background-image:linear-gradient(90deg,rgba(121,195,176,.18) 1px,transparent 1px),linear-gradient(rgba(121,195,176,.18) 1px,transparent 1px),linear-gradient(145deg,rgba(121,195,176,.17),rgba(121,195,176,.025))}
html.dark-mode .procurement-plan::after{background:repeating-linear-gradient(90deg,rgba(121,195,176,.8) 0 22px,rgba(121,195,176,.16) 22px 31px)}
html.dark-mode .procurement-notice::before{border-color:rgba(220,184,94,.5);background:linear-gradient(rgba(220,184,94,.52),rgba(220,184,94,.52)) 18px 20px/104px 13px no-repeat,repeating-linear-gradient(180deg,rgba(220,184,94,.17) 0 2px,transparent 2px 26px),linear-gradient(150deg,rgba(220,184,94,.17),rgba(220,184,94,.025))}
html.dark-mode .procurement-notice::after{filter:drop-shadow(0 10px 12px rgba(0,0,0,.4)) brightness(1.08) saturate(.9)}
html.dark-mode .procurement-report::before{border-color:rgba(230,160,135,.5);background:linear-gradient(rgba(230,160,135,.5),rgba(230,160,135,.5)) 19px 20px/88px 12px no-repeat,repeating-linear-gradient(180deg,rgba(230,160,135,.17) 0 2px,transparent 2px 25px),linear-gradient(148deg,rgba(230,160,135,.16),rgba(230,160,135,.025))}
html.dark-mode .procurement-report::after{border-color:rgba(230,160,135,.58);background:linear-gradient(rgba(230,160,135,.4),rgba(230,160,135,.4)) 16px 18px/66px 9px no-repeat,repeating-linear-gradient(180deg,rgba(230,160,135,.15) 0 2px,transparent 2px 23px),rgba(49,31,27,.68)}
html.black-white .procurement-card::before,
html.black-white .procurement-card::after{filter:grayscale(1) contrast(1.45)}
html.reduce-motion .procurement-card::before,
html.reduce-motion .procurement-card::after{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .procurement-card::before,
  .procurement-card::after{animation:none!important}
}
/* End procurement card document motion */

/* Preserve viewport scrolling so the navigation header can remain sticky. */
html{
  overflow-x:clip!important;
  overflow-y:auto!important;
}
body{
  overflow-x:clip!important;
  overflow-y:visible!important;
}
.site-header{
  position:sticky!important;
  top:0!important;
  z-index:20!important;
}
body.menu-open .site-header{z-index:40!important}

@media(min-width:1101px){
  .topbar{
    position:sticky!important;
    top:0!important;
    z-index:30!important;
  }
  .topbar-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 58px 260px;
    gap:0 12px;
    height:37px!important;
    min-height:37px!important;
  }
  .topbar-inner>span{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .topbar-theme-switch{
    position:relative;
    left:auto;
    top:auto;
    flex:0 0 58px;
    margin-left:0;
    justify-self:center;
    transform:none;
  }
  .topbar-inner time,
  .topbar-inner #live-datetime{
    width:260px;
    margin-left:0;
    justify-self:end;
    text-align:right;
    white-space:nowrap;
  }
  .site-header{top:37px!important}
  body.admin-bar .topbar{top:32px!important}
  body.admin-bar .site-header{top:69px!important}
}

.hero-copy::before{display:none!important}

@media(max-width:650px){
  .main-nav{
    grid-template-columns:1fr!important;
    gap:2px!important;
    max-height:calc(100vh - 72px)!important;
    max-height:calc(100dvh - 72px)!important;
    padding:10px 16px 14px!important;
  }
  .main-nav>a:not(.nav-cta){
    min-height:39px;
    padding:7px 10px!important;
  }
  .site-search{margin-top:6px!important}
}

/* Link Terkait — continuously scrolling government portal logos. */
.related-section{
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 20%,rgba(216,173,85,.14),transparent 25rem),
    linear-gradient(180deg,#f7f4eb,#eef3ec);
}
.related-section .section-heading{margin-bottom:34px}
.related-marquee{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:6px 0 18px;
  cursor:grab;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.related-marquee.is-dragging{cursor:grabbing}
.related-marquee.is-dragging .related-track{animation-play-state:paused!important}
.related-track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:related-marquee 26s linear infinite;
}
.related-group{
  display:flex;
  align-items:stretch;
  gap:22px;
  padding-right:22px;
}
.related-link{
  position:relative;
  width:250px;
  height:154px;
  display:grid;
  place-items:center;
  flex:0 0 250px;
  padding:18px 24px;
  overflow:hidden;
  border:1px solid #d8dfda;
  border-radius:13px;
  background:#fff!important;
  box-shadow:0 10px 25px rgba(8,47,43,.09);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.related-link:hover,
.related-link:focus-visible{
  transform:translateY(-5px);
  border-color:#d8ad55;
  box-shadow:0 16px 32px rgba(8,47,43,.15);
  outline:none;
}
.related-link:focus-visible{box-shadow:0 0 0 4px rgba(216,173,85,.32),0 16px 32px rgba(8,47,43,.15)}
.related-link img{
  position:absolute;
  inset:16px 20px;
  display:block;
  width:calc(100% - 40px);
  height:calc(100% - 32px);
  max-width:none;
  max-height:none;
  object-fit:contain;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
}
.related-marquee:hover .related-track,
.related-marquee:focus-within .related-track{animation-play-state:paused}
html.dark-mode .related-section{
  background:
    radial-gradient(circle at 12% 20%,rgba(216,173,85,.1),transparent 25rem),
    linear-gradient(180deg,#082f2b,#06231f)!important;
}
html.dark-mode .related-section .section-heading h2{color:#f5f2e8!important}
html.dark-mode .related-section .section-heading>p:last-child{color:#c4d7cf!important}
html.dark-mode .related-link{
  background:#fff!important;
  border-color:rgba(216,173,85,.55)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.3);
}
@keyframes related-marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
html.reduce-motion .related-track{animation:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){
  .related-track{animation:none;transform:none}
}
@media(max-width:900px){
  .related-section .section-heading{margin-bottom:27px}
  .related-marquee{padding-bottom:12px}
  .related-link{width:220px;height:138px;flex-basis:220px;padding:16px 21px}
  .related-group{gap:16px;padding-right:16px}
}
@media(max-width:650px){
  .related-section{padding:62px 0}
  .related-section .section-heading{margin-bottom:22px}
  .related-marquee{
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  }
  .related-link{width:184px;height:122px;flex-basis:184px;padding:14px 18px;border-radius:11px}
  .related-track{animation-duration:22s}
}

/* Light-mode readability: keep small text at AA-friendly contrast on ivory surfaces. */
html:not(.dark-mode){--muted:#526a61}
html:not(.dark-mode) .hero-copy::before{color:#86541f!important}
html:not(.dark-mode) .hero .eyebrow{color:#2f6256!important}
html:not(.dark-mode) .hero-note{color:#3f6359!important}
html:not(.dark-mode) .hero .check{color:#86541f!important}
html:not(.dark-mode) .section-heading .eyebrow,
html:not(.dark-mode) .about-copy .eyebrow,
html:not(.dark-mode) .stats-intro .eyebrow,
html:not(.dark-mode) .main-nav .official-nav-link{color:#9a4e35!important}
html:not(.dark-mode) .hero-panel .panel-top p{color:#f6bea6!important}
html:not(.dark-mode) .section-heading h2 em,
html:not(.dark-mode) .stats-intro h2 em,
html:not(.dark-mode) .about-copy h2 em{color:#9a4e35!important}
html:not(.dark-mode) .date,
html:not(.dark-mode) .procurement-note{color:#526a61!important}
html:not(.dark-mode) .service-card:not(.featured) .service-go,
html:not(.dark-mode) .procurement-card .service-go{color:#9a4e35!important}
html:not(.dark-mode) .site-search input::placeholder{
  color:#526a61!important;
  opacity:1;
}

/* Keep the status bar calm and legible on tablets and phones. */
@media(max-width:1100px){
  .topbar-inner{
    justify-content:center!important;
    min-height:38px!important;
    height:auto!important;
    padding:7px 0!important;
    text-align:center;
  }
  .topbar-theme-switch{
    left:0;
    transform:translateY(-50%);
  }
  .site-header .topbar-theme-switch{
    position:relative;
    left:auto;
    top:auto;
    z-index:auto;
    flex:0 0 58px;
    margin-left:auto;
    transform:none;
  }
  html:not(.dark-mode) .site-header .topbar-theme-switch .theme-switch-track{
    border-color:#bcc8c5;
    background:#dfe6e4;
    box-shadow:inset 0 1px 4px rgba(8,47,43,.18);
  }
  html:not(.dark-mode) .site-header .topbar-theme-switch .theme-track-icon-moon{color:#65778a}
  .topbar-inner time,
  .topbar-inner #live-datetime{display:none!important}
  .topbar-inner>span{
    display:flex!important;
    min-width:0;
    max-width:100%;
    align-items:center;
    justify-content:center;
    font-size:0!important;
    line-height:1;
    white-space:nowrap;
  }
  .topbar-inner>span::after{
    content:"Portal PPID Kemenag Paser \00b7  v0.5.0";
    font-size:.72rem;
    font-weight:600;
    line-height:1.3;
    letter-spacing:.02em;
  }
}