:root{
  --ink:#08111f;
  --navy:#071a33;
  --blue:#1266e3;
  --cyan:#27c8ff;
  --paper:#f6f8fb;
  --white:#fff;
  --muted:#657184;
  --line:#dfe5ed;
  --radius:24px;
  --container:1240px
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'DM Sans',sans-serif;
  line-height:1.65
}
body.menu-open{
  overflow:hidden
}
img{
  max-width:100%;
  display:block
}
a{
  text-decoration:none;
  color:inherit
}
.container{
  width:min(calc(100% - 48px),var(--container));
  margin:auto
}
.progress{
  position:fixed;
  z-index:9999;
  top:0;
  left:0;
  height:3px;
  background:var(--cyan);
  width:0;
  box-shadow:0 0 15px rgba(39,200,255,.8)
}
.site-header{
  position:fixed;
  z-index:1000;
  top:0;
  left:0;
  right:0;
  padding:18px 0;
  transition:.35s
}
.site-header.scrolled{
  padding:10px 0;
  background:rgba(7,17,31,.86);
  backdrop-filter:blur(18px);
  box-shadow:0 10px 35px rgba(0,0,0,.12)
}
.nav-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}
.brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:#fff
}
.brand-symbol{
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.42);
  display:grid;
  place-items:center;
  transform:rotate(45deg);
  border-radius:9px;
  background:rgba(255,255,255,.05)
}
.brand-symbol span{
  font:800 13px/1 Manrope;
  transform:rotate(-45deg);
  letter-spacing:-1px
}
.brand-name{
  display:flex;
  flex-direction:column;
  line-height:1
}
.brand-name strong{
  font:800 14px Manrope;
  letter-spacing:.08em
}
.brand-name small{
  font:600 9px Manrope;
  letter-spacing:.32em;
  margin-top:5px;
  opacity:.7
}
.nav-menu{
  display:flex;
  align-items:center;
  gap:27px;
  color:#fff;
  font-size:13px;
  font-weight:600
}
.nav-menu>a,.nav-dropdown>a{
  position:relative;
  padding:9px 0;
  opacity:.82
}
.nav-menu>a.active,.nav-dropdown>a.active,.nav-menu>a:hover,.nav-dropdown>a:hover{
  opacity:1
}
.nav-menu>a.active:after,.nav-dropdown>a.active:after{
  content:'';
  position:absolute;
  left:0;
  right:50%;
  bottom:1px;
  height:2px;
  background:var(--cyan)
}
.nav-dropdown{
  position:relative
}
.nav-dropdown>a{
  display:flex;
  align-items:center;
  gap:7px
}
.nav-dropdown i{
  font-size:9px
}
.dropdown-menu{
  position:absolute;
  top:40px;
  right:-15px;
  width:330px;
  padding:10px;
  background:rgba(8,17,31,.96);
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:.25s
}
.nav-dropdown:hover .dropdown-menu,
.nav-dropdown.open .dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:none
}
.dropdown-menu a{
  display:flex;
  gap:15px;
  padding:14px;
  border-radius:10px;
  color:#dce6f4;
  font-size:12px
}
.dropdown-menu a:hover{
  background:rgba(255,255,255,.07);
  color:#fff
}
.dropdown-menu span{
  color:var(--cyan);
  font-family:Manrope
}
.nav-pill{
  background:#fff;
  color:var(--ink)!important;
  padding:11px 17px!important;
  border-radius:999px;
  opacity:1!important
}
.nav-pill i{
  font-size:10px;
  margin-left:8px
}
.nav-toggle{
  display:none;
  background:none;
  border:0;
  color:#fff;
  width:42px;
  height:42px
}
.nav-toggle span{
  display:block;
  width:24px;
  height:2px;
  background:#fff;
  margin:6px auto
}
.hero-v3{
  height:100vh;
  min-height:720px;
  position:relative;
  overflow:hidden;
  background:#06101d;
  color:#fff
}
.hero-v3-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center
}
.hero-v3-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(3,13,25,.94) 0%,rgba(3,13,25,.68) 38%,rgba(3,13,25,.12) 78%),linear-gradient(0deg,rgba(3,13,25,.52),transparent 45%)
}
.hero-grid-lines,.tech-lines{
  position:absolute;
  inset:0;
  opacity:.16;
  background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:linear-gradient(90deg,#000,transparent 80%)
}
.hero-v3-inner{
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
  padding-top:55px
}
.hero-v3-kicker,.eyebrow-v3{
  font:700 11px Manrope;
  letter-spacing:.18em;
  text-transform:uppercase
}
.hero-v3-kicker{
  color:#dce8f7;
  margin-bottom:25px
}
.hero-v3-kicker b{
  color:var(--cyan);
  padding:0 9px
}
.live-dot{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#56e7a5;
  box-shadow:0 0 0 5px rgba(86,231,165,.12);
  margin-right:9px
}
.hero-v3 h1{
  font:800 clamp(52px,7vw,105px)/.94 Manrope;
  letter-spacing:-.065em;
  margin:0;
  max-width:950px
}
.hero-v3 h1 em,.mega-cta h2 em,.tech-v3 h2 em,.section-heading-v3 h2 em,.intro-v3 h2 em,.inner-hero h1 em,.about-story h2 em,.principles-v3 h2 em,.people-v3 h2 em{
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.85)
}
.hero-v3-lead{
  max-width:590px;
  color:#d1dbe8;
  font-size:17px;
  margin:28px 0
}
.hero-v3-actions{
  display:flex;
  align-items:center;
  gap:15px
}
.btn-v3{
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:14px 19px;
  border-radius:999px;
  font-weight:700;
  font-size:13px
}
.btn-v3.primary{
  background:#fff;
  color:var(--ink)
}
.btn-v3 i{
  font-size:11px
}
.round-link{
  width:49px;
  height:49px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:12px
}
.hero-float-card{
  position:absolute;
  right:2%;
  bottom:19%;
  width:150px;
  padding:20px;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(15px);
  border-radius:18px
}
.hero-float-card small{
  display:block;
  color:#a8b7ca;
  font:700 9px Manrope;
  letter-spacing:.2em
}
.hero-float-card strong{
  display:block;
  font:800 46px Manrope;
  letter-spacing:-.06em
}
.hero-float-card span{
  font-size:11px;
  color:#c8d4e2
}
.hero-coordinates{
  position:absolute;
  right:0;
  bottom:42px;
  font:600 10px Manrope;
  letter-spacing:.16em;
  color:#aebccc
}
.ticker{
  overflow:hidden;
  background:#0a1728;
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.08)
}
.ticker-track{
  white-space:nowrap;
  display:flex;
  align-items:center;
  gap:35px;
  width:max-content;
  padding:15px 0;
  animation:marquee 30s linear infinite;
  font:700 10px Manrope;
  letter-spacing:.18em
}
.ticker i{
  color:var(--cyan);
  font-style:normal
}
@keyframes marquee{
  to{
    transform:translateX(-50%)
  }
}
.section-v3{
  padding:125px 0
}
.eyebrow-v3{
  color:var(--blue);
  display:flex;
  align-items:center;
  gap:14px
}
.eyebrow-v3 span{
  color:#778295
}
.eyebrow-v3.light{
  color:var(--cyan)
}
.eyebrow-v3.light span{
  color:#b5c4d6
}
.intro-v3{
  background:#fff
}
.intro-v3-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:90px;
  margin-top:42px
}
.intro-v3 h2,.section-heading-v3 h2,.tech-v3 h2,.about-story h2,.principles-v3 h2,.people-v3 h2{
  font:800 clamp(42px,5vw,72px)/.98 Manrope;
  letter-spacing:-.055em;
  margin:0
}
.intro-v3 h2 em,.section-heading-v3 h2 em,.about-story h2 em,.principles-v3 h2 em,.people-v3 h2 em{
  color:#1767d9;
  -webkit-text-stroke:0
}
.intro-v3-copy{
  font-size:16px;
  color:#5d697a
}
.intro-v3-copy p{
  margin:0 0 18px
}
.arrow-link{
  display:inline-flex;
  align-items:center;
  gap:20px;
  margin-top:20px;
  font-weight:800;
  font-size:13px
}
.arrow-link span{
  font-size:20px;
  color:var(--blue)
}
.section-heading-v3{
  display:flex;
  justify-content:space-between;
  gap:60px;
  align-items:end;
  margin-bottom:50px
}
.section-heading-v3>p{
  max-width:400px;
  color:#667386;
  margin:0
}
.bento-section{
  background:#f1f4f8
}
.bento-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr;
  grid-template-rows:300px 300px;
  gap:18px
}
.bento{
  position:relative;
  border-radius:26px;
  overflow:hidden;
  color:#fff;
  display:block
}
.bento-main{
  grid-row:span 2
}
.bento img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s
}
.bento:hover img{
  transform:scale(1.04)
}
.bento-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(4,12,23,.88),rgba(4,12,23,.03) 65%)
}
.bento-content{
  position:absolute;
  left:30px;
  right:30px;
  bottom:27px
}
.bento-content span,.bento-blue>span{
  font:700 10px Manrope;
  letter-spacing:.17em;
  color:#b7c5d8
}
.bento h3{
  font:800 34px/1.03 Manrope;
  letter-spacing:-.04em;
  margin:10px 0
}
.bento-content i,.bento>i{
  position:absolute;
  right:28px;
  bottom:30px
}
.bento-blue{
  background:#1266e3;
  padding:30px;
  overflow:hidden
}
.bento-blue h3{
  font-size:38px;
  margin-top:18px
}
.bento-blue>i{
  color:#fff
}
.orb{
  position:absolute;
  width:230px;
  height:230px;
  border-radius:50%;
  right:-30px;
  bottom:-50px;
  border:1px solid rgba(255,255,255,.3);
  box-shadow:0 0 0 35px rgba(255,255,255,.035),0 0 0 70px rgba(255,255,255,.025)
}
.orb span{
  position:absolute;
  width:9px;
  height:9px;
  background:#fff;
  border-radius:50%;
  left:38px;
  top:45px;
  box-shadow:0 0 25px 7px rgba(255,255,255,.5)
}
.bento-image{
  grid-column:2
}
.dark-v3{
  background:#06101d;
  color:#fff;
  position:relative;
  overflow:hidden
}
.tech-v3-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:90px;
  align-items:center;
  position:relative
}
.tech-v3 p{
  color:#aebbc9;
  max-width:520px;
  margin:28px 0
}
.light-btn{
  border:1px solid rgba(255,255,255,.25);
  color:#fff
}
.tech-visual{
  height:520px;
  position:relative;
  border-radius:28px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14)
}
.tech-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.8) contrast(1.05)
}
.tech-visual:after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,rgba(8,25,48,.25),rgba(0,172,255,.08))
}
.scan-line{
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  height:1px;
  background:#55ddff;
  box-shadow:0 0 20px 2px rgba(85,221,255,.8);
  top:20%;
  animation:scan 5s ease-in-out infinite
}
@keyframes scan{
  50%{
    top:80%
  }
}
.tech-tag{
  position:absolute;
  z-index:3;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.3);
  background:rgba(4,14,26,.65);
  backdrop-filter:blur(10px);
  font:700 9px Manrope;
  letter-spacing:.12em
}
.tag-a{
  top:18%;
  left:8%
}
.tag-b{
  top:55%;
  right:8%
}
.tag-c{
  bottom:12%;
  left:20%
}
.numbers-v3{
  padding:0;
  background:#fff
}
.numbers-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-left:1px solid var(--line);
  border-right:1px solid var(--line)
}
.numbers-grid>div{
  padding:45px 30px;
  border-right:1px solid var(--line)
}
.numbers-grid>div:last-child{
  border:0
}
.numbers-grid strong{
  display:block;
  font:800 50px Manrope;
  letter-spacing:-.06em;
  color:var(--blue)
}
.numbers-grid span{
  display:block;
  color:#6a7586;
  font-size:12px;
  max-width:160px;
  margin-top:7px
}
.track-v3{
  background:#f6f8fb
}
.track-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px
}
.track-img{
  height:300px;
  position:relative;
  border-radius:20px;
  overflow:hidden;
  margin-bottom:20px
}
.track-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.5s
}
.track-grid article:hover img{
  transform:scale(1.04)
}
.track-img span{
  position:absolute;
  left:14px;
  top:14px;
  background:#fff;
  padding:7px 10px;
  border-radius:99px;
  font:700 10px Manrope
}
.track-grid small{
  font:700 9px Manrope;
  letter-spacing:.12em;
  color:#718096
}
.track-grid h3{
  font:800 24px/1.1 Manrope;
  letter-spacing:-.03em;
  margin:9px 0
}
.mega-cta{
  background:#1266e3;
  color:#fff;
  padding:125px 0;
  position:relative;
  overflow:hidden
}
.mega-cta:after{
  content:'IBU';
  position:absolute;
  right:-40px;
  bottom:-140px;
  font:800 400px/1 Manrope;
  color:rgba(255,255,255,.04);
  letter-spacing:-.1em
}
.mega-cta-inner{
  position:relative;
  z-index:2
}
.mega-cta h2{
  font:800 clamp(55px,8vw,105px)/.9 Manrope;
  letter-spacing:-.07em;
  margin:25px 0 50px
}
.mega-arrow{
  display:inline-flex;
  align-items:center;
  gap:22px;
  border-bottom:1px solid rgba(255,255,255,.5);
  padding-bottom:12px;
  font-weight:700
}
.mega-arrow i{
  font-size:12px
}
.site-footer{
  background:#06101d;
  color:#fff;
  padding:80px 0 20px
}
.footer-top{
  display:grid;
  grid-template-columns:1.4fr .6fr .9fr;
  gap:70px;
  padding-bottom:70px
}
.footer-brand p{
  max-width:370px;
  color:#9eacbd;
  font-size:13px;
  margin-top:25px
}
.footer-links,.footer-contact{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px
}
.footer-links>span,.footer-contact>span{
  font:700 9px Manrope;
  letter-spacing:.2em;
  color:#5c9af0;
  margin-bottom:10px
}
.footer-links a,.footer-contact a,.footer-contact p{
  font-size:12px;
  color:#b9c4d2;
  margin:0
}
.footer-links a:hover,.footer-contact a:hover{
  color:#fff
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  color:#637286;
  font:600 9px Manrope;
  letter-spacing:.08em
}
.inner-hero{
  min-height:620px;
  padding:190px 0 100px;
  background:linear-gradient(115deg,#06101d,#0d3565 65%,#1266e3);
  color:#fff;
  position:relative;
  overflow:hidden
}
.inner-hero:after{
  content:'';
  position:absolute;
  inset:0;
  opacity:.12;
  background-image:linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px);
  background-size:70px 70px
}
.inner-hero .container{
  position:relative;
  z-index:2
}
.inner-hero h1{
  font:800 clamp(54px,7vw,100px)/.94 Manrope;
  letter-spacing:-.065em;
  margin:25px 0
}
.inner-hero p{
  max-width:600px;
  color:#c8d7e8;
  font-size:17px
}
.inner-hero-about{
  background:linear-gradient(115deg,rgba(3,14,28,.94),rgba(3,36,67,.6)),url('../img/fieldwork.jpg') center/cover
}
.inner-hero-projects{
  background:linear-gradient(115deg,rgba(3,14,28,.94),rgba(3,36,67,.58)),url('../img/survey-forest.jpg') center/cover
}
.services-v3{
  background:#fff
}
.services-v3.alt{
  background:#edf3fa
}
.service-v3-row{
  display:grid;
  grid-template-columns:90px 1fr 44%;
  gap:50px;
  align-items:center
}
.service-index{
  font:800 80px Manrope;
  color:#d6dee9;
  letter-spacing:-.08em;
  align-self:start
}
.service-v3-copy>span{
  font:700 10px Manrope;
  letter-spacing:.15em;
  color:var(--blue)
}
.service-v3-copy h2{
  font:800 clamp(40px,5vw,68px)/.95 Manrope;
  letter-spacing:-.055em;
  margin:18px 0
}
.service-v3-copy p{
  color:#667386;
  max-width:590px
}
.service-v3-copy ul{
  padding-left:18px;
  color:#566274;
  font-size:13px
}
.service-v3-copy li{
  margin:7px 0
}
.service-v3-media{
  height:470px;
  border-radius:26px;
  overflow:hidden
}
.service-v3-media img{
  width:100%;
  height:100%;
  object-fit:cover
}
.about-story{
  background:#fff
}
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px
}
.about-grid h2{
  margin-top:25px
}
.about-grid p{
  color:#5d697a;
  font-size:16px
}
.vision-v3{
  background:#071a33;
  color:#fff
}
.vision-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}
.vision-card,.mission-card{
  padding:45px;
  border-radius:25px;
  min-height:350px
}
.vision-card{
  background:#1266e3
}
.mission-card{
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.03)
}
.vision-card span,.mission-card span{
  font:700 10px Manrope;
  letter-spacing:.18em;
  color:#b8c9dc
}
.vision-card h2,.mission-card h2{
  font:800 31px/1.12 Manrope;
  letter-spacing:-.04em;
  margin-top:70px
}
.principles-v3{
  background:#fff
}
.principles-v3> .container>h2{
  margin:25px 0 60px
}
.principle-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line)
}
.principle-grid>div{
  padding:28px 25px 30px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.principle-grid>div:nth-child(3n){
  border-right:0
}
.principle-grid b{
  font:800 11px Manrope;
  color:var(--blue)
}
.principle-grid h3{
  font:800 22px Manrope;
  margin:15px 0 8px
}
.principle-grid p{
  font-size:13px;
  color:#697486;
  margin:0
}
.people-v3{
  background:#071a33;
  color:#fff
}
.people-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center
}
.people-v3 p{
  color:#aebbc9;
  max-width:540px;
  margin-top:28px
}
.people-grid>img{
  width:100%;
  border-radius:25px;
  background:#fff;
  padding:20px
}
.project-list-v3{
  background:#fff
}
.project-list-head{
  display:grid;
  grid-template-columns:80px 1fr 180px;
  color:#8792a2;
  font:700 9px Manrope;
  letter-spacing:.15em;
  padding:0 0 14px;
  border-bottom:1px solid var(--line)
}
.project-row{
  display:grid;
  grid-template-columns:80px 1fr 180px;
  align-items:center;
  min-height:170px;
  border-bottom:1px solid var(--line);
  gap:20px
}
.project-no{
  font:800 17px Manrope;
  color:#b7c1cf
}
.project-main{
  display:flex;
  align-items:center;
  gap:25px
}
.project-thumb{
  width:145px;
  height:100px;
  border-radius:15px;
  overflow:hidden;
  flex:none
}
.project-thumb img{
  width:100%;
  height:100%;
  object-fit:cover
}
.project-main small{
  font:700 9px Manrope;
  letter-spacing:.12em;
  color:var(--blue)
}
.project-main h2{
  font:800 22px/1.1 Manrope;
  letter-spacing:-.03em;
  margin:8px 0;
  max-width:650px
}
.project-period{
  font:700 12px Manrope;
  color:#657184
}
.contact-v3{
  background:#06101d;
  color:#fff;
  padding:190px 0 125px;
  position:relative;
  overflow:hidden
}
.contact-orb{
  position:absolute;
  width:600px;
  height:600px;
  border-radius:50%;
  right:-180px;
  top:-180px;
  background:radial-gradient(circle at 35% 35%,rgba(39,200,255,.45),rgba(18,102,227,.1) 45%,transparent 68%);
  filter:blur(2px)
}
.contact-grid-v3{
  position:relative;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:90px;
  align-items:center
}
.contact-v3 h1{
  font:800 clamp(60px,8vw,110px)/.9 Manrope;
  letter-spacing:-.07em;
  margin:25px 0
}
.contact-v3 h1 em{
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.8)
}
.contact-v3> .container>div>p{
  color:#b0bdcc;
  max-width:570px;
  font-size:16px
}
.contact-big{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin-top:35px
}
.contact-big a{
  font:700 clamp(18px,2vw,25px) Manrope;
  color:#fff
}
.contact-card-v3{
  padding:38px;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(20px);
  border-radius:25px
}
.contact-card-v3>span{
  font:700 9px Manrope;
  letter-spacing:.18em;
  color:var(--cyan)
}
.contact-card-v3 h2{
  font:800 23px Manrope;
  margin:20px 0
}
.contact-card-v3 p{
  color:#bac6d4;
  font-size:14px;
  margin-bottom:28px
}
.contact-bottom{
  background:#fff
}
.contact-reasons{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:50px
}
.contact-reasons>div{
  padding:30px;
  border-left:1px solid var(--line)
}
.contact-reasons>div:last-child{
  border-right:1px solid var(--line)
}
.contact-reasons b{
  font:800 11px Manrope;
  color:var(--blue)
}
.contact-reasons h3{
  font:800 22px Manrope;
  margin:15px 0 7px
}
.contact-reasons p{
  font-size:13px;
  color:#697486;
  margin:0
}
@media(max-width:980px){
  .container{
    width:min(calc(100% - 34px),var(--container))
  }
  .nav-toggle{
    display:block
  }
  .nav-menu{
    position:fixed;
    inset:0;
    background:rgba(5,15,28,.98);
    backdrop-filter:blur(20px);
    padding:110px 30px 30px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    transform:translateX(100%);
    transition:.35s
  }
  .nav-menu.open{
    transform:none
  }
  .nav-menu>a,.nav-dropdown>a{
    font-size:20px;
    width:100%;
    padding:12px 0
  }
  .nav-pill{
    margin-top:15px!important;
    width:auto!important;
    font-size:13px!important;
    padding:13px 18px!important
  }
  .dropdown-menu{
    position:static;
    width:100%;
    display:none;
    opacity:1;
    visibility:visible;
    transform:none;
    background:transparent;
    box-shadow:none;
    border:0;
    padding:4px 0
  }
  .nav-dropdown:hover .dropdown-menu{
    display:block
  }
  .dropdown-menu a{
    font-size:12px
  }
  .hero-v3{
    min-height:760px
  }
  .hero-v3 h1{
    font-size:clamp(48px,10vw,82px)
  }
  .hero-float-card{
    right:0;
    bottom:22%
  }
  .intro-v3-grid,.tech-v3-grid,.about-grid,.people-grid,.contact-grid-v3{
    grid-template-columns:1fr;
    gap:45px
  }
  .section-v3{
    padding:90px 0
  }
  .bento-grid{
    grid-template-columns:1fr;
    grid-template-rows:380px 280px 280px
  }
  .bento-main{
    grid-row:auto
  }
  .bento-image{
    grid-column:auto
  }
  .tech-visual{
    height:400px
  }
  .numbers-grid{
    grid-template-columns:repeat(2,1fr)
  }
  .numbers-grid>div:nth-child(2){
    border-right:0
  }
  .numbers-grid>div:nth-child(-n+2){
    border-bottom:1px solid var(--line)
  }
  .track-grid{
    grid-template-columns:1fr
  }
  .track-img{
    height:350px
  }
  .footer-top{
    grid-template-columns:1fr 1fr
  }
  .footer-contact{
    grid-column:span 2
  }
  .service-v3-row{
    grid-template-columns:60px 1fr
  }
  .service-v3-media{
    grid-column:2;
    height:360px
  }
  .project-list-head{
    grid-template-columns:60px 1fr 130px
  }
  .project-row{
    grid-template-columns:60px 1fr 130px
  }
  .project-thumb{
    width:110px;
    height:80px
  }
  .project-main h2{
    font-size:18px
  }
  .contact-reasons{
    grid-template-columns:1fr
  }
  .contact-reasons>div{
    border-right:1px solid var(--line)!important
  }
  .vision-grid{
    grid-template-columns:1fr
  }
}
@media (min-width:621px) and (max-width:980px){
  .hero-light h1{
    font-size:44px;
    line-height:1.01;
    letter-spacing:-.05em
  }
  .hero-kicker,.eyebrow-light{
    font-size:9.5px;
    letter-spacing:.17em
  }
  .hero-kicker{
    margin-bottom:14px
  }
  .hero-kicker span{
    width:34px
  }
  .hero-light-copy>p{
    max-width:560px;
    font-size:14px;
    line-height:1.52;
    margin:18px 0 24px
  }
}
@media(max-width:620px){
  .container{
    width:calc(100% - 28px)
  }
  .brand-name strong{
    font-size:12px
  }
  .brand-symbol{
    width:38px;
    height:38px
  }
  .hero-v3{
    min-height:700px
  }
  .hero-v3-inner{
    padding-top:70px
  }
  .hero-v3 h1{
    font-size:48px
  }
  .hero-v3-lead{
    font-size:14px
  }
  .hero-float-card{
    display:none
  }
  .hero-coordinates{
    font-size:8px;
    bottom:20px
  }
  .section-v3{
    padding:70px 0
  }
  .intro-v3 h2,.section-heading-v3 h2,.tech-v3 h2,.about-story h2,.principles-v3 h2,.people-v3 h2{
    font-size:40px
  }
  .section-heading-v3{
    display:block
  }
  .section-heading-v3>a{
    margin-top:20px
  }
  .bento-grid{
    grid-template-rows:350px 280px 280px
  }
  .bento h3{
    font-size:28px
  }
  .numbers-grid{
    grid-template-columns:1fr
  }
  .numbers-grid>div{
    border-right:0!important;
    border-bottom:1px solid var(--line)!important
  }
  .numbers-grid>div:last-child{
    border-bottom:0!important
  }
  .track-img{
    height:270px
  }
  .footer-top{
    grid-template-columns:1fr;
    gap:40px
  }
  .footer-contact{
    grid-column:auto
  }
  .footer-bottom{
    flex-direction:column;
    gap:8px
  }
  .inner-hero{
    min-height:560px;
    padding:160px 0 70px
  }
  .inner-hero h1{
    font-size:51px
  }
  .service-v3-row{
    grid-template-columns:1fr;
    gap:20px
  }
  .service-index{
    font-size:50px
  }
  .service-v3-media{
    grid-column:auto;
    height:300px
  }
  .principle-grid{
    grid-template-columns:1fr
  }
  .principle-grid>div{
    border-right:0
  }
  .project-list-head{
    display:none
  }
  .project-row{
    grid-template-columns:40px 1fr;
    gap:8px;
    padding:20px 0
  }
  .project-period{
    grid-column:2
  }
  .project-main{
    gap:14px;
    align-items:flex-start
  }
  .project-thumb{
    width:90px;
    height:70px
  }
  .project-main h2{
    font-size:16px
  }
  .project-main small{
    font-size:8px
  }
  .contact-v3{
    padding:155px 0 90px
  }
  .contact-v3 h1{
    font-size:60px
  }
  .contact-big a{
    font-size:17px
  }
  .contact-card-v3{
    padding:25px
  }
  .mega-cta{
    padding:90px 0
  }
  .mega-cta h2{
    font-size:58px
  }
}
/* ===== MODEL 04 : LIGHT BLUE MODERN CORPORATE ===== */
:root{
  --light-blue:#0b75e5;
  --sky:#eaf7ff;
  --sky2:#d7f0ff;
  --navy2:#092a63;
  --text2:#18325b;
  --soft:#f7fbff;
  --border2:#d8e9f7
}
body{
  font-family:'Inter',sans-serif;
  background:#fff;
  color:var(--text2)
}
.site-header{
  padding:10px 0;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(16px);
  box-shadow:0 1px 0 rgba(20,85,145,.08);
  transition:.3s
}
.site-header.scrolled{
  padding:7px 0;
  background:rgba(255,255,255,.94);
  box-shadow:0 8px 30px rgba(18,91,155,.10)
}
.brand{
  color:var(--navy2);
  gap:12px
}
.brand-mark{
  width:43px;
  height:43px;
  position:relative;
  display:block
}
.brand-mark i{
  position:absolute;
  display:block;
  background:linear-gradient(145deg,#1b8cff,#0b5fd2);
  clip-path:polygon(50% 0,100% 100%,0 100%);
  width:19px;
  height:22px
}
.brand-mark i:nth-child(1){
  left:12px;
  top:0
}
.brand-mark i:nth-child(2){
  left:1px;
  top:18px;
  transform:rotate(120deg)
}
.brand-mark i:nth-child(3){
  right:1px;
  top:18px;
  transform:rotate(-120deg)
}
.brand-name strong{
  font:800 16px/1 'Plus Jakarta Sans';
  letter-spacing:.01em
}
.brand-name small{
  font:600 8px/1 'Inter';
  letter-spacing:.22em;
  color:#48739f;
  margin-top:6px
}
.nav-menu{
  color:#092a63;
  gap:30px
}
.nav-menu>a,.nav-dropdown>a{
  opacity:1;
  color:#092a63;
  font-size:13px
}
.nav-menu>a.active,.nav-dropdown>a.active,.nav-menu>a:hover,.nav-dropdown>a:hover{
  color:var(--light-blue)
}
.nav-menu>a.active:after,.nav-dropdown>a.active:after{
  background:var(--light-blue)
}
.nav-pill{
  background:var(--light-blue);
  color:#fff!important;
  padding:11px 19px!important;
  box-shadow:0 8px 20px rgba(11,117,229,.18)
}
.nav-pill:hover{
  background:#075fc0
}
.dropdown-menu{
  top:42px;
  background:rgba(255,255,255,.98);
  border:1px solid var(--border2);
  box-shadow:0 22px 55px rgba(21,79,126,.15)
}
.dropdown-menu a{
  color:#24456e
}
.dropdown-menu a:hover{
  background:#eef8ff;
  color:var(--light-blue)
}
.nav-toggle{
  color:#0b5fc8
}
.nav-toggle span{
  background:#0b5fc8
}
.hero-light{
  min-height:650px;
  height:82vh;
  position:relative;
  overflow:hidden;
  background:#dff3ff;
  padding-top:72px
}
.hero-light-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(.95)
}
.hero-light-wash{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(10,47,109,.96) 0%,rgba(10,47,109,.86) 38%,rgba(10,47,109,.52) 70%,rgba(10,47,109,.22) 100%),linear-gradient(0deg,rgba(6,30,72,.58),rgba(10,47,109,.12) 55%,rgba(10,47,109,.28) 100%)
}
.hero-light-grid{
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(8,112,214,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(8,112,214,.08) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(90deg,#000 20%,transparent 90%)
}
.hero-light-inner{
  height:100%;
  position:relative;
  display:flex;
  align-items:center
}
.hero-light-copy{
  max-width:700px;
  padding-bottom:35px;
  position:relative;
  z-index:2
}
.hero-kicker,.eyebrow-light{
  font:700 10px 'Inter';
  letter-spacing:.19em;
  color:#d9e9ff
}
.hero-kicker{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:15px
}
.hero-kicker span{
  display:block;
  width:36px;
  height:2px;
  background:#6db6ff
}
.hero-light h1{
  font:800 clamp(42px,4.7vw,64px)/1.0 'Plus Jakarta Sans';
  letter-spacing:-.055em;
  color:#fff;
  margin:0
}
.hero-light h1 b{
  color:#8dccff
}
.hero-light h1 .hero-nowrap{
  white-space:nowrap
}
.hero-light-copy>p{
  max-width:620px;
  color:#e5f1ff;
  font-size:15px;
  line-height:1.55;
  margin:24px 0 27px
}
.hero-actions-light{
  display:flex;
  gap:14px;
  align-items:center
}
.btn-blue,.btn-white-blue,.btn-outline-blue{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border-radius:999px;
  padding:13px 21px;
  font:700 12px 'Inter';
  transition:.25s
}
.btn-blue{
  background:#0b75e5;
  color:#fff;
  box-shadow:0 12px 25px rgba(11,117,229,.22)
}
.btn-blue:hover{
  transform:translateY(-2px);
  background:#075fc0
}
.btn-outline-blue{
  border:1px solid rgba(255,255,255,.65);
  color:#fff;
  background:rgba(255,255,255,.10)
}
.btn-outline-blue:hover{
  background:rgba(255,255,255,.20);
  border-color:#8dccff
}
.hero-drone{
  position:absolute;
  right:3%;
  top:15%;
  width:380px;
  z-index:1;
  filter:drop-shadow(0 20px 25px rgba(18,72,120,.18))
}
.hero-drone img{
  width:100%;
  height:220px;
  object-fit:cover;
  object-position:center;
  border-radius:20px;
  mix-blend-mode:multiply;
  opacity:.85
}
.hero-tech-label{
  position:absolute;
  right:3%;
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
  font:600 11px 'Inter';
  letter-spacing:.08em;
  text-shadow:0 2px 10px rgba(0,53,107,.35);
  z-index:3
}
.hero-tech-label i{
  font-size:20px
}
.hero-tech-label b{
  font-size:12px
}
.label-uav{
  top:27%
}
.label-gis{
  top:57%
}
.trust-strip{
  position:relative;
  z-index:5;
  margin-top:-34px
}
.trust-grid{
  background:#f5fbff;
  box-shadow:0 15px 40px rgba(30,100,150,.10);
  border:1px solid #d9eaf6;
  border-radius:20px;
  padding:17px 25px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0
}
.trust-grid>div{
  display:flex;
  align-items:center;
  gap:13px;
  padding:0 23px;
  border-right:1px solid #d9eaf6
}
.trust-grid>div:last-child{
  border-right:0
}
.trust-grid i{
  font-size:23px;
  color:#0878e8
}
.trust-grid span{
  font-size:11px;
  color:#5b7592;
  line-height:1.25
}
.trust-grid strong{
  display:block;
  color:#0a2f6d;
  font-size:12px;
  margin-top:2px
}
.section-light{
  padding:95px 0
}
.services-home{
  background:#fff
}
.section-top-light{
  display:grid;
  grid-template-columns:1.2fr .9fr auto;
  align-items:end;
  gap:35px;
  margin-bottom:34px
}
.section-top-light h2,.about-home h2,.project-showcase-light h2,.cta-light h2{
  font:800 clamp(35px,4vw,53px)/1.05 'Plus Jakarta Sans';
  letter-spacing:-.045em;
  color:#0a2f6d;
  margin:12px 0 0
}
.section-top-light h2 span,.about-home h2 span,.project-showcase-light h2 span,.cta-light h2 span{
  color:#1684ea
}
.section-top-light p{
  font-size:13px;
  color:#607a99;
  line-height:1.7;
  margin:0
}
.outline-small{
  border:1px solid #9cc7e9;
  color:#0873dc;
  padding:11px 16px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  white-space:nowrap
}
.outline-small:hover{
  background:#edf8ff
}
.service-cards-light{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px
}
.service-card-light{
  position:relative;
  min-height:300px;
  border:1px solid #d9eaf6;
  background:#f5fbff;
  border-radius:22px;
  overflow:hidden;
  display:flex;
  justify-content:space-between;
  transition:.3s
}
.service-card-light:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 45px rgba(28,111,176,.14);
  border-color:#a8d5f5
}
.service-card-light .service-card-text{
  position:relative;
  z-index:2;
  width:62%;
  padding:25px
}
.service-card-text small{
  font:700 18px 'Plus Jakarta Sans';
  color:#21a0ef
}
.service-card-text h3{
  font:800 25px/1.05 'Plus Jakarta Sans';
  letter-spacing:-.035em;
  color:#0a2f6d;
  margin:8px 0 12px
}
.service-card-text p{
  font-size:11px;
  line-height:1.55;
  color:#5b7592;
  margin:0 0 18px
}
.service-card-text span{
  font-size:10px;
  color:#0878e8;
  font-weight:800
}
.service-card-text span i{
  margin-left:5px
}
.service-card-light img{
  position:absolute;
  right:0;
  bottom:0;
  width:45%;
  height:100%;
  object-fit:cover;
  clip-path:polygon(24% 0,100% 0,100% 100%,0 100%);
  opacity:.95
}
.service-card-light:after{
  display:none
}
.service-icon{
  position:absolute;
  right:22px;
  top:35px;
  z-index:2;
  color:#0878e8;
  font-size:17px;
  background:transparent;
  border:0;
  box-shadow:none
}
.about-home{
  background:#f5fbff
}
.about-home-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:45px;
  align-items:center
}
.about-photo-wrap{
  position:relative;
  height:390px;
  min-height:390px;
  border-radius:25px;
  overflow:hidden;
  background:#dcecf8;
  box-shadow:0 22px 45px rgba(33,106,155,.15)
}
.about-photo-wrap>img{
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  object-position:center center
}
.about-home-copy p{
  color:#607a99;
  font-size:14px;
  line-height:1.75;
  max-width:570px;
  margin:22px 0
}
.stats-light{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  margin:8px 0 0;
  position:relative;
  z-index:3;
  border-top:1px solid #d8eaf7;
  border-bottom:1px solid #d8eaf7;
  background:transparent
}
.stats-light>div{
  padding:22px 24px 20px;
  border-right:1px solid #d8eaf7;
  background:transparent
}
.stats-light>div:last-child{
  border-right:0
}
.stats-light strong{
  display:block;
  color:#0b75e5;
  font:800 34px/1 'Plus Jakarta Sans';
  letter-spacing:-.04em
}
.stats-light span{
  display:block;
  font-size:10px;
  color:#67809d;
  line-height:1.45;
  margin-top:8px
}
.stats-light .counter-item{
  transition:transform .3s ease
}
.stats-light .counter-item:hover{
  transform:translateY(-3px)
}
.project-showcase-light{
  padding:90px 0 105px;
  background:#fff
}
.project-cards-light{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px
}
.project-card-light{
  height:260px;
  position:relative;
  border-radius:18px;
  overflow:hidden;
  background:#123;
  transition:.3s
}
.project-card-light:hover{
  transform:translateY(-5px)
}
.project-card-light img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.5s
}
.project-card-light:hover img{
  transform:scale(1.05)
}
.project-card-light:after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(5,32,72,.9),rgba(5,32,72,.02) 70%)
}
.project-card-light>div{
  position:absolute;
  left:18px;
  right:18px;
  bottom:16px;
  z-index:2;
  color:#fff
}
.project-card-light span{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#9cd7ff;
  font-weight:700
}
.project-card-light h3{
  font:700 17px/1.2 'Plus Jakarta Sans';
  margin:6px 35px 0 0
}
.project-card-light i{
  position:absolute;
  right:0;
  bottom:2px;
  width:30px;
  height:30px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:10px
}
.cta-light{
  position:relative;
  overflow:hidden;
  background:linear-gradient(120deg,#eaf8ff,#d5efff);
  padding:75px 0
}
.cta-light-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  position:relative;
  z-index:2
}
.cta-light h2{
  font-size:44px
}
.cta-orb{
  position:absolute;
  width:500px;
  height:500px;
  right:-100px;
  top:-250px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(16,131,235,.24),transparent 65%)
}
.btn-white-blue{
  background:#fff;
  color:#0873dc;
  border:1px solid #b7d8ef;
  padding:15px 22px;
  box-shadow:0 12px 30px rgba(30,110,165,.12)
}
.inner-hero{
  background:linear-gradient(135deg,#eaf8ff,#ccecff)!important;
  color:#0a2f6d!important
}
.inner-hero h1{
  color:#0a2f6d!important
}
.inner-hero .eyebrow-v3.light{
  color:#0873dc!important
}
.section-v3,.project-list-v3,.contact-bottom{
  background:#fff
}
.dark-v3,.people-v3,.contact-v3{
  background:#08295d!important
}
.dark-v3 h2,.people-v3 h2,.contact-v3 h1{
  color:#fff
}
.btn-v3.primary{
  background:#0b75e5!important
}
.btn-v3.light-btn{
  border-color:#7db9ea!important
}
.service-v3-row{
  border-color:#d9eaf6!important
}
.service-index{
  color:#1a8be9!important
}
.service-v3-copy h2,.about-story h2,.principles-v3 h2{
  color:#0a2f6d!important
}
.vision-card,.mission-card{
  border-color:#d8eaf7!important;
  background:#f5fbff!important
}
.principle-grid>div{
  background:#f8fcff!important;
  border-color:#d8eaf7!important
}
.project-row{
  border-color:#d8eaf7!important
}
.project-main h2{
  color:#0a2f6d!important
}
.contact-v3 h1 em{
  color:#68baff!important;
  -webkit-text-stroke:0!important
}
.contact-card-v3{
  background:rgba(255,255,255,.08)!important
}
.site-footer{
  background:#07265a!important
}
.site-footer a:hover{
  color:#55b6ff!important
}
.progress{
  background:#0b82eb!important
}
@media(max-width:980px){
  .nav-menu{
    background:rgba(248,252,255,.98);
    color:#092a63
  }
  .nav-menu>a,.nav-dropdown>a{
    color:#092a63
  }
  .hero-light{
    height:auto;
    min-height:720px
  }
  .hero-drone{
    right:-80px;
    opacity:.35
  }
  .hero-tech-label{
    display:none
  }
  .trust-strip{
    margin-top:-38px
  }
  .trust-grid{
    grid-template-columns:repeat(2,1fr);
    gap:15px
  }
  .trust-grid>div:nth-child(2){
    border-right:0
  }
  .section-top-light{
    grid-template-columns:1fr 1fr
  }
  .section-top-light .outline-small{
    grid-column:2;
    justify-self:end
  }
  .service-cards-light{
    grid-template-columns:1fr
  }
  .service-card-light{
    min-height:260px
  }
  .about-home-grid{
    grid-template-columns:1fr
  }
  .stats-light{
    grid-column:auto;
    margin:0
  }
  .project-cards-light{
    grid-template-columns:repeat(2,1fr)
  }
  .cta-light-inner{
    flex-direction:column;
    align-items:flex-start
  }
}
@media(max-width:620px){
  .brand-name strong{
    font-size:12px
  }
  .brand-name small{
    font-size:7px;
    letter-spacing:.14em
  }
  .hero-light{
    min-height:700px;
    padding-top:75px
  }
  .hero-light-wash{
    background:linear-gradient(90deg,rgba(10,47,109,.96),rgba(10,47,109,.78)),linear-gradient(0deg,rgba(6,30,72,.62),rgba(10,47,109,.16))
  }
  .hero-light h1{
    font-size:38px;
    line-height:1.02;
    letter-spacing:-.045em
  }
  .hero-kicker,.eyebrow-light{
    font-size:9px;
    letter-spacing:.16em
  }
  .hero-kicker{
    gap:8px;
    margin-bottom:13px
  }
  .hero-kicker span{
    width:30px
  }
  .hero-light-copy>p{
    max-width:100%;
    font-size:12.5px;
    line-height:1.5
  }
  .hero-actions-light{
    flex-wrap:wrap
  }
  .hero-drone{
    right:-130px;
    top:38%;
    width:330px;
    opacity:.25
  }
  .trust-strip{
    margin-top:-28px
  }
  .trust-grid{
    grid-template-columns:1fr;
    padding:12px
  }
  .trust-grid>div{
    border-right:0;
    border-bottom:1px solid #dbeaf5;
    padding:13px
  }
  .trust-grid>div:last-child{
    border-bottom:0
  }
  .section-light,.project-showcase-light{
    padding:70px 0
  }
  .section-top-light{
    display:block
  }
  .section-top-light p{
    margin-top:18px
  }
  .outline-small{
    display:inline-block;
    margin-top:18px
  }
  .service-card-light .service-card-text{
    width:75%;
    padding:22px
  }
  .service-card-light img{
    width:45%;
    opacity:1!important;
    filter:none!important
  }
  .service-card-text h3{
    font-size:23px
  }
  .about-photo-wrap,.about-photo-wrap>img{
    min-height:280px;
    height:280px
  }
  .about-photo-wrap>img{
    object-position:center center
  }
  .stats-light{
    grid-template-columns:repeat(2,1fr)
  }
  .stats-light>div{
    border-bottom:1px solid #d8eaf7
  }
  .stats-light>div:nth-child(2){
    border-right:0
  }
  .stats-light>div:nth-child(3){
    border-bottom:0
  }
  .stats-light>div:nth-child(4){
    border-right:0;
    border-bottom:0
  }
  .project-cards-light{
    grid-template-columns:1fr
  }
  .project-card-light{
    height:260px
  }
  .cta-light{
    padding:60px 0
  }
  .cta-light h2{
    font-size:35px
  }
  .btn-white-blue{
    width:100%
  }
}
/* ===== MODERN SERVICES V2 ===== */
.services-modern-hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#f5fbff 0%,#e5f5ff 54%,#cfeaff 100%);
  padding:145px 0 85px;
  color:#082f67
}
.services-hero-grid{
  display:grid;
  grid-template-columns:1.03fr .97fr;
  gap:70px;
  align-items:center
}
.services-kicker{
  display:flex;
  gap:12px;
  align-items:center;
  font:800 10px 'Inter';
  letter-spacing:.17em;
  color:#3689d7
}
.services-kicker b{
  color:#65b8f5
}
.services-modern-hero h1{
  font:800 clamp(48px,6vw,82px)/.96 'Plus Jakarta Sans';
  letter-spacing:-.065em;
  margin:22px 0 22px;
  color:#073675
}
.services-modern-hero h1 em{
  font-style:normal;
  color:#1686e8
}
.services-modern-hero p{
  max-width:650px;
  color:#50729a;
  font-size:16px;
  line-height:1.75;
  margin:0
}
.services-hero-actions{
  display:flex;
  align-items:center;
  gap:20px;
  margin-top:30px
}
.services-count{
  display:flex;
  align-items:center;
  gap:10px;
  color:#4c6e94
}
.services-count strong{
  font:800 34px 'Plus Jakarta Sans';
  color:#0878e8
}
.services-count span{
  font-size:10px;
  line-height:1.2
}
.services-visual{
  position:relative;
  height:475px;
  border-radius:34px;
  overflow:hidden;
  box-shadow:0 30px 65px rgba(25,104,167,.18);
  background:#b8e1fb
}
.services-visual>img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.9);
}
.services-visual:after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(6,75,139,.12),rgba(8,54,107,.02) 60%,rgba(2,32,75,.3))
}
.visual-grid{
  position:absolute;
  inset:0;
  z-index:2;
  opacity:.24;
  background-image:linear-gradient(rgba(255,255,255,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.6) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(135deg,#000,transparent 80%)
}
.visual-chip{
  position:absolute;
  z-index:4;
  display:flex;
  align-items:center;
  gap:11px;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.75);
  border-radius:16px;
  padding:12px 15px;
  box-shadow:0 14px 30px rgba(5,70,125,.16);
  font:600 9px 'Inter';
  letter-spacing:.07em;
  color:#4d6f91
}
.visual-chip i{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#e4f5ff;
  color:#0878e8;
  font-size:14px
}
.visual-chip b{
  font-size:9px;
  color:#0a4d91
}
.chip-top{
  top:22px;
  right:22px
}
.chip-bottom{
  left:22px;
  bottom:22px
}
.service-modern-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px
}
.service-modern-card{
  position:relative;
  min-height:420px;
  background:#fff;
  border:1px solid #d9eaf6;
  border-radius:26px;
  padding:27px;
  overflow:hidden;
  transition:.35s;
  box-shadow:0 8px 25px rgba(30,100,150,.035)
}
.service-modern-card:before{
  content:'';
  position:absolute;
  right:-75px;
  bottom:-90px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(29,145,234,.12),transparent 68%);
  pointer-events:none
}
.service-modern-card:hover{
  transform:translateY(-5px);
  border-color:#9ed0f1;
  box-shadow:0 22px 48px rgba(28,109,165,.12)
}
.service-modern-card.featured{
  background:linear-gradient(135deg,#0878e8,#0d91ec);
  color:#fff;
  border-color:transparent
}
.service-modern-card.featured:before{
  background:radial-gradient(circle,rgba(255,255,255,.2),transparent 68%)
}
.service-card-top{
  display:flex;
  justify-content:space-between;
  align-items:center
}
.service-card-top>span{
  font:800 13px 'Plus Jakarta Sans';
  color:#73a7cf
}
.featured .service-card-top>span{
  color:#bde4ff
}
.service-card-top i{
  width:42px;
  height:42px;
  border-radius:13px;
  background:#eaf7ff;
  color:#0878e8;
  display:grid;
  place-items:center
}
.featured .service-card-top i{
  background:rgba(255,255,255,.16);
  color:#fff
}
.service-card-body{
  max-width:590px;
  margin-top:43px
}
.service-card-body small{
  font:800 9px 'Inter';
  letter-spacing:.16em;
  color:#1483e7
}
.featured .service-card-body small{
  color:#bde6ff
}
.service-card-body h3{
  font:800 clamp(27px,3vw,39px)/1.02 'Plus Jakarta Sans';
  letter-spacing:-.045em;
  color:#082f67;
  margin:9px 0 14px
}
.featured .service-card-body h3{
  color:#fff
}
.service-card-body>p{
  font-size:13px;
  line-height:1.7;
  color:#627d9a;
  margin:0
}
.featured .service-card-body>p{
  color:#e2f3ff
}
.service-detail{
  margin-top:23px;
  padding-top:17px;
  border-top:1px solid #dfedf6
}
.featured .service-detail{
  border-color:rgba(255,255,255,.2)
}
.service-detail>b{
  font:800 10px 'Inter';
  letter-spacing:.08em;
  color:#466b8e
}
.featured .service-detail>b{
  color:#c8eaff
}
.service-detail ul{
  margin:10px 0 0;
  padding-left:18px;
  color:#637e99;
  font-size:11px;
  line-height:1.8
}
.featured .service-detail ul{
  color:#e7f6ff
}
.services-process{
  background:#072d63;
  color:#fff;
  padding:95px 0
}
.process-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:100px;
  align-items:start
}
.services-process h2{
  font:800 clamp(40px,5vw,64px)/.98 'Plus Jakarta Sans';
  letter-spacing:-.055em;
  margin:13px 0 20px
}
.services-process h2 span{
  color:#5bb9ff
}
.services-process>div p{
  color:#b7cbe1;
  max-width:500px;
  font-size:14px;
  line-height:1.75
}
.process-steps{
  display:grid;
  gap:0
}
.process-steps>div{
  display:grid;
  grid-template-columns:55px 150px 1fr;
  align-items:center;
  gap:16px;
  padding:21px 0;
  border-bottom:1px solid rgba(255,255,255,.13)
}
.process-steps b{
  font:800 11px 'Plus Jakarta Sans';
  color:#5bb9ff
}
.process-steps span{
  font:800 10px 'Inter';
  letter-spacing:.15em
}
.process-steps p{
  margin:0;
  color:#b7cbe1;
  font-size:12px
}
.services-cta{
  background:linear-gradient(135deg,#eaf8ff,#d3efff);
  padding:72px 0
}
.services-cta-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px
}
.services-cta small{
  font:800 9px 'Inter';
  letter-spacing:.18em;
  color:#1483e7
}
.services-cta h2{
  font:800 clamp(34px,4vw,53px)/1.02 'Plus Jakarta Sans';
  letter-spacing:-.05em;
  color:#082f67;
  margin:12px 0 0
}
.services-cta h2 span{
  color:#1686e8
}
@media(max-width:900px){
  .services-hero-grid,.process-grid{
    grid-template-columns:1fr;
    gap:42px
  }
  .services-visual{
    height:390px
  }
  .service-modern-grid{
    grid-template-columns:1fr
  }
  .services-cta-inner{
    align-items:flex-start;
    flex-direction:column
  }
  .process-steps{
    margin-top:10px
  }
}
@media(max-width:620px){
  .services-modern-hero{
    padding:120px 0 60px
  }
  .services-modern-hero h1{
    font-size:45px
  }
  .services-modern-hero p{
    font-size:13px
  }
  .services-visual{
    height:310px;
    border-radius:23px
  }
  .visual-chip{
    transform:scale(.88);
    transform-origin:bottom left
  }
  .chip-top{
    transform-origin:top right
  }
  .service-modern-card{
    min-height:0;
    padding:22px
  }
  .service-card-body{
    margin-top:30px
  }
  .service-card-body h3{
    font-size:28px
  }
  .service-list-modern{
    padding-bottom:75px
  }
  .services-process{
    padding:70px 0
  }
  .process-steps>div{
    grid-template-columns:40px 100px 1fr;
    gap:10px
  }
  .process-steps p{
    font-size:10px
  }
  .services-cta{
    padding:60px 0
  }
  .services-cta .btn-blue{
    width:100%
  }
}
/* ===== LOGO PT. INDRA BUANA UTAMA ===== */
.ibu-logo-header{
  width:58px;
  height:58px;
  object-fit:contain;
  flex:0 0 58px
}
.ibu-logo-footer{
  width:72px;
  height:72px;
  object-fit:contain;
  flex:0 0 72px
}
.footer-logo{
  align-items:center
}
.footer-logo .brand-name strong{
  font-size:16px
}
.footer-logo .brand-name small{
  font-size:8px;
  letter-spacing:.16em
}
.site-header .brand{
  gap:12px
}
.site-header .brand-name strong{
  color:#092a63
}
.site-header .brand-name small{
  color:#48739f;
  opacity:1
}
.site-footer .brand-name strong{
  color:#fff
}
.site-footer .brand-name small{
  color:#b8d8f5;
  opacity:1
}
.site-footer .ibu-logo-footer{
  filter:drop-shadow(0 5px 12px rgba(0,0,0,.12))
}
@media(max-width:620px){
  .ibu-logo-header{
    width:46px;
    height:46px;
    flex-basis:46px
  }
  .ibu-logo-footer{
    width:62px;
    height:62px;
    flex-basis:62px
  }
  .site-header .brand-name strong{
    font-size:11px
  }
  .site-header .brand-name small{
    font-size:6.5px;
    letter-spacing:.10em
  }
  .footer-logo .brand-name strong{
    font-size:13px
  }
  .footer-logo .brand-name small{
    font-size:7px;
    letter-spacing:.08em
  }
}
/* ===== PROJECT MODERN ===== */
.projects-hero-modern{
  background:linear-gradient(120deg,#071a33 0%,#0b4b91 58%,#1187dc 100%);
  overflow:hidden;
  position:relative
}
.projects-hero-modern:after{
  content:'';
  position:absolute;
  inset:0;
  opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px);
  background-size:58px 58px;
  mask-image:linear-gradient(90deg,#000,transparent 75%)
}
.projects-hero-inner{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:50px
}
.projects-hero-modern h1{
  max-width:900px;
  margin:16px 0 20px;
  font:800 clamp(45px,6vw,78px)/.98 'Plus Jakarta Sans';
  letter-spacing:-.06em;
  color:#fff
}
.projects-hero-modern h1 em{
  font-style:normal;
  color:#8ed5ff;
  -webkit-text-stroke:0
}
.projects-hero-modern p{
  max-width:670px;
  color:#d7e9f8;
  font-size:15px;
  margin:0
}
.projects-hero-stat{
  width:150px;
  height:150px;
  flex:0 0 150px;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(255,255,255,.09);
  backdrop-filter:blur(14px);
  border-radius:28px;
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:end;
  color:#fff
}
.projects-hero-stat strong{
  font:800 58px/.9 'Plus Jakarta Sans';
  letter-spacing:-.07em
}
.projects-hero-stat span{
  font-size:10px;
  line-height:1.35;
  color:#c9e6fb;
  margin-top:10px
}
.projects-modern-section{
  background:#f7fbff;
  padding-top:58px
}
.projects-section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:50px;
  margin-bottom:34px
}
.projects-section-head h2{
  font:800 clamp(34px,4vw,56px)/1 'Plus Jakarta Sans';
  letter-spacing:-.055em;
  color:#082f67;
  margin:12px 0 0
}
.projects-section-head p{
  max-width:400px;
  color:#627f9f;
  font-size:13px;
  margin:0 0 3px
}
.project-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:12px;
  background:#fff;
  border:1px solid #dcecf8;
  border-radius:20px;
  box-shadow:0 10px 30px rgba(25,105,160,.05);
  margin-bottom:26px;
  position:sticky;
  top:82px;
  z-index:20
}
.project-filters{
  display:flex;
  gap:7px;
  flex-wrap:wrap
}
.project-filter{
  border:1px solid #d6e8f5;
  background:#f8fcff;
  color:#547492;
  border-radius:999px;
  padding:10px 13px;
  font:700 10px Inter;
  cursor:pointer;
  transition:.25s
}
.project-filter b{
  color:#1483e7;
  margin-left:4px
}
.project-filter:hover,.project-filter.active{
  background:#0878e8;
  border-color:#0878e8;
  color:#fff;
  box-shadow:0 8px 18px rgba(8,120,232,.18)
}
.project-filter.active b,.project-filter:hover b{
  color:#fff
}
.project-search{
  height:40px;
  min-width:230px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 13px;
  border:1px solid #dcecf8;
  border-radius:999px;
  background:#f9fcff;
  color:#8aa4bb
}
.project-search input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#183a5b;
  font:500 11px Inter
}
.project-search input::placeholder{
  color:#94aabe
}
.project-modern-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px
}
.project-modern-card{
  background:#fff;
  border:1px solid #dcebf7;
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 8px 25px rgba(25,105,160,.035);
  transition:.35s;
  min-width:0
}
.project-modern-card:hover{
  transform:translateY(-5px);
  border-color:#a7d2ed;
  box-shadow:0 22px 48px rgba(28,109,165,.13)
}
.project-modern-image{
  height:215px;
  position:relative;
  overflow:hidden;
  background:#dcecf8
}
.project-modern-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.6s
}
.project-modern-card:hover .project-modern-image img{
  transform:scale(1.055)
}
.project-modern-image:after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(3,25,48,.08),rgba(3,25,48,.62));
  pointer-events:none
}
.project-modern-number,.project-modern-arrow{
  position:absolute;
  z-index:2
}
.project-modern-number{
  top:16px;
  left:16px;
  width:40px;
  height:40px;
  border-radius:12px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(8px);
  display:grid;
  place-items:center;
  color:#0878e8;
  font:800 11px Inter
}
.project-modern-arrow{
  right:16px;
  bottom:16px;
  width:39px;
  height:39px;
  border-radius:50%;
  background:#fff;
  color:#0878e8;
  display:grid;
  place-items:center;
  transition:.25s
}
.project-modern-card:hover .project-modern-arrow{
  transform:rotate(45deg);
  background:#0878e8;
  color:#fff
}
.project-modern-content{
  padding:18px 19px 20px
}
.project-modern-meta{
  display:flex;
  justify-content:space-between;
  gap:15px;
  align-items:center;
  margin-bottom:11px
}
.project-modern-meta span{
  font:800 9px Inter;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#4d7699
}
.project-modern-meta time{
  font:700 10px Inter;
  color:#1483e7;
  white-space:nowrap
}
.project-modern-description{
  margin:10px 0 0;
  color:#5f7488;
  font:400 13px/1.7 Inter,sans-serif;
  letter-spacing:0;
  text-transform:none;
}
.project-modern-content h3{
  font:800 19px/1.2 'Plus Jakarta Sans';
  letter-spacing:-.035em;
  color:#082f67;
  margin:0;
  max-width:690px
}
.project-modern-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:14px;
  color:#0878e8;
  font:800 10px Inter
}
.project-modern-link i{
  font-size:9px;
  transition:.2s
}
.project-modern-card:hover .project-modern-link i{
  transform:translateX(4px)
}
.project-empty{
  display:none;
  padding:60px 20px;
  text-align:center;
  color:#6d849a
}
.project-empty.show{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px
}
.project-empty i{
  font-size:28px;
  color:#76b9e9
}
.project-empty strong{
  font:800 17px 'Plus Jakarta Sans';
  color:#173f68
}
.project-empty span{
  font-size:12px
}
.projects-cta-modern{
  padding:78px 0;
  background:linear-gradient(135deg,#eaf8ff,#d6efff)
}
.projects-cta-modern-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px
}
.projects-cta-modern small{
  font:800 9px Inter;
  letter-spacing:.18em;
  color:#1483e7
}
.projects-cta-modern h2{
  font:800 clamp(33px,4vw,52px)/1.02 'Plus Jakarta Sans';
  letter-spacing:-.05em;
  color:#082f67;
  margin:12px 0 0
}
.projects-cta-modern h2 em{
  font-style:normal;
  color:#1686e8
}
@media(max-width:1100px){
  .project-modern-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:900px){
  .projects-hero-inner{
    align-items:flex-start;
    flex-direction:column
  }
  .projects-hero-stat{
    width:125px;
    height:125px;
    min-height:125px;
    flex-basis:125px
  }
  .project-toolbar{
    position:static;
    align-items:stretch;
    flex-direction:column
  }
  .project-search{
    width:100%
  }
  .project-modern-grid{
    grid-template-columns:1fr
  }
  .projects-section-head{
    display:block
  }
  .projects-section-head p{
    margin-top:16px
  }
  .projects-cta-modern-inner{
    align-items:flex-start;
    flex-direction:column
  }
}
@media(max-width:620px){
  .projects-hero-modern{
    padding-top:120px;
    padding-bottom:65px
  }
  .projects-hero-modern h1{
    font-size:43px
  }
  .projects-hero-modern p{
    font-size:13px
  }
  .projects-modern-section{
    padding:52px 0
  }
  .project-modern-image{
    height:205px
  }
  .project-modern-content{
    padding:20px
  }
  .project-modern-content h3{
    font-size:20px
  }
  .project-modern-meta{
    align-items:flex-start;
    flex-direction:column;
    gap:5px
  }
  .project-filters{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    width:100%
  }
  .project-filter{
    width:100%
  }
  .project-search{
    min-width:0
  }
  .projects-cta-modern{
    padding:60px 0
  }
  .projects-cta-modern .btn-blue{
    width:100%;
    justify-content:center
  }
}
/* Layanan: urutan acak + detail modern */
.service-modern-card[hidden]{
  display:none!important
}
.service-modern-card.visible{
  animation:serviceIn .38s ease both
}
@keyframes serviceIn{
  from{
    opacity:0;
    transform:translateY(12px)
  }
  to{
    opacity:1;
    transform:none
  }
}
.service-detail-btn{
  margin-top:22px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  border:0;
  background:#eef8ff;
  color:#0878e8;
  border-radius:999px;
  padding:10px 14px;
  font:800 11px 'Inter';
  cursor:pointer;
  transition:.25s
}
.service-detail-btn:hover{
  background:#0878e8;
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(8,120,232,.2)
}
.service-detail-btn i{
  font-size:10px
}
.featured .service-detail-btn{
  background:rgba(255,255,255,.16);
  color:#fff
}
.featured .service-detail-btn:hover{
  background:#fff;
  color:#0878e8
}
.dropdown-services-all{
  width:390px;
  max-height:70vh;
  overflow:auto;
  padding:10px
}
.dropdown-services-all a{
  align-items:flex-start;
  gap:12px;
  padding:11px 12px
}
.dropdown-services-all span{
  min-width:22px;
  font-size:10px
}
.dropdown-services-all::-webkit-scrollbar{
  width:5px
}
.dropdown-services-all::-webkit-scrollbar-thumb{
  background:#b7d8ee;
  border-radius:10px
}
.service-modal{
  position:fixed;
  inset:0;
  z-index:2000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  opacity:0;
  visibility:hidden;
  transition:.25s
}
.service-modal.open{
  opacity:1;
  visibility:visible
}
.service-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(3,25,53,.58);
  backdrop-filter:blur(8px)
}
.service-modal-dialog{
  position:relative;
  width:min(720px,100%);
  max-height:min(760px,90vh);
  overflow:auto;
  background:#fff;
  border:1px solid #d9eaf6;
  border-radius:28px;
  box-shadow:0 35px 100px rgba(0,36,76,.3);
  transform:translateY(18px) scale(.98);
  transition:.28s
}
.service-modal.open .service-modal-dialog{
  transform:none
}
.service-modal-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:22px 25px;
  border-bottom:1px solid #e5eef5
}
.service-modal-label{
  font:800 9px 'Inter';
  letter-spacing:.18em;
  color:#1483e7
}
.service-modal-close{
  width:38px;
  height:38px;
  border:1px solid #dbeaf4;
  background:#f5faff;
  border-radius:50%;
  color:#28577d;
  cursor:pointer
}
.service-modal-content{
  padding:30px
}
.service-modal-number{
  font:800 13px 'Plus Jakarta Sans';
  color:#80b9df
}
.service-modal-content h3{
  font:800 clamp(30px,5vw,48px)/1 'Plus Jakarta Sans';
  letter-spacing:-.05em;
  color:#082f67;
  margin:8px 0 15px
}
.service-modal-description{
  font-size:14px;
  line-height:1.8;
  color:#5d7690;
  margin:0
}
.service-modal-detail{
  margin-top:25px;
  padding-top:20px;
  border-top:1px solid #e2edf5
}
.service-modal-detail>b{
  font:800 10px 'Inter';
  letter-spacing:.1em;
  color:#0c70c9
}
.service-modal-detail ul{
  margin:10px 0 0;
  padding-left:20px;
  color:#5f7891;
  font-size:13px;
  line-height:1.9
}
.modal-open{
  overflow:hidden
}
@media(max-width:900px){
  .dropdown-services-all{
    position:static;
    width:100%;
    max-height:55vh;
    box-shadow:none;
    border-radius:12px;
    margin-top:8px
  }
  .service-modal{
    padding:14px
  }
  .service-modal-content{
    padding:24px
  }
}
/* Detail layanan lengkap */
.service-modal-dialog-rich{
  max-width:980px;
  max-height:92vh
}
.service-modal-head>div{
  display:flex;
  align-items:center;
  gap:12px
}
.service-modal-category{
  font:700 9px 'Inter';
  letter-spacing:.08em;
  color:#5b7894;
  background:#edf7ff;
  border:1px solid #d6eaf7;
  padding:7px 10px;
  border-radius:999px
}
.service-modal-dialog-rich .service-modal-content{
  padding:32px 34px 38px
}
.service-modal-dialog-rich .service-modal-description{
  max-width:820px;
  font-size:15px
}
.service-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:26px
}
.service-detail-grid section{
  padding:18px 20px;
  background:#f6fbff;
  border:1px solid #dfedf6;
  border-radius:18px
}
.service-detail-grid section small,.service-detail-columns section>small{
  font:800 9px 'Inter';
  letter-spacing:.14em;
  color:#1483e7
}
.service-detail-grid section p{
  margin:8px 0 0;
  color:#526e89;
  font-size:12px;
  line-height:1.75
}
.service-detail-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:18px
}
.service-detail-columns section{
  padding:22px;
  background:#fff;
  border:1px solid #e0edf5;
  border-radius:20px
}
.rich-detail-title{
  display:flex;
  align-items:center;
  gap:10px
}
.rich-detail-title i{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#eaf7ff;
  color:#0878e8
}
.rich-detail-title h4{
  margin:0;
  color:#0b376c;
  font:800 15px 'Plus Jakarta Sans'
}
.service-detail-columns ul,.service-detail-columns ol{
  margin:15px 0 0;
  padding-left:20px;
  color:#5b748d;
  font-size:12px;
  line-height:1.85
}
.service-detail-columns p{
  margin:15px 0 0;
  color:#5b748d;
  font-size:12px;
  line-height:1.85
}
.service-detail-columns li::marker{
  color:#1686e8
}
.service-detail-columns ol li::marker{
  font-weight:800
}
.service-modal-number{
  letter-spacing:.04em
}
.service-modern-card .service-detail-btn{
  position:relative;
  z-index:2
}
@media(max-width:720px){
  .service-modal-dialog-rich .service-modal-content{
    padding:24px 20px 30px
  }
  .service-detail-grid,.service-detail-columns{
    grid-template-columns:1fr
  }
  .service-modal-head>div{
    flex-wrap:wrap
  }
  .service-modal-dialog-rich{
    max-height:94vh
  }
  .service-detail-columns section{
    padding:18px
  }
}
/* ===== FOOTER MODERN ===== */
.site-footer-modern{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#061b3d 0%,#082f68 55%,#0756a8 100%)!important;
  color:#fff;
  padding:0;
  isolation:isolate
}
.site-footer-modern:before{
  content:'';
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:55px 55px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 90%)
}
.footer-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(5px);
  z-index:-1;
  pointer-events:none
}
.footer-glow-one{
  width:420px;
  height:420px;
  right:-150px;
  top:-190px;
  background:radial-gradient(circle,rgba(73,190,255,.25),transparent 68%)
}
.footer-glow-two{
  width:320px;
  height:320px;
  left:-170px;
  bottom:-190px;
  background:radial-gradient(circle,rgba(26,132,255,.2),transparent 68%)
}
.footer-modern-top{
  display:grid;
  grid-template-columns:1.35fr .72fr 1.05fr .9fr;
  gap:54px;
  padding-top:76px;
  padding-bottom:58px
}
.footer-modern-brand .footer-logo{
  display:inline-flex
}
.footer-modern-brand>p{
  max-width:390px;
  color:#c5d7ed;
  font-size:13px;
  line-height:1.8;
  margin:25px 0
}
.footer-kicker{
  display:block;
  color:#8ed8ff;
  font:800 9px/1 'Manrope',sans-serif;
  letter-spacing:.2em;
  margin-bottom:23px
}
.footer-modern-column{
  min-width:0
}
.footer-nav-main{
  display:flex;
  flex-direction:column;
  gap:4px
}
.footer-nav-main a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:8px 0;
  color:#edf6ff;
  font:600 13px 'Manrope',sans-serif;
  border-bottom:1px solid rgba(255,255,255,.07);
  transition:.25s
}
.footer-nav-main a i{
  font-size:9px;
  color:#69c9ff;
  opacity:0;
  transform:translateX(-5px);
  transition:.25s
}
.footer-nav-main a:hover{
  color:#fff;
  padding-left:5px
}
.footer-nav-main a:hover i{
  opacity:1;
  transform:none
}
.footer-service-links{
  display:flex;
  flex-direction:column;
  gap:5px
}
.footer-service-links a{
  display:block;
  color:#c8d9eb;
  font-size:12px;
  line-height:1.45;
  padding:4px 0;
  transition:.25s
}
.footer-service-links a:hover{
  color:#fff;
  transform:translateX(4px)
}
.footer-all-services{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:15px;
  color:#fff;
  font:800 11px 'Manrope',sans-serif
}
.footer-all-services i{
  color:#70d0ff;
  transition:.25s
}
.footer-all-services:hover i{
  transform:translateX(5px)
}
.footer-contact-modern{
  padding-left:10px
}
.footer-contact-item{
  display:flex;
  align-items:flex-start;
  gap:13px;
  color:#c9daed;
  font-size:12px;
  line-height:1.65;
  margin-bottom:18px
}
.footer-contact-item i{
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:grid;
  place-items:center;
  border:1px solid rgba(123,211,255,.25);
  background:rgba(255,255,255,.06);
  border-radius:9px;
  color:#72d1ff;
  font-size:11px
}
.footer-contact-modern a:hover{
  color:#fff
}
.footer-contact-cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:12px 17px;
  border-radius:999px;
  background:#fff;
  color:#073064!important;
  font:800 11px 'Manrope',sans-serif;
  box-shadow:0 10px 30px rgba(0,0,0,.16);
  transition:.25s
}
.footer-contact-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 35px rgba(0,0,0,.23)
}
.footer-modern-divider{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent)
}
.footer-modern-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-top:22px;
  padding-bottom:24px;
  color:#aecaE5;
  font-size:10px
}
.footer-modern-bottom span:last-child{
  color:#bfe8ff;
  font-weight:600;
  letter-spacing:.03em
}
.footer-logo .brand-name strong{
  letter-spacing:.06em
}
.footer-logo .brand-name small{
  letter-spacing:.12em
}
@media(max-width:1100px){
  .footer-modern-top{
    grid-template-columns:1.2fr 1fr 1fr;
    gap:40px
  }
  .footer-contact-modern{
    padding-left:0
  }
  .footer-modern-brand{
    grid-column:span 3
  }
  .footer-modern-brand>p{
    max-width:620px
  }
}
@media(max-width:760px){
  .footer-modern-top{
    grid-template-columns:1fr 1fr;
    gap:38px 28px;
    padding-top:58px;
    padding-bottom:42px
  }
  .footer-modern-brand{
    grid-column:span 2
  }
  .footer-services-column{
    grid-column:span 2
  }
  .footer-modern-bottom{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    padding-bottom:22px
  }
  .footer-modern-bottom span:last-child{
    order:3
  }
}
@media(max-width:520px){
  .footer-modern-top{
    grid-template-columns:1fr;
    gap:34px
  }
  .footer-modern-brand,.footer-services-column{
    grid-column:auto
  }
  .footer-logo .ibu-logo-footer{
    width:58px;
    height:58px;
    flex-basis:58px
  }
  .footer-logo .brand-name strong{
    font-size:12px
  }
  .footer-logo .brand-name small{
    font-size:7px
  }
  .footer-modern-brand>p{
    font-size:12px
  }
  .footer-contact-item{
    font-size:11px
  }
  .footer-modern-bottom{
    font-size:9px
  }
}
/* Penyempurnaan footer: logo dengan bidang putih dan copyright benar-benar di tengah */
.site-footer-modern .footer-logo-box{
  width:88px;
  height:88px;
  flex:0 0 88px;
  display:grid;
  place-items:center;
  background:#fff;
  border:1px solid rgba(255,255,255,.5);
  border-radius:18px;
  padding:8px;
  box-shadow:0 14px 32px rgba(0,0,0,.18)
}
.site-footer-modern .footer-logo-box .ibu-logo-footer{
  width:72px;
  height:72px;
  object-fit:contain;
  filter:none
}
.site-footer-modern .footer-logo{
  gap:14px
}
.site-footer-modern .footer-modern-bottom{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  padding-top:22px;
  padding-bottom:24px
}
.site-footer-modern .footer-copyright{
  text-align:center;
  white-space:nowrap;
  color:#eaf6ff;
  font-size:10px;
  font-weight:600
}
.site-footer-modern .footer-bottom-side{
  font-size:10px;
  color:#aecaE5
}
.site-footer-modern .footer-bottom-left{
  text-align:left
}
.site-footer-modern .footer-bottom-right{
  text-align:right;
  color:#bfe8ff;
  font-weight:600;
  letter-spacing:.03em
}
@media(max-width:760px){
  .site-footer-modern .footer-modern-bottom{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    gap:8px
  }
  .site-footer-modern .footer-copyright{
    grid-row:1;
    white-space:normal
  }
  .site-footer-modern .footer-bottom-left{
    grid-row:2;
    text-align:center
  }
  .site-footer-modern .footer-bottom-right{
    grid-row:3;
    text-align:center
  }
}
@media(max-width:520px){
  .site-footer-modern .footer-logo-box{
    width:76px;
    height:76px;
    flex-basis:76px;
    border-radius:15px;
    padding:7px
  }
  .site-footer-modern .footer-logo-box .ibu-logo-footer{
    width:62px;
    height:62px
  }
  .site-footer-modern .footer-copyright,.site-footer-modern .footer-bottom-side{
    font-size:9px
  }
}
/* Penyempurnaan footer terbaru: logo lebih compact, deskripsi rata kiri-kanan, copyright tunggal di tengah */
.site-footer-modern .footer-logo-box{
  width:68px;
  height:68px;
  flex:0 0 68px;
  border-radius:14px;
  padding:6px;
  box-shadow:0 10px 24px rgba(0,0,0,.14)
}
.site-footer-modern .footer-logo-box .ibu-logo-footer{
  width:56px;
  height:56px
}
.site-footer-modern .footer-modern-brand>p{
  text-align:justify;
  text-justify:inter-word;
  max-width:390px
}
.site-footer-modern .footer-modern-bottom{
  display:flex;
  align-items:center;
  justify-content:center;
  padding-top:20px;
  padding-bottom:22px
}
.site-footer-modern .footer-copyright{
  text-align:center;
  white-space:normal;
  color:#eaf6ff;
  font-size:10px;
  font-weight:600;
  margin:0
}
.site-footer-modern .footer-bottom-side{
  display:none!important
}
@media(max-width:760px){
  .site-footer-modern .footer-modern-bottom{
    display:flex;
    justify-content:center;
    text-align:center
  }
  .site-footer-modern .footer-copyright{
    white-space:normal
  }
}
@media(max-width:520px){
  .site-footer-modern .footer-logo-box{
    width:62px;
    height:62px;
    flex-basis:62px;
    border-radius:13px;
    padding:5px
  }
  .site-footer-modern .footer-logo-box .ibu-logo-footer{
    width:52px;
    height:52px
  }
  .site-footer-modern .footer-modern-brand>p{
    text-align:justify;
    font-size:12px
  }
}
/* =========================================================
   TENTANG KAMI — MODERN CORPORATE 2026
   ========================================================= */
.about-modern-hero{
  min-height:720px;
  height:88vh;
  position:relative;
  overflow:hidden;
  background:#061b35;
  color:#fff;
  display:flex;
  align-items:center
}
.about-modern-hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center
}
.about-modern-hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(3,20,42,.94) 0%,rgba(3,20,42,.72) 44%,rgba(3,20,42,.18) 100%),linear-gradient(0deg,rgba(3,20,42,.72),transparent 52%)
}
.about-modern-gridlines{
  position:absolute;
  inset:0;
  opacity:.12;
  background-image:linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px);
  background-size:76px 76px;
  mask-image:linear-gradient(90deg,#000,transparent 82%)
}
.about-modern-hero-inner{
  position:relative;
  padding-top:60px
}
.about-modern-kicker{
  display:flex;
  align-items:center;
  gap:11px;
  color:#aee4ff;
  font:800 10px/1 'Manrope',sans-serif;
  letter-spacing:.2em;
  margin-bottom:25px
}
.about-modern-kicker span{
  width:28px;
  height:2px;
  background:#45c7ff
}
.about-modern-hero h1{
  font:800 clamp(46px,6.2vw,88px)/.98 'Manrope',sans-serif;
  letter-spacing:-.065em;
  margin:0;
  max-width:980px
}
.about-modern-hero h1 em{
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.9)
}
.about-modern-hero p{
  max-width:620px;
  color:#c8d9eb;
  font-size:16px;
  line-height:1.8;
  margin:27px 0 30px
}
.about-modern-actions{
  display:flex;
  align-items:center;
  gap:25px
}
.about-modern-btn{
  display:inline-flex;
  align-items:center;
  gap:13px;
  background:#fff;
  color:#09254a;
  border-radius:999px;
  padding:13px 18px;
  font:800 12px 'Manrope',sans-serif;
  box-shadow:0 12px 30px rgba(0,0,0,.18)
}
.about-modern-btn i{
  font-size:10px
}
.about-modern-since{
  display:flex;
  align-items:baseline;
  gap:9px
}
.about-modern-since b{
  font:800 22px 'Manrope';
  color:#fff
}
.about-modern-since small{
  font-size:11px;
  color:#abc1d7
}
.about-modern-coord{
  position:absolute;
  right:4%;
  bottom:30px;
  color:#9bb4cc;
  font:600 9px 'Manrope';
  letter-spacing:.18em
}
.about-modern-intro{
  background:#fff;
  padding:120px 0 90px
}
.about-modern-intro-grid{
  display:grid;
  grid-template-columns:.55fr 1.45fr;
  gap:80px
}
.about-modern-label{
  display:flex;
  align-items:center;
  gap:13px;
  color:#1375dc;
  font:800 10px 'Manrope';
  letter-spacing:.14em
}
.about-modern-label span{
  font-size:12px;
  color:#8ba0b5
}
.about-modern-intro-copy{
  max-width:860px
}
.about-modern-lead{
  font:700 clamp(24px,3vw,38px)/1.25 'Manrope';
  letter-spacing:-.035em;
  color:#0a2850;
  margin:0 0 26px
}
.about-modern-intro-copy>p:not(.about-modern-lead){
  color:#62778e;
  font-size:14px;
  line-height:1.9;
  margin:0 0 14px
}
.about-modern-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:70px;
  border-top:1px solid #dfe8f0;
  border-bottom:1px solid #dfe8f0
}
.about-modern-stats>div{
  padding:25px 28px;
  border-right:1px solid #dfe8f0
}
.about-modern-stats>div:last-child{
  border-right:0
}
.about-modern-stats small{
  display:block;
  color:#8499ad;
  font:800 8px 'Manrope';
  letter-spacing:.14em
}
.about-modern-stats strong{
  display:block;
  color:#0b65c8;
  font:800 42px/1 'Manrope';
  letter-spacing:-.06em;
  margin:10px 0 5px
}
.about-modern-stats span{
  color:#6d8296;
  font-size:11px
}
.about-modern-capabilities{
  position:relative;
  background:linear-gradient(135deg,#061a36,#0a4d91);
  color:#fff;
  padding:120px 0;
  overflow:hidden
}
.about-modern-capabilities:before{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:60px 60px;
  mask-image:linear-gradient(90deg,#000,transparent)
}
.about-modern-section-head{
  position:relative;
  margin-bottom:50px
}
.about-modern-section-head .light{
  color:#8fdcff
}
.about-modern-section-head h2{
  font:800 clamp(34px,4.5vw,62px)/1 'Manrope';
  letter-spacing:-.055em;
  margin:20px 0 16px
}
.about-modern-section-head h2 em{
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.75)
}
.about-modern-section-head>p{
  max-width:650px;
  color:#bcd0e3;
  font-size:13px;
  line-height:1.8
}
.about-modern-section-head.compact h2{
  color:#0a2850
}
.about-modern-section-head.compact h2 em{
  color:transparent;
  -webkit-text-stroke:1px #1d72c9
}
.about-capability-grid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px
}
.about-capability-grid article{
  position:relative;
  min-height:340px;
  padding:30px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;
  overflow:hidden;
  transition:.35s
}
.about-capability-grid article:hover{
  transform:translateY(-8px);
  background:rgba(255,255,255,.11);
  border-color:rgba(111,211,255,.45)
}
.about-capability-grid article>span{
  position:absolute;
  top:25px;
  right:28px;
  color:#70d2ff;
  font:800 10px 'Manrope';
  letter-spacing:.1em
}
.about-capability-grid article>i{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  background:rgba(94,199,255,.12);
  border:1px solid rgba(94,199,255,.22);
  border-radius:15px;
  color:#6bd2ff;
  margin-bottom:70px
}
.about-capability-grid h3{
  font:800 21px/1.2 'Manrope';
  margin:0 0 12px
}
.about-capability-grid p{
  color:#b9cde1;
  font-size:12px;
  line-height:1.75;
  max-width:330px
}
.about-capability-grid a{
  position:absolute;
  left:30px;
  bottom:25px;
  color:#72d5ff;
  font:800 10px 'Manrope';
  letter-spacing:.04em
}
.about-capability-grid a i{
  margin-left:7px
}
.about-modern-vision{
  background:#f5f9fc;
  padding:120px 0
}
.about-vision-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:16px
}
.about-vision-card{
  position:relative;
  min-height:340px;
  background:#fff;
  border:1px solid #dfeaf3;
  border-radius:25px;
  padding:34px;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(15,66,112,.05)
}
.about-vision-card.primary{
  background:linear-gradient(145deg,#eaf8ff,#fff)
}
.about-vision-card>span{
  font:800 9px 'Manrope';
  letter-spacing:.2em;
  color:#1676d3
}
.about-vision-number{
  position:absolute;
  right:25px;
  top:22px;
  color:#c9ddeb;
  font:800 58px 'Manrope';
  letter-spacing:-.08em
}
.about-vision-card h3{
  position:absolute;
  left:34px;
  right:34px;
  bottom:34px;
  margin:0;
  color:#0a315d;
  font:800 clamp(21px,2.4vw,31px)/1.25 'Manrope';
  letter-spacing:-.035em
}
.about-modern-principles{
  background:#fff;
  padding:120px 0
}
.about-modern-principles .about-modern-section-head{
  margin-bottom:40px
}
.about-modern-principles .about-modern-section-head h2 em{
  color:transparent;
  -webkit-text-stroke:1px #1676d3
}
.about-principle-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  border-top:1px solid #dfe8ef
}
.about-principle-list article{
  display:grid;
  grid-template-columns:70px 1fr;
  gap:20px;
  padding:27px 0;
  border-bottom:1px solid #dfe8ef
}
.about-principle-list article:nth-child(odd){
  padding-right:40px;
  border-right:1px solid #dfe8ef
}
.about-principle-list article:nth-child(even){
  padding-left:40px
}
.about-principle-list article>b{
  font:800 12px 'Manrope';
  color:#1590eb
}
.about-principle-list h3{
  margin:0 0 7px;
  color:#0a315d;
  font:800 17px 'Manrope'
}
.about-principle-list p{
  margin:0;
  color:#6b8094;
  font-size:12px;
  line-height:1.8
}
.about-modern-people{
  background:#061a35;
  color:#fff;
  padding:120px 0;
  overflow:hidden
}
.about-people-grid{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:80px;
  align-items:center
}
.about-people-copy h2{
  font:800 clamp(35px,4.5vw,60px)/1 'Manrope';
  letter-spacing:-.055em;
  margin:20px 0
}
.about-people-copy h2 em{
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.8)
}
.about-people-copy>p{
  color:#b9cce0;
  max-width:620px;
  font-size:13px;
  line-height:1.9
}
.about-discipline-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:25px
}
.about-discipline-tags span{
  padding:8px 11px;
  border:1px solid rgba(126,211,255,.25);
  border-radius:999px;
  color:#a9dffb;
  background:rgba(255,255,255,.04);
  font-size:10px
}
.about-people-visual{
  position:relative
}
.about-people-visual:before{
  content:'';
  position:absolute;
  inset:-18px 18px 18px -18px;
  border:1px solid rgba(103,207,255,.24);
  border-radius:25px
}
.about-people-visual img{
  position:relative;
  width:100%;
  height:500px;
  object-fit:cover;
  border-radius:25px;
  filter:saturate(.8) contrast(1.05)
}
.about-visual-note{
  position:absolute;
  right:-20px;
  bottom:24px;
  width:180px;
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.1);
  backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.18)
}
.about-visual-note small{
  display:block;
  color:#7fd8ff;
  font:800 8px 'Manrope';
  letter-spacing:.16em
}
.about-visual-note strong{
  display:block;
  font:800 22px 'Manrope';
  margin-top:7px
}
.about-visual-note span{
  display:block;
  color:#b8cde1;
  font-size:10px;
  margin-top:3px
}
@media(max-width:900px){
  .about-modern-hero{
    min-height:680px;
    height:auto;
    padding:150px 0 90px
  }
  .about-modern-intro-grid,.about-people-grid{
    grid-template-columns:1fr;
    gap:35px
  }
  .about-modern-stats{
    grid-template-columns:repeat(2,1fr)
  }
  .about-modern-stats>div:nth-child(2){
    border-right:0
  }
  .about-capability-grid{
    grid-template-columns:1fr
  }
  .about-vision-grid{
    grid-template-columns:1fr
  }
  .about-principle-list{
    grid-template-columns:1fr
  }
  .about-principle-list article:nth-child(odd){
    padding-right:0;
    border-right:0
  }
  .about-principle-list article:nth-child(even){
    padding-left:0
  }
  .about-people-visual img{
    height:420px
  }
  .about-visual-note{
    right:12px
  }
}
@media(max-width:560px){
  .about-modern-hero h1{
    font-size:42px
  }
  .about-modern-hero p{
    font-size:14px
  }
  .about-modern-actions{
    align-items:flex-start;
    flex-direction:column;
    gap:18px
  }
  .about-modern-coord{
    position:static;
    margin-top:45px
  }
  .about-modern-intro,.about-modern-capabilities,.about-modern-vision,.about-modern-principles,.about-modern-people{
    padding:85px 0
  }
  .about-modern-stats{
    margin-top:45px
  }
  .about-modern-stats>div{
    padding:20px 15px
  }
  .about-modern-stats strong{
    font-size:34px
  }
  .about-capability-grid article{
    min-height:320px;
    padding:25px
  }
  .about-capability-grid article>i{
    margin-bottom:55px
  }
  .about-vision-card{
    min-height:360px;
    padding:26px
  }
  .about-vision-card h3{
    left:26px;
    right:26px;
    bottom:27px;
    font-size:21px
  }
  .about-principle-list article{
    grid-template-columns:48px 1fr;
    gap:10px
  }
  .about-people-visual img{
    height:340px
  }
  .about-visual-note{
    right:8px;
    bottom:15px;
    width:160px
  }
}
/* Struktur organisasi modern */
.about-org-modern{
  position:relative;
  padding:26px;
  border:1px solid rgba(105,205,255,.18);
  border-radius:28px;
  background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  box-shadow:0 28px 70px rgba(0,0,0,.18);
  overflow:hidden
}
.about-org-modern:before{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(109,207,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(109,207,255,.055) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(135deg,#000,transparent 82%);
  pointer-events:none
}
.org-chart-head{
  position:relative;
  text-align:center;
  padding:4px 0 20px;
  border-bottom:1px solid rgba(255,255,255,.09);
  margin-bottom:22px
}
.org-chart-head span{
  display:block;
  color:#70d5ff;
  font:800 8px 'Manrope';
  letter-spacing:.2em
}
.org-chart-head b{
  display:block;
  margin-top:7px;
  color:#fff;
  font:800 17px 'Manrope';
  letter-spacing:-.02em
}
.org-chart-head small{
  display:block;
  margin-top:4px;
  color:#89a8c2;
  font-size:9px
}
.org-level{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  gap:12px
}
.org-level-management{
  max-width:510px;
  margin:0 auto
}
.org-level-specialists{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px
}
.org-level-support{
  max-width:510px;
  margin:0 auto
}
.org-level-admin{
  margin-top:0
}
.org-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:220px;
  padding:13px 14px;
  border-radius:15px;
  border:1px solid rgba(112,214,255,.18);
  background:rgba(7,35,68,.74);
  backdrop-filter:blur(12px);
  box-shadow:0 12px 30px rgba(0,0,0,.12);
  transition:transform .28s ease,border-color .28s ease,background .28s ease
}
.org-card:hover{
  transform:translateY(-4px);
  border-color:rgba(112,214,255,.5);
  background:rgba(9,51,91,.86)
}
.org-card i{
  flex:0 0 35px;
  width:35px;
  height:35px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#71d6ff;
  background:rgba(73,193,255,.1);
  border:1px solid rgba(113,214,255,.16);
  font-size:13px
}
.org-card small{
  display:block;
  color:#76d6ff;
  font:800 7px/1.25 'Manrope';
  letter-spacing:.12em;
  margin-bottom:5px
}
.org-card strong{
  display:block;
  color:#fff;
  font:700 11px/1.35 'Manrope'
}
.org-card-supervisory{
  min-width:245px;
  justify-content:center;
  background:linear-gradient(145deg,rgba(17,91,145,.75),rgba(7,38,72,.82));
  border-color:rgba(111,211,255,.34)
}
.org-card-supervisory strong{
  font-size:12px
}
.org-card-specialist{
  min-width:0;
  display:block;
  padding:15px 12px;
  text-align:center
}
.org-card-specialist i{
  margin:0 auto 10px
}
.org-card-specialist small{
  font-size:6.5px
}
.org-card-specialist strong{
  font-size:9.5px
}
.org-card-admin{
  min-width:260px;
  justify-content:center;
  background:rgba(8,48,84,.9)
}
.org-connector{
  position:relative;
  z-index:1
}
.org-connector-vertical{
  width:1px;
  height:24px;
  margin:0 auto;
  background:linear-gradient(#70d5ff,rgba(112,213,255,.25))
}
.org-connector-vertical.short{
  height:18px
}
.org-connector-branch{
  height:22px;
  margin:0 12.5%;
  border-top:1px solid rgba(112,213,255,.35);
  position:relative
}
.org-connector-branch:before,.org-connector-branch:after{
  content:'';
  position:absolute;
  top:-1px;
  width:1px;
  height:22px;
  background:rgba(112,213,255,.35)
}
.org-connector-branch:before{
  left:0
}
.org-connector-branch:after{
  right:0
}
.org-connector-lower{
  margin-left:25%;
  margin-right:25%
}
.org-chart-foot{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:20px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.08);
  color:#9db8cf;
  font-size:9px;
  line-height:1.5
}
.org-chart-foot i{
  color:#6ed5ff
}
@media(max-width:980px){
  .org-level-specialists{
    grid-template-columns:repeat(2,1fr)
  }
  .org-connector-branch{
    margin-left:25%;
    margin-right:25%
  }
  .org-connector-lower{
    margin-left:25%;
    margin-right:25%
  }
}
@media(max-width:560px){
  .about-org-modern{
    padding:18px;
    border-radius:22px
  }
  .org-level-management,.org-level-support{
    display:grid;
    grid-template-columns:1fr;
    max-width:none
  }
  .org-level-specialists{
    grid-template-columns:1fr
  }
  .org-connector-branch,.org-connector-lower{
    display:none
  }
  .org-level{
    gap:9px
  }
  .org-card{
    min-width:0;
    width:100%;
    padding:12px
  }
  .org-card-supervisory,.org-card-admin{
    min-width:0
  }
  .org-card-specialist{
    display:flex;
    text-align:left
  }
  .org-card-specialist i{
    margin:0;
    flex:0 0 35px
  }
  .org-card-specialist small{
    font-size:6.5px
  }
  .org-chart-foot{
    font-size:8.5px
  }
}
/* =========================================================
   HERO HALAMAN — GAYA BANNER SEPERTI SKR
   ========================================================= */
.skr-page-hero{
  min-height:360px;
  padding:145px 0 72px;
  position:relative;
  overflow:hidden;
  color:#fff;
  background-color:#06101d;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.skr-page-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(3,14,28,.92),rgba(3,35,66,.68) 55%,rgba(3,35,66,.25));
}
.skr-page-hero:after{
  content:"";
  position:absolute;
  inset:0;
  opacity:.12;
  background-image:linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px);
  background-size:70px 70px;
  mask-image:linear-gradient(90deg,#000,transparent 82%);
}
.skr-page-hero-inner{
  position:relative;
  z-index:2;
  max-width:1240px
}
.skr-page-hero-kicker{
  font:800 10px/1 'Manrope',sans-serif;
  letter-spacing:.19em;
  color:#62c9ff;
  text-transform:uppercase;
  margin-bottom:17px
}
.skr-page-hero-kicker span{
  color:#a9c3d9;
  padding:0 7px
}
.skr-page-hero h1{
  font:800 clamp(40px,5vw,62px)/1 'Manrope',sans-serif;
  letter-spacing:-.055em;
  margin:0 0 12px;
  color:#fff
}
.skr-page-hero p{
  max-width:690px;
  margin:0;
  color:#d1deeb;
  font-size:14px;
  line-height:1.75
}
.skr-hero-about{
  background-image:url('../img/hero-lake.jpg')
}
.skr-hero-services{
  background-image:url('../img/drone.jpg')
}
.skr-hero-projects{
  background-image:url('../img/survey-forest.jpg')
}
.skr-hero-contact{
  background-image:url('../img/fieldwork.jpg')
}
.ibu-contact-info-modern{
  background:#fff;
  padding:90px 0
}
.ibu-contact-info-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:80px;
  align-items:center
}
.ibu-contact-info-grid h2{
  font:800 clamp(34px,4.5vw,58px)/1.02 'Manrope';
  letter-spacing:-.055em;
  color:#0a2f6d;
  margin:15px 0
}
.ibu-contact-info-grid h2 em{
  font-style:normal;
  color:#1686e8
}
.ibu-contact-info-grid>div>p{
  max-width:620px;
  color:#667b94;
  font-size:14px;
  line-height:1.8
}
.ibu-contact-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px
}
.ibu-contact-links a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 15px;
  border:1px solid #d6e7f4;
  border-radius:999px;
  color:#0a4f91;
  font:700 12px 'Manrope';
  background:#f7fbff
}
.ibu-contact-links i{
  color:#0878e8
}
.ibu-contact-card{
  padding:32px;
  border:1px solid #d7e7f3;
  border-radius:24px;
  background:linear-gradient(145deg,#eef9ff,#fff);
  box-shadow:0 20px 45px rgba(20,92,145,.08)
}
.ibu-contact-card>span{
  font:800 9px 'Manrope';
  letter-spacing:.18em;
  color:#1483e7
}
.ibu-contact-card h3{
  font:800 22px 'Manrope';
  color:#0a2f6d;
  margin:14px 0
}
.ibu-contact-card p{
  font-size:13px;
  line-height:1.8;
  color:#617995;
  margin-bottom:24px
}
@media(max-width:700px){
  .skr-page-hero{
    min-height:300px;
    padding:125px 0 55px
  }
  .skr-page-hero h1{
    font-size:39px
  }
  .skr-page-hero p{
    font-size:13px
  }
  .ibu-contact-info-modern{
    padding:65px 0
  }
  .ibu-contact-info-grid{
    grid-template-columns:1fr;
    gap:35px
  }
  .ibu-contact-links{
    flex-direction:column;
    align-items:stretch
  }
}
/* =========================================================
   KONTAK — GAYA MENGIKUTI HALAMAN KONTAK SKR
   ========================================================= */
.contact-map{
  position:relative;
  height:330px;
  overflow:hidden;
  background:#dfeaf3
}
.contact-map iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  filter:saturate(.88) contrast(1.02)
}
.contact-map-location-card{
  position:absolute;
  left:max(24px,calc((100% - 1240px)/2));
  bottom:24px;
  display:flex;
  align-items:center;
  gap:13px;
  max-width:360px;
  padding:14px 17px;
  border:1px solid rgba(255,255,255,.5);
  border-radius:15px;
  background:rgba(7,26,51,.91);
  color:#fff;
  box-shadow:0 15px 35px rgba(4,18,36,.22);
  backdrop-filter:blur(12px)
}
.contact-map-location-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:rgba(39,200,255,.12);
  border:1px solid rgba(112,213,255,.25);
  color:#67d2ff
}
.contact-map-location-card strong{
  display:block;
  font:800 12px/1.3 'Manrope',sans-serif;
  letter-spacing:.02em
}
.contact-map-location-card span{
  display:block;
  margin-top:3px;
  color:#c7d6e6;
  font:500 10px/1.55 'Manrope',sans-serif
}
.ibu-contact-skr{
  padding-top:62px;
  background:#f6f8fb
}
.ibu-contact-panel{
  background:linear-gradient(180deg,#071f3b 0%,#0a3158 100%);
  border-color:rgba(112,214,255,.16);
  box-shadow:0 18px 45px rgba(7,31,59,.08)
}
.ibu-contact-panel:after{
  background:rgba(39,200,255,.08)
}
.ibu-contact-panel h2{
  color:#fff
}
.ibu-contact-panel .contact-accent{
  width:34px;
  height:3px;
  border-radius:3px;
  background:#55d3ff;
  margin-bottom:18px
}
.contact-panel-lead{
  color:#bcd0e3;
  font-size:12px;
  line-height:1.75;
  margin:-13px 0 27px;
  max-width:410px
}
.ibu-contact-panel .contact-info-item strong{
  color:#fff
}
.ibu-contact-panel .contact-info-item p,.ibu-contact-panel .contact-info-item a{
  color:#c8d8e8
}
.ibu-contact-panel .contact-info-item a:hover{
  color:#fff
}
.ibu-contact-panel .contact-info-icon{
  background:rgba(79,200,255,.11);
  border-color:rgba(112,214,255,.18);
  color:#6bd5ff
}
.ibu-contact-panel .contact-info-divider{
  background:rgba(255,255,255,.11)
}
.contact-info-note{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:25px;
  padding:11px 12px;
  border:1px solid rgba(112,214,255,.14);
  border-radius:11px;
  background:rgba(255,255,255,.045);
  color:#a9c2d8;
  font-size:10px;
  line-height:1.55
}
.contact-info-note i{
  color:#69d5ff;
  margin-top:2px
}
.contact-modern-form{
  border-color:#dbe6f0;
  box-shadow:0 18px 45px rgba(15,35,60,.08)
}
.contact-form-heading{
  padding-bottom:22px;
  margin-bottom:22px;
  border-bottom:1px solid #e4ebf2
}
.contact-form-heading>span{
  font:800 9px/1 'Manrope',sans-serif;
  letter-spacing:.18em;
  color:#1483e7
}
.contact-form-heading h2{
  font:800 28px/1.12 'Manrope',sans-serif;
  letter-spacing:-.04em;
  color:#0a2f6d;
  margin:12px 0 8px
}
.contact-form-heading p{
  font-size:12px;
  line-height:1.7;
  color:#68798d;
  max-width:600px;
  margin:0
}
.contact-field label{
  color:#172b42
}
.contact-field label span{
  color:#1686e8
}
.contact-field input,.contact-field select,.contact-field textarea{
  border-color:#d5e1ec;
  border-radius:10px
}
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus{
  border-color:#79bfe9;
  box-shadow:0 0 0 3px rgba(18,102,227,.08)
}
.contact-captcha{
  margin-top:20px;
  padding:13px 15px;
  border:1px solid #dbe6ef;
  border-radius:12px;
  background:#f8fbfe
}
.captcha-question{
  font:800 14px/1 'Manrope',sans-serif;
  color:#0a2f6d;
  letter-spacing:.06em
}
.captcha-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:9px
}
.captcha-row input{
  width:110px;
  height:39px;
  border:1px solid #d5e1ec;
  border-radius:8px;
  padding:8px 10px;
  font:700 12px 'Manrope',sans-serif
}
.captcha-refresh{
  width:39px;
  height:39px;
  border:1px solid #d5e1ec;
  border-radius:8px;
  background:#fff;
  color:#1478d0;
  cursor:pointer
}
.contact-captcha small{
  display:block;
  margin-top:6px;
  color:#7b8999;
  font-size:9px
}
.privacy-check{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:18px;
  color:#69788a;
  font-size:10px;
  line-height:1.55
}
.privacy-check input{
  margin-top:2px;
  accent-color:#1478d0
}
.privacy-check a{
  color:#1478d0;
  font-weight:700
}
.ibu-contact-submit{
  background:#1266e3;
  border-radius:10px;
  height:45px;
  margin-top:20px
}
.ibu-contact-submit:hover{
  background:#0d57c4
}
.ibu-contact-bottom{
  padding-top:90px;
  padding-bottom:100px;
  background:#fff
}
/* =========================================================
   KONTAK — FINAL CLEANUP
   ========================================================= */
.contact-map{
  position:relative;
  height:330px;
  overflow:hidden;
  background:#dfeaf3;
  border-top:1px solid #d9e3ed
}
.contact-map{
  margin-top:78px
}
.contact-map iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  filter:saturate(.9) contrast(1.02)
}
.contact-map:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(5,25,50,.04),transparent 35%,rgba(5,25,50,.06))
}
.contact-map-location-card{
  position:absolute;
  z-index:4;
  left:max(24px,calc((100% - 1240px)/2));
  bottom:24px;
  display:flex;
  align-items:flex-start;
  gap:13px;
  width:340px;
  max-width:calc(100% - 48px);
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.75);
  border-radius:14px;
  background:rgba(255,255,255,.96);
  color:#143b66;
  box-shadow:0 15px 35px rgba(4,18,36,.18);
  backdrop-filter:blur(8px)
}
.contact-map-location-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:#1266e3;
  color:#fff;
  font-size:16px
}
.contact-map-location-card strong{
  display:block;
  font:800 13px/1.3 'Manrope',sans-serif;
  letter-spacing:.01em
}
.contact-map-location-card span{
  display:block;
  margin-top:5px;
  color:#526b85;
  font:500 10.5px/1.55 'Manrope',sans-serif
}
.contact-map-pin{
  position:absolute;
  z-index:5;
  left:54%;
  top:46%;
  transform:translate(-50%,-100%);
  pointer-events:none
}
.contact-map-pin span{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  background:#e53935;
  border:4px solid #fff;
  box-shadow:0 7px 18px rgba(0,0,0,.25)
}
.contact-map-pin i{
  transform:rotate(45deg);
  color:#fff;
  font-size:18px
}
.contact-map-pin:after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-13px;
  transform:translateX(-50%);
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(229,57,53,.35);
  box-shadow:0 0 0 7px rgba(229,57,53,.10)
}
.contact-map-pin-label{
  position:absolute;
  z-index:5;
  left:calc(54% + 25px);
  top:38%;
  pointer-events:none;
  padding:8px 12px;
  border-radius:8px;
  background:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.15);
  border:1px solid #e3e8ee;
  color:#123b66
}
.contact-map-pin-label:before{
  content:"";
  position:absolute;
  left:-6px;
  top:14px;
  width:10px;
  height:10px;
  background:#fff;
  border-left:1px solid #e3e8ee;
  border-bottom:1px solid #e3e8ee;
  transform:rotate(45deg)
}
.contact-map-pin-label strong,.contact-map-pin-label small{
  position:relative;
  display:block
}
.contact-map-pin-label strong{
  font:800 11px/1.2 'Manrope',sans-serif
}
.contact-map-pin-label small{
  margin-top:2px;
  color:#667b91;
  font:500 9px/1.2 'Manrope',sans-serif
}
.ibu-contact-skr{
  padding:58px 0 80px;
  background:#f6f8fb
}
.contact-modern{
  display:grid;
  grid-template-columns:minmax(310px,.78fr) minmax(0,1.22fr);
  gap:26px;
  align-items:stretch
}
.ibu-contact-panel{
  min-width:0;
  padding:34px 32px;
  border-radius:22px;
  background:linear-gradient(180deg,#071f3b 0%,#0a3158 100%);
  border:1px solid rgba(112,214,255,.16);
  box-shadow:0 18px 45px rgba(7,31,59,.12);
  position:relative;
  overflow:hidden
}
.ibu-contact-panel:after{
  content:"";
  position:absolute;
  right:-100px;
  bottom:-110px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(39,200,255,.08);
  pointer-events:none
}
.ibu-contact-panel h2{
  color:#fff;
  font:800 31px/1.08 'Manrope',sans-serif;
  letter-spacing:-.035em;
  margin:0 0 14px
}
.ibu-contact-panel .contact-accent{
  width:34px;
  height:3px;
  border-radius:3px;
  background:#55d3ff;
  margin-bottom:18px
}
.contact-panel-lead{
  color:#bcd0e3;
  font-size:12px;
  line-height:1.75;
  margin:0 0 27px;
  max-width:410px
}
.contact-info-item{
  display:flex;
  align-items:flex-start;
  gap:13px;
  min-width:0
}
.ibu-contact-panel .contact-info-item strong{
  display:block;
  color:#fff;
  font:800 12px/1.3 'Manrope',sans-serif
}
.ibu-contact-panel .contact-info-item p,.ibu-contact-panel .contact-info-item a{
  margin:5px 0 0;
  color:#c8d8e8;
  font:500 11px/1.65 'Manrope',sans-serif;
  overflow-wrap:anywhere
}
.ibu-contact-panel .contact-info-item a:hover{
  color:#fff
}
.ibu-contact-panel .contact-info-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(79,200,255,.11);
  border:1px solid rgba(112,214,255,.18);
  color:#6bd5ff;
  font-size:13px
}
.ibu-contact-panel .contact-info-divider{
  height:1px;
  background:rgba(255,255,255,.11);
  margin:17px 0
}
.contact-info-note{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:25px;
  padding:11px 12px;
  border:1px solid rgba(112,214,255,.14);
  border-radius:11px;
  background:rgba(255,255,255,.045);
  color:#a9c2d8;
  font-size:10px;
  line-height:1.55
}
.contact-info-note i{
  color:#69d5ff;
  margin-top:2px
}
.contact-modern-form{
  min-width:0;
  margin:0;
  padding:32px 34px;
  border:1px solid #dbe6f0;
  border-radius:22px;
  background:#fff;
  box-shadow:0 18px 45px rgba(15,35,60,.08)
}
.contact-alert{
  padding:11px 13px;
  border-radius:9px;
  font-size:11px;
  margin-bottom:18px
}
.contact-alert.success{
  background:#eaf8ef;
  color:#16733b;
  border:1px solid #bce7ca
}
.contact-alert.error{
  background:#fff0f0;
  color:#a42b2b;
  border:1px solid #f0c7c7
}
.contact-form-heading{
  padding-bottom:20px;
  margin-bottom:21px;
  border-bottom:1px solid #e4ebf2
}
.contact-form-heading>span{
  font:800 9px/1 'Manrope',sans-serif;
  letter-spacing:.18em;
  color:#1483e7
}
.contact-form-heading h2{
  font:800 27px/1.12 'Manrope',sans-serif;
  letter-spacing:-.04em;
  color:#0a2f6d;
  margin:10px 0 7px
}
.contact-form-heading p{
  font-size:11.5px;
  line-height:1.7;
  color:#68798d;
  max-width:650px;
  margin:0
}
.contact-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px 16px
}
.contact-field{
  min-width:0
}
.contact-field.full{
  grid-column:1/-1
}
.contact-field label{
  display:block;
  margin-bottom:6px;
  color:#172b42;
  font:700 10.5px/1.2 'Manrope',sans-serif
}
.contact-field label span{
  color:#1686e8
}
.contact-field input,.contact-field select,.contact-field textarea{
  display:block;
  width:100%;
  margin:0;
  padding:10px 12px;
  border:1px solid #d5e1ec;
  border-radius:9px;
  background:#fff;
  color:#172b42;
  font:500 11px/1.4 'Manrope',sans-serif;
  outline:none;
  transition:.2s
}
.contact-field input,.contact-field select{
  height:40px
}
.contact-field textarea{
  height:92px;
  resize:vertical;
  min-height:92px
}
.contact-field input::placeholder,.contact-field textarea::placeholder{
  color:#9aa8b7
}
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus{
  border-color:#79bfe9;
  box-shadow:0 0 0 3px rgba(18,102,227,.08)
}
.contact-captcha{
  display:grid;
  grid-template-columns:145px minmax(0,1fr);
  gap:10px;
  align-items:center;
  margin-top:18px;
  padding:10px 12px;
  border:1px solid #dbe6ef;
  border-radius:11px;
  background:#f8fbfe
}
.captcha-question{
  height:39px;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:#eef2f5;
  color:#1d2936;
  font:800 14px/1 'Manrope',sans-serif;
  letter-spacing:.1em;
  text-decoration:line-through;
  text-decoration-color:#8a929a
}
.captcha-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0
}
.captcha-row input{
  width:100%;
  height:39px;
  border:1px solid #d5e1ec;
  border-radius:8px;
  padding:8px 10px;
  font:700 12px 'Manrope',sans-serif
}
.captcha-refresh{
  width:39px;
  height:39px;
  flex:0 0 39px;
  border:1px solid #d5e1ec;
  border-radius:8px;
  background:#fff;
  color:#1478d0;
  cursor:pointer
}
.contact-captcha small{
  grid-column:1/-1;
  display:block;
  margin:0;
  color:#7b8999;
  font-size:9px
}
.privacy-check{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:15px;
  color:#69788a;
  font-size:10px;
  line-height:1.55
}
.privacy-check input{
  margin-top:2px;
  accent-color:#1478d0;
  flex:0 0 auto
}
.privacy-check a{
  color:#1478d0;
  font-weight:700
}
.ibu-contact-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  background:#1266e3;
  color:#fff;
  border:0;
  border-radius:9px;
  height:45px;
  margin-top:17px;
  font:800 11px 'Manrope',sans-serif;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(18,102,227,.18);
  transition:.2s
}
.ibu-contact-submit:hover{
  background:#0d57c4;
  transform:translateY(-1px)
}
.ibu-contact-bottom{
  padding:72px 0 88px;
  background:#fff
}
.contact-reasons{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:28px
}
.contact-reasons>div{
  padding:22px;
  border:1px solid #e2eaf2;
  border-radius:16px;
  background:#f8fbff
}
.contact-reasons b{
  display:inline-grid;
  place-items:center;
  width:29px;
  height:29px;
  border-radius:8px;
  background:#e8f3ff;
  color:#1266e3;
  font:800 9px 'Manrope'
}
.contact-reasons h3{
  margin:14px 0 7px;
  color:#0a315d;
  font:800 15px 'Manrope'
}
.contact-reasons p{
  margin:0;
  color:#68798d;
  font-size:11px;
  line-height:1.7
}
.nav-whatsapp{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:auto!important;
  height:40px!important;
  min-width:137px!important;
  padding:0 15px!important;
  border-radius:9px!important;
  background:#20c76a!important;
  color:#fff!important;
  opacity:1!important;
  box-shadow:0 7px 20px rgba(32,199,106,.20);
  font:800 11px 'Manrope',sans-serif!important;
  white-space:nowrap;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease!important
}
.nav-whatsapp i{
  font-size:19px!important
}
.nav-whatsapp:hover{
  transform:translateY(-2px);
  background:#18b95f!important;
  box-shadow:0 10px 26px rgba(32,199,106,.30)
}
.nav-whatsapp:after{
  display:none!important
}
@media(max-width:1050px){
  .contact-modern{
    grid-template-columns:1fr 1.25fr;
    gap:18px
  }
  .ibu-contact-panel{
    padding:28px 25px
  }
  .contact-modern-form{
    padding:28px 25px
  }
  .nav-menu{
    gap:18px
  }
  .nav-whatsapp{
    min-width:125px!important;
    padding:0 12px!important
  }
}
@media(max-width:900px){
  .contact-modern{
    grid-template-columns:1fr
  }
  .contact-info-panel{
    min-height:auto
  }
  .contact-map{
    height:290px
  }
  .contact-map-pin{
    left:57%
  }
  .contact-map-pin-label{
    left:calc(57% + 25px)
  }
}
@media(max-width:700px){
  .skr-page-hero{
    min-height:300px;
    padding:125px 0 55px
  }
  .contact-map{
    height:300px
  }
  .contact-map-location-card{
    left:16px;
    right:16px;
    bottom:14px;
    width:auto;
    max-width:none;
    padding:11px 13px
  }
  .contact-map-location-icon{
    width:33px;
    height:33px;
    flex-basis:33px
  }
  .contact-map-location-card strong{
    font-size:11px
  }
  .contact-map-location-card span{
    font-size:9px
  }
  .contact-map-pin{
    left:63%;
    top:43%;
    transform:translate(-50%,-100%) scale(.82)
  }
  .contact-map-pin-label{
    display:none
  }
  .ibu-contact-skr{
    padding-top:42px
  }
  .contact-modern-form{
    padding:24px 18px
  }
  .contact-form-grid{
    grid-template-columns:1fr;
    gap:14px
  }
  .contact-field.full{
    grid-column:auto
  }
  .contact-form-heading h2{
    font-size:23px
  }
  .contact-captcha{
    grid-template-columns:1fr
  }
  .captcha-question{
    width:100%
  }
  .captcha-row{
    width:100%
  }
  .nav-whatsapp{
    min-width:0!important;
    width:auto!important;
    height:38px!important;
    padding:0 12px!important;
    font-size:10px!important
  }
  .nav-whatsapp i{
    font-size:17px!important
  }
  .nav-menu .nav-whatsapp{
    margin-top:5px
  }
}
/* Contact page final cleanup */
.contact-map-pin,.contact-map-pin-label{
  display:none!important
}
@media(max-width:700px){
  .contact-map{
    margin-top:68px
  }
}
/* =========================================================
   HEADER / FAVICON / BACK TO TOP — UPDATE
   ========================================================= */
.site-header .brand-name strong{
  font-size:18px!important;
  line-height:1.05!important;
  letter-spacing:.015em!important
}
.site-header .brand-name small{
  font-size:8.5px!important;
  letter-spacing:.18em!important;
  margin-top:6px!important
}
.back-to-top{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:1100;
  width:44px;
  height:44px;
  border:1px solid rgba(18,102,227,.18);
  border-radius:11px;
  background:#1266e3;
  color:#fff;
  display:grid;
  place-items:center;
  box-shadow:0 10px 26px rgba(18,102,227,.25);
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .25s ease,visibility .25s ease,transform .25s ease,background .2s ease
}
.back-to-top.show{
  opacity:1;
  visibility:visible;
  transform:none
}
.back-to-top:hover{
  background:#0d57c4;
  transform:translateY(-2px)
}
.back-to-top i{
  font-size:14px
}
@media(max-width:620px){
  .site-header .brand-name strong{
    font-size:14px!important
  }
  .site-header .brand-name small{
    font-size:6.5px!important;
    letter-spacing:.10em!important
  }
  .back-to-top{
    right:14px;
    bottom:16px;
    width:40px;
    height:40px;
    border-radius:10px
  }
  .back-to-top i{
    font-size:13px
  }
}
/* Counter labels: satu baris */
.stats-light .counter-item span{
  white-space:nowrap;
  display:block;
}
@media(max-width:700px){
  .stats-light .counter-item span{
    font-size:10px;
    letter-spacing:-.02em;
  }
}
/* =========================================================
   BERANDA — LAYANAN & COUNTER BIRU TUA + KLIEN KAMI
   ========================================================= */
.service-card-light{
  background:#0a2f6d;
  border-color:#0a2f6d;
  box-shadow:0 16px 35px rgba(7,39,87,.12)
}
.service-card-light:hover{
  background:#08285d;
  border-color:#08285d;
  box-shadow:0 22px 48px rgba(7,39,87,.24)
}
.service-card-light .service-card-text h3{
  color:#fff
}
.service-card-light .service-card-text p{
  color:rgba(255,255,255,.78)
}
.service-card-light .service-card-text span{
  color:#8edcff
}
.service-card-text small{
  color:#8edcff
}
.service-card-light img{
  opacity:1!important;
  filter:none!important;
}
.service-icon{
  color:#fff;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  width:38px;
  height:38px;
  border-radius:10px;
  display:grid;
  place-items:center
}
.stats-light{
  border:0;
  border-radius:20px;
  background:#0a2f6d;
  box-shadow:0 18px 40px rgba(7,39,87,.16);
  overflow:hidden
}
.stats-light>div{
  border-right:1px solid rgba(255,255,255,.13);
  background:#0a2f6d
}
.stats-light>div:last-child{
  border-right:0
}
.stats-light strong{
  color:#fff
}
.stats-light span{
  color:rgba(255,255,255,.78)
}
.clients-showcase-light{
  padding:88px 0 105px;
  background:#f5f9fd
}
.clients-section-head{
  margin-bottom:34px
}
.client-grid-light{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px
}
.client-card-light{
  min-height:104px;
  padding:20px 20px 18px;
  border:1px solid #dce7f1;
  border-radius:16px;
  background:#fff;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:15px;
  box-shadow:0 10px 28px rgba(18,58,95,.045);
  transition:.28s ease
}
.client-card-light:hover{
  transform:translateY(-4px);
  border-color:#b8d2e8;
  box-shadow:0 16px 35px rgba(18,58,95,.09)
}
.client-card-light span{
  color:#1684ea;
  font:800 9px 'Plus Jakarta Sans';
  letter-spacing:.14em
}
.client-card-light strong{
  color:#0a2f6d;
  font:800 12px/1.4 'Plus Jakarta Sans';
  letter-spacing:-.01em
}
@media(max-width:980px){
  .client-grid-light{
    grid-template-columns:repeat(2,1fr)
  }
}
@media(max-width:620px){
  .clients-showcase-light{
    padding:70px 0 80px
  }
  .client-grid-light{
    grid-template-columns:1fr
  }
  .client-card-light{
    min-height:88px;
    padding:17px
  }
  .stats-light{
    border-radius:16px
  }
  .stats-light>div{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.13)
  }
  .stats-light>div:nth-child(2){
    border-right:0
  }
  .stats-light>div:nth-child(3),.stats-light>div:nth-child(4){
    border-bottom:0
  }
  .service-card-light{
    background:#0a2f6d
  }
}
/* KLIEN KAMI — MARQUEE CONTINUOUS SEAMLESS */
.clients-showcase-light{
  padding:88px 0 105px;
  background:#f5f9fd
}
.clients-section-head{
  display:block;
  text-align:center;
  margin-bottom:30px
}
.clients-section-title{
  text-align:center;
  width:100%
}
.clients-section-title .eyebrow-light{
  display:block;
  text-align:center
}
.clients-section-title h2{
  text-align:center;
  margin:8px 0 0
}
.client-logo-marquee{
  position:relative;
  overflow:hidden;
  width:100%;
  padding:8px 0 14px;
  cursor:default;
  touch-action:pan-y
}
.client-logo-marquee::before,.client-logo-marquee::after{
  content:"";
  position:absolute;
  z-index:3;
  top:0;
  bottom:0;
  width:48px;
  pointer-events:none
}
.client-logo-marquee::before{
  left:0;
  background:linear-gradient(90deg,#f5f9fd 0%,rgba(245,249,253,0) 100%)
}
.client-logo-marquee::after{
  right:0;
  background:linear-gradient(270deg,#f5f9fd 0%,rgba(245,249,253,0) 100%)
}
.client-logo-track{
  display:flex;
  align-items:center;
  width:max-content;
  gap:0;
  will-change:transform;
  animation:clientLogoMarquee 28s linear infinite;
  animation-play-state:running;
  transform:translate3d(0,0,0)
}
.client-logo-group{
  display:flex;
  align-items:center;
  gap:4px;
  flex:0 0 auto;
  padding-right:4px
}
.client-logo-card{
  flex:0 0 132px;
  width:132px;
  height:78px;
  padding:7px 9px;
  border:1px solid #dce7f1;
  border-radius:0;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 5px 14px rgba(18,58,95,.045);
  transition:none
}
.client-logo-card img{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
  filter:none!important;
  opacity:1!important
}
@keyframes clientLogoMarquee{
  from{
    transform:translate3d(0,0,0)
  }
  to{
    transform:translate3d(calc(-1 * var(--marquee-shift, 0px)),0,0)
  }
}
@media(max-width:620px){
  .clients-showcase-light{
    padding:70px 0 80px
  }
  .clients-section-head{
    margin-bottom:24px
  }
  .client-logo-marquee{
    padding:5px 0 12px
  }
  .client-logo-track{
    animation-duration:24s
  }
  .client-logo-group{
    gap:3px;
    padding-right:3px
  }
  .client-logo-card{
    flex-basis:108px;
    width:108px;
    height:64px;
    padding:6px 7px;
    border-radius:0
  }
  .client-logo-marquee::before,.client-logo-marquee::after{
    width:30px
  }
}

/* =========================================================
   TENTANG KAMI — COMPACT MODERN OVERRIDE
   ========================================================= */
.skr-hero-about{
  min-height:300px;
  padding:118px 0 52px;
}
.skr-hero-about .skr-page-hero-kicker{margin-bottom:12px;font-size:9px}
.skr-hero-about h1{font-size:clamp(34px,4.2vw,52px);margin-bottom:9px}
.skr-hero-about p{max-width:650px;font-size:12px;line-height:1.65}
.about-modern-intro{padding:68px 0 58px}
.about-modern-intro-grid{grid-template-columns:.42fr 1.58fr;gap:48px}
.about-modern-label{gap:9px;font-size:9px}
.about-modern-label span{font-size:10px}
.about-modern-lead{font-size:clamp(20px,2.4vw,30px);line-height:1.2;margin-bottom:18px}
.about-modern-intro-copy>p:not(.about-modern-lead){font-size:12px;line-height:1.75;margin-bottom:10px}
.about-modern-stats{margin-top:42px}
.about-modern-stats>div{padding:18px 20px}
.about-modern-stats small{font-size:7px}
.about-modern-stats strong{font-size:32px;margin:7px 0 3px}
.about-modern-stats span{font-size:10px}
.about-modern-capabilities{padding:68px 0}
.about-modern-section-head{margin-bottom:30px}
.about-modern-section-head h2{font-size:clamp(28px,3.5vw,46px);margin:14px 0 10px}
.about-modern-section-head>p{font-size:12px;line-height:1.7;max-width:620px}
.about-capability-grid{gap:12px}
.about-capability-grid article{min-height:255px;padding:22px;border-radius:17px}
.about-capability-grid article>span{top:18px;right:20px;font-size:8px}
.about-capability-grid article>i{width:42px;height:42px;border-radius:12px;margin-bottom:38px;font-size:14px}
.about-capability-grid h3{font-size:17px;margin-bottom:8px}
.about-capability-grid p{font-size:11px;line-height:1.65}
.about-capability-grid a{left:22px;bottom:18px;font-size:9px}
.about-modern-vision{padding:68px 0}
.about-vision-grid{gap:12px}
.about-vision-card{min-height:245px;padding:24px;border-radius:17px}
.about-vision-card>span{font-size:8px}
.about-vision-number{right:19px;top:16px;font-size:44px}
.about-vision-card h3{left:24px;right:24px;bottom:24px;font-size:20px;line-height:1.22}
.about-modern-principles{padding:68px 0}
.about-modern-principles .about-modern-section-head{margin-bottom:28px}
.about-principle-list article{grid-template-columns:52px 1fr;gap:14px;padding:20px 0}
.about-principle-list article:nth-child(odd){padding-right:25px}
.about-principle-list article:nth-child(even){padding-left:25px}
.about-principle-list h3{font-size:15px;margin-bottom:5px}
.about-principle-list p{font-size:11px;line-height:1.65}
.about-modern-people{padding:68px 0}
.about-people-grid{gap:45px}
.about-people-copy h2{font-size:clamp(29px,3.6vw,48px);margin:14px 0}
.about-people-copy>p{font-size:12px;line-height:1.75}
.about-discipline-tags{gap:6px;margin-top:18px}
.about-discipline-tags span{padding:6px 9px;font-size:9px}
.about-org-modern{padding:20px;border-radius:20px}
.org-chart-head{padding:2px 0 15px;margin-bottom:16px}
.org-chart-head b{font-size:15px;margin-top:5px}
.org-card{min-width:0;padding:10px 11px;border-radius:12px;gap:8px}
.org-card i{flex-basis:30px;width:30px;height:30px;border-radius:9px;font-size:11px}
.org-card small{font-size:7px}
.org-card strong{font-size:10px}
.org-level{gap:8px}
.org-level-specialists{gap:7px}
.org-chart-foot{font-size:9px}
@media(max-width:900px){
  .skr-hero-about{min-height:280px;padding:112px 0 48px}
  .about-modern-intro,.about-modern-capabilities,.about-modern-vision,.about-modern-principles,.about-modern-people{padding:58px 0}
  .about-modern-intro-grid,.about-people-grid{gap:28px}
  .about-modern-stats{margin-top:32px}
  .about-capability-grid article{min-height:235px}
  .about-vision-card{min-height:220px}
  .about-principle-list article:nth-child(odd){padding-right:0;border-right:0}
  .about-principle-list article:nth-child(even){padding-left:0}
  .org-level-specialists{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .skr-hero-about{min-height:260px;padding:105px 0 42px}
  .skr-hero-about h1{font-size:34px}
  .skr-hero-about p{font-size:11px;line-height:1.6}
  .about-modern-intro,.about-modern-capabilities,.about-modern-vision,.about-modern-principles,.about-modern-people{padding:48px 0}
  .about-modern-intro-grid{gap:22px}
  .about-modern-stats{grid-template-columns:repeat(2,1fr)}
  .about-modern-stats>div{padding:16px 13px}
  .about-modern-stats strong{font-size:28px}
  .about-capability-grid article{min-height:225px;padding:20px}
  .about-capability-grid article>i{margin-bottom:32px}
  .about-vision-card{min-height:210px;padding:21px}
  .about-vision-card h3{left:21px;right:21px;bottom:21px;font-size:18px}
  .about-principle-list article{grid-template-columns:40px 1fr;gap:9px;padding:17px 0}
  .about-principle-list h3{font-size:14px}
  .about-principle-list p{font-size:10.5px}
  .about-org-modern{padding:14px}
  .org-level-specialists{grid-template-columns:1fr}
  .org-level-management,.org-level-support{max-width:none}
  .org-card{width:100%}
}

/* =========================================================
   IBU ABOUT 2026 — DETAIL / COMPACT MODERN
   ========================================================= */
.ibu-about-hero{position:relative;background:linear-gradient(135deg,#eef8ff 0%,#f8fbfe 58%,#e9f4fb 100%);border-bottom:1px solid #dceaf4;overflow:hidden}
.ibu-about-hero:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-150px;top:-210px;background:rgba(8,120,232,.07);pointer-events:none}
.ibu-about-hero-inner{min-height:330px;padding:88px 0 62px;display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:50px;align-items:center}
.ibu-about-kicker,.ibu-detail-hero-inner>span{display:inline-block;color:#0878e8;font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;margin-bottom:15px}
.ibu-about-hero h1,.ibu-detail-hero h1{margin:0;max-width:820px;color:#103b70;font-size:clamp(38px,5vw,66px);line-height:1.02;letter-spacing:-.045em;font-weight:800}
.ibu-about-hero h1 em,.ibu-detail-hero h1 em{color:#0878e8;font-style:normal}
.ibu-about-hero p,.ibu-detail-hero p{max-width:760px;margin:18px 0 0;color:#587493;font-size:15px;line-height:1.75}
.ibu-about-year{justify-self:end;border-left:1px solid #cfe2ef;padding-left:28px}.ibu-about-year strong{display:block;color:#103b70;font-size:44px;line-height:1;font-weight:800}.ibu-about-year span{display:block;color:#6a829b;font-size:12px;margin-top:8px}
.ibu-about-nav-section{padding:24px 0 8px;background:#fff}.ibu-about-nav-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.ibu-about-nav-card{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:13px;min-height:82px;padding:17px 19px;border:1px solid #dbeaf4;border-radius:14px;background:#fff;color:#103b70;box-shadow:0 8px 24px rgba(16,59,112,.05);transition:.2s ease}.ibu-about-nav-card:hover,.ibu-about-nav-card.active{border-color:#b9d9ee;box-shadow:0 12px 30px rgba(16,59,112,.09);transform:translateY(-2px)}.ibu-about-nav-card>span{font-size:10px;font-weight:800;color:#9ab0c5}.ibu-about-nav-card>i:not(.arrow){font-size:21px;color:#0878e8}.ibu-about-nav-card div small{display:block;color:#7890a7;font-size:9px;font-weight:800;letter-spacing:.13em}.ibu-about-nav-card div strong{display:block;font-size:14px;margin-top:3px}.ibu-about-nav-card .arrow{font-size:13px;color:#0878e8}
.ibu-about-profile,.ibu-about-vision,.ibu-about-principles,.ibu-about-management{padding:74px 0}.ibu-section-intro{display:grid;grid-template-columns:220px minmax(0,1fr);gap:50px;align-items:start;margin-bottom:38px}.ibu-section-intro.compact{margin-bottom:28px}.ibu-section-label{display:flex;align-items:center;gap:10px;color:#0878e8;font-size:10px;letter-spacing:.15em;font-weight:800}.ibu-section-label span{font-size:11px;color:#9bb2c6}.ibu-section-intro h2{margin:0;color:#103b70;font-size:clamp(28px,3.2vw,44px);line-height:1.08;letter-spacing:-.035em}.ibu-section-intro h2 em{color:#0878e8;font-style:normal}.ibu-section-intro p{margin:13px 0 0;color:#607a95;line-height:1.75;font-size:14px;max-width:760px}
.ibu-profile-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px}.ibu-profile-main{padding:28px 30px;border:1px solid #dceaf4;border-radius:16px;background:#fff}.ibu-profile-main p{margin:0 0 15px;color:#536d87;font-size:14px;line-height:1.8}.ibu-profile-main p:last-child{margin-bottom:0}.ibu-profile-facts{display:grid;grid-template-columns:1fr;gap:12px}.ibu-profile-facts>div{padding:18px 20px;border:1px solid #dceaf4;border-radius:14px;background:#f7fbfe}.ibu-profile-facts small{display:block;color:#7991a8;font-size:9px;font-weight:800;letter-spacing:.12em}.ibu-profile-facts strong{display:block;color:#103b70;font-size:27px;margin-top:5px}.ibu-profile-facts span{color:#6b8298;font-size:11px}
.ibu-about-focus{padding:72px 0;background:#103b70}.ibu-section-intro.light .ibu-section-label,.ibu-section-intro.light h2{color:#fff}.ibu-section-intro.light .ibu-section-label span{color:#78a2c3}.ibu-section-intro.light h2 em{color:#65b9ff}.ibu-section-intro.light p{color:#b9d0e3}.ibu-focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.ibu-focus-grid article{position:relative;min-height:270px;padding:24px;border:1px solid rgba(255,255,255,.13);border-radius:15px;background:rgba(255,255,255,.055);overflow:hidden}.ibu-focus-grid article>span{position:absolute;right:20px;top:17px;color:#72c0ff;font-size:10px;font-weight:800}.ibu-focus-grid article>i{font-size:24px;color:#66b9ff}.ibu-focus-grid h3{margin:17px 0 9px;color:#fff;font-size:19px}.ibu-focus-grid p{margin:0;color:#b8cfe2;font-size:13px;line-height:1.7}.ibu-focus-grid a{display:inline-flex;gap:8px;margin-top:20px;color:#74c2ff;font-size:12px;font-weight:700}.ibu-focus-grid a i{font-size:10px}
.ibu-vision-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.ibu-vision-grid article{position:relative;padding:30px;border:1px solid #dceaf4;border-radius:16px;background:#f8fbfe;min-height:190px}.ibu-vision-grid article.primary{background:#eaf6ff;border-color:#c8e4f7}.ibu-vision-grid small{color:#0878e8;font-size:10px;font-weight:800;letter-spacing:.16em}.ibu-vision-grid span{position:absolute;right:25px;top:23px;color:#a7bfd3;font-size:11px;font-weight:800}.ibu-vision-grid p{max-width:750px;margin:20px 0 0;color:#244b70;font-size:18px;line-height:1.55;font-weight:700}
.ibu-about-principles{background:linear-gradient(180deg,#f5faff 0%,#ffffff 100%)}
.ibu-principles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:22px}
.ibu-principles-grid article{position:relative;overflow:hidden;min-height:190px;padding:24px 23px 22px;border:1px solid #d7e8f5;border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 8px 24px rgba(16,59,112,.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.ibu-principles-grid article::before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:linear-gradient(90deg,#07449e,#0878e8,#66baf5)}
.ibu-principles-grid article::after{content:"";position:absolute;right:-35px;top:-35px;width:105px;height:105px;border-radius:50%;background:radial-gradient(circle,rgba(8,120,232,.10) 0%,rgba(8,120,232,0) 70%);pointer-events:none}
.ibu-principles-grid article:hover{transform:translateY(-4px);border-color:#b9d8ed;box-shadow:0 14px 32px rgba(16,59,112,.11)}
.ibu-principles-grid b{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:#edf7ff;border:1px solid #cfe5f5;color:#07449e;font-size:11px;font-weight:800;letter-spacing:.03em}
.ibu-principles-grid h3{margin:17px 0 8px;color:#103b70;font-size:16px;line-height:1.3;font-weight:800}
.ibu-principles-grid p{margin:0;color:#637c94;font-size:12.5px;line-height:1.72}
@media(max-width:900px){.ibu-principles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.ibu-principles-grid{grid-template-columns:1fr;gap:12px}.ibu-principles-grid article{min-height:0;padding:21px}.ibu-principles-grid h3{font-size:15px}.ibu-principles-grid p{font-size:12px}}
.ibu-about-management{padding-top:72px}.ibu-management-banner{display:flex;align-items:center;justify-content:space-between;gap:35px;padding:34px 38px;border-radius:18px;background:linear-gradient(135deg,#0c4e83,#103b70);box-shadow:0 16px 40px rgba(16,59,112,.14)}.ibu-management-banner .ibu-section-label{color:#78c3ff}.ibu-management-banner h2{margin:12px 0 8px;color:#fff;font-size:29px;line-height:1.15}.ibu-management-banner p{max-width:700px;margin:0;color:#b9d0e3;font-size:13px;line-height:1.7}.ibu-management-actions{display:flex;flex-direction:column;gap:10px;min-width:220px}.ibu-management-actions a{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;border:1px solid rgba(255,255,255,.2);border-radius:10px;color:#fff;font-size:12px;font-weight:700;background:rgba(255,255,255,.06)}.ibu-management-actions a:hover{background:rgba(255,255,255,.12)}
.ibu-detail-hero{background:linear-gradient(135deg,#edf7ff,#f8fbfe);border-bottom:1px solid #dceaf4}.ibu-detail-hero-inner{padding:78px 0 58px}.ibu-detail-page{padding:25px 0 80px}.ibu-detail-back{margin-bottom:26px}.ibu-detail-back a{display:inline-flex;align-items:center;gap:8px;color:#0878e8;font-size:12px;font-weight:700}.ibu-detail-block{padding:34px 0;border-top:1px solid #e2edf5}.ibu-detail-block:first-of-type{border-top:0}.ibu-table-wrap{margin-top:18px;overflow-x:auto;border:1px solid #d9e8f2;border-radius:14px;background:#fff}.ibu-data-table{width:100%;border-collapse:collapse;min-width:700px}.ibu-data-table th{padding:13px 15px;text-align:left;background:#103b70;color:#fff;font-size:11px;font-weight:800}.ibu-data-table td{padding:13px 15px;border-top:1px solid #e3edf4;color:#526d88;font-size:12.5px;line-height:1.55;vertical-align:top}.ibu-data-table tbody tr:nth-child(even){background:#f7fbfe}.ibu-data-table td:first-child{font-weight:800;color:#103b70}.ibu-legal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:18px}.ibu-legal-grid article{padding:20px;border:1px solid #dbe9f3;border-radius:14px;background:#fff}.ibu-legal-grid i{color:#0878e8;font-size:20px}.ibu-legal-grid small{display:block;margin-top:14px;color:#7a92a8;font-size:9px;font-weight:800;letter-spacing:.13em}.ibu-legal-grid strong{display:block;color:#103b70;font-size:14px;line-height:1.45;margin-top:6px}.ibu-legal-grid p{margin:7px 0 0;color:#688199;font-size:11px;line-height:1.6}.ibu-source-note{display:flex;gap:12px;margin-top:28px;padding:16px 18px;border:1px solid #cfe5f4;border-radius:12px;background:#eef8ff;color:#55728e}.ibu-source-note i{color:#0878e8;margin-top:2px}.ibu-source-note p{margin:0;font-size:11.5px;line-height:1.65}
.ibu-management-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.ibu-management-grid article{padding:24px;border:1px solid #dbe9f3;border-radius:15px;background:#fff;box-shadow:0 8px 25px rgba(16,59,112,.05)}.ibu-management-grid small{display:block;color:#0878e8;font-size:9px;font-weight:800;letter-spacing:.13em}.ibu-management-grid i{display:block;margin:17px 0 10px;color:#0878e8;font-size:24px}.ibu-management-grid strong{color:#103b70;font-size:17px}.ibu-share-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}.ibu-share-grid article{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:18px;padding:18px 20px;border:1px solid #dbe9f3;border-radius:14px;background:#f7fbfe}.ibu-share-grid strong{color:#103b70;font-size:14px}.ibu-share-grid b{color:#58738d;font-size:12px}.ibu-share-grid span{display:inline-flex;align-items:center;justify-content:center;width:50px;height:32px;border-radius:8px;background:#0878e8;color:#fff;font-size:11px;font-weight:800}
.ibu-org-chart{margin-top:22px;padding:30px 25px;border:1px solid #d8e7f2;border-radius:18px;background:#f8fbfe;overflow-x:auto}.ibu-org-node{position:relative;min-width:170px;padding:14px 16px;border:1px solid #b9d8ea;border-radius:10px;background:#fff;text-align:center;box-shadow:0 6px 18px rgba(16,59,112,.05)}.ibu-org-node.top,.ibu-org-node.primary{background:#e9f6ff;border-color:#a9d7f2}.ibu-org-node.admin{background:#edf8f1;border-color:#b7ddc3}.ibu-org-node small{display:block;color:#0878e8;font-size:8.5px;font-weight:800;letter-spacing:.09em;line-height:1.35}.ibu-org-node strong{display:block;margin-top:6px;color:#103b70;font-size:12px;line-height:1.35}.ibu-org-node.top{width:230px;margin:0 auto}.ibu-org-row{display:flex;justify-content:center;gap:12px;min-width:max-content}.ibu-org-row.management .ibu-org-node{min-width:210px}.ibu-org-row.specialists .ibu-org-node{width:205px}.ibu-org-row.support .ibu-org-node{width:230px}.ibu-org-node.admin{width:240px;margin:0 auto}.ibu-org-line{height:30px;width:1px;margin:0 auto;background:#9bb8cc;position:relative}.ibu-org-line:before{content:"";position:absolute;left:50%;top:0;width:calc(100% + 0px);height:1px;background:#9bb8cc;transform:translateX(-50%)}.ibu-org-line.short{height:24px}
.ibu-sdm-intro{margin:18px 0}.ibu-sdm-intro p{max-width:1000px;margin:0;color:#5c758e;font-size:13px;line-height:1.8}.ibu-sdm-table{min-width:820px}

/* Sumber Daya Manusia — tabel modern */
.ibu-sdm-intro{display:none !important}
.ibu-sdm-table{min-width:860px;width:100%;border-collapse:separate;border-spacing:0;overflow:hidden}
.ibu-sdm-table thead th{padding:14px 16px;background:#07449e;color:#fff;text-align:center;font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;border:0;white-space:nowrap}
.ibu-sdm-table thead th:first-child{border-radius:12px 0 0 0;text-align:center;width:72px}
.ibu-sdm-table thead th:last-child{border-radius:0 12px 0 0;width:110px}
.ibu-sdm-table tbody tr{background:#fff;transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.ibu-sdm-table tbody tr:nth-child(even){background:#f8fbfe}
.ibu-sdm-table tbody tr:hover{background:#eef8ff;box-shadow:inset 3px 0 0 #0878e8}
.ibu-sdm-table td{padding:14px 16px;border-top:1px solid #e5eef5;color:#526d88;font-size:12px;line-height:1.5;vertical-align:middle}
.ibu-sdm-table td:first-child{text-align:center;border-left:0}
.ibu-sdm-table td:nth-child(2){color:#103b70;font-weight:750}
.ibu-sdm-table td:nth-child(3){white-space:nowrap;color:#315a7e;font-weight:650}
.ibu-sdm-table td:nth-child(4){color:#5d7690}
.ibu-sdm-table td:last-child{white-space:nowrap}
.ibu-sdm-no{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:#eaf6ff;color:#0878e8;font-size:10px;font-weight:800;border:1px solid #cce6f7}
.ibu-sdm-status{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;background:#edf9f2;color:#18824a;border:1px solid #ccebd9;font-size:10px;font-weight:800;line-height:1}
.ibu-sdm-status:before{content:"";width:6px;height:6px;border-radius:50%;background:#28a866;box-shadow:0 0 0 3px rgba(40,168,102,.10)}
@media(max-width:900px){.ibu-sdm-table{min-width:760px}.ibu-sdm-table th,.ibu-sdm-table td{padding:12px 13px}}
@media(max-width:600px){.ibu-sdm-table{min-width:700px}.ibu-sdm-table td{font-size:11px}.ibu-sdm-no{width:27px;height:27px}}

.nav-dropdown-about{position:relative}.dropdown-about-all{min-width:255px}.dropdown-about-all a{display:grid;grid-template-columns:26px 1fr;align-items:center;gap:8px}.dropdown-about-all a span{color:#77a6c9;font-size:9px;font-weight:800}
@media(max-width:900px){.ibu-about-hero-inner{grid-template-columns:1fr;min-height:auto;padding:70px 0 48px}.ibu-about-year{justify-self:start;border-left:0;border-top:1px solid #cfe2ef;padding:15px 0 0}.ibu-about-nav-grid,.ibu-focus-grid,.ibu-principles-grid,.ibu-legal-grid{grid-template-columns:1fr}.ibu-section-intro,.ibu-profile-grid{grid-template-columns:1fr;gap:20px}.ibu-profile-facts{grid-template-columns:repeat(3,1fr)}.ibu-vision-grid,.ibu-management-grid,.ibu-share-grid{grid-template-columns:1fr}.ibu-management-banner{flex-direction:column;align-items:flex-start}.ibu-management-actions{width:100%;min-width:0}.ibu-org-chart{padding:25px 15px}.ibu-org-row.specialists{justify-content:flex-start}.ibu-detail-hero-inner{padding:62px 0 45px}}
@media(max-width:600px){.ibu-about-hero h1,.ibu-detail-hero h1{font-size:38px}.ibu-about-nav-card{grid-template-columns:auto auto 1fr auto;min-height:72px;padding:14px}.ibu-profile-facts{grid-template-columns:1fr}.ibu-about-profile,.ibu-about-vision,.ibu-about-principles,.ibu-about-management{padding:55px 0}.ibu-section-intro{margin-bottom:26px}.ibu-focus-grid article{min-height:0}.ibu-vision-grid p{font-size:16px}.ibu-management-banner{padding:26px 22px}.ibu-org-chart{overflow-x:auto}.ibu-org-row{justify-content:flex-start}.ibu-data-table{font-size:11px}.ibu-table-wrap{border-radius:10px}}


/* Tentang Kami - navigasi dibuat lebih sederhana */
.ibu-about-nav-section { display:none !important; }
.ibu-management-links { display:flex; align-items:center; justify-content:flex-end; gap:12px; margin-top:18px; flex-wrap:wrap; }
.ibu-management-links a { color:#0b74d1; font-weight:700; font-size:14px; text-decoration:none; }
.ibu-management-links a:hover { text-decoration:underline; }
.ibu-management-links span { color:rgba(11,48,95,.35); }
@media (max-width: 700px) {
  .ibu-management-links { justify-content:flex-start; }
}

/* =========================================================
   HERO AI — TEMA HUTAN, DRONE & GEOSPASIAL
   ========================================================= */
.ibu-about-hero{
  position:relative;
  background-image:url('../img/hero-about-ai.jpg');
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  color:#fff;
  border-bottom:0;
}
.ibu-about-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(3,18,35,.90) 0%,rgba(4,39,68,.68) 48%,rgba(4,39,68,.18) 100%);
  pointer-events:none;
}
.ibu-about-hero:after{
  width:auto;
  height:auto;
  border-radius:0;
  right:0;
  top:0;
  background:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);
  background-size:70px 70px;
  opacity:.12;
  mask-image:linear-gradient(90deg,#000,transparent 88%);
}
.ibu-about-hero-inner{position:relative;z-index:2}
.ibu-about-hero h1{color:#fff}
.ibu-about-hero h1 em{color:#62c9ff}
.ibu-about-hero p{color:#dceaf6}
.ibu-about-kicker{color:#62c9ff}
.ibu-about-year{border-color:rgba(255,255,255,.25);color:#fff}
.ibu-about-year span{color:#dceaf6}

.skr-hero-services{
  background-image:url('../img/hero-services-ai.jpg');
}
.skr-hero-projects{
  background-image:url('../img/hero-projects-ai.jpg');
}

@media(max-width:900px){
  .ibu-about-hero{
    background-position:62% center;
  }
  .skr-hero-services,
  .skr-hero-projects{
    background-position:62% center;
  }
}

/* ===== LAYANAN — SPACING & CARD COMPACT ===== */
@media (min-width: 901px){
  .skr-hero-services + .service-list-modern{
    padding-top: 54px;
  }
}

.service-list-modern{
  padding-top: 48px;
  padding-bottom: 70px;
  background:#f7fbff;
}

.service-modern-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.service-modern-card{
  min-height:360px;
  border-radius:18px;
  padding:21px;
  box-shadow:0 5px 18px rgba(30,100,150,.035);
  transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}

.service-modern-card:before{
  display:none;
}

.service-modern-card:hover{
  transform:translateY(-2px);
  border-color:#b8d9ef;
  box-shadow:0 12px 28px rgba(28,109,165,.08);
}

.service-card-top>span{
  font-size:11px;
}

.service-card-top i{
  width:36px;
  height:36px;
  border-radius:10px;
  font-size:13px;
}

.service-card-body{
  margin-top:27px;
}

.service-card-body small{
  font-size:8px;
}

.service-card-body h3{
  font-size:27px;
  line-height:1.08;
  margin:8px 0 11px;
}

.service-card-body>p{
  font-size:12px;
  line-height:1.6;
}

.service-detail{
  margin-top:17px;
  padding-top:13px;
}

.service-detail>b{
  font-size:9px;
  line-height:1.45;
}

.service-detail ul{
  margin-top:7px;
  padding-left:16px;
  font-size:10px;
  line-height:1.65;
}

.service-detail-btn{
  margin-top:16px;
  padding:8px 12px;
  border-radius:8px;
  font-size:10px;
  gap:9px;
}

@media(max-width:1100px){
  .service-modern-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:900px){
  .service-list-modern{
    padding-top:38px;
  }
}

@media(max-width:620px){
  .service-list-modern{
    padding-top:28px;
    padding-bottom:55px;
  }
  .service-modern-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .service-modern-card{
    min-height:0;
    padding:18px;
    border-radius:15px;
  }
  .service-card-body{
    margin-top:23px;
  }
  .service-card-body h3{
    font-size:25px;
  }
}

/* ===== LAYANAN: 2 CARD DESKTOP + IKON MODERN ===== */
@media (min-width: 901px){
  .service-modern-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:22px;
  }
}

.service-modern-card{
  min-height:370px;
  padding:24px;
  border-radius:20px;
}

.service-card-top i{
  position:relative;
  width:54px;
  height:54px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#ffffff 0%,#eaf7ff 100%);
  border:1px solid #cfe7f7;
  color:#0878e8;
  font-size:20px;
  box-shadow:0 10px 24px rgba(8,120,232,.12), inset 0 1px 0 rgba(255,255,255,.95);
  overflow:hidden;
}


.service-card-top i{
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  font-family:'Font Awesome 6 Free';
  font-weight:900;
  font-style:normal;
  position:relative;
  z-index:1;
}

.service-modern-card:hover .service-card-top i{
  transform:translateY(-2px) scale(1.04);
  border-color:#a9d5f2;
  box-shadow:0 14px 28px rgba(8,120,232,.16),inset 0 1px 0 rgba(255,255,255,.95);
}

.featured .service-card-top i{
  background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.08));
  border-color:rgba(255,255,255,.28);
  color:#fff;
  box-shadow:0 10px 24px rgba(0,52,110,.16),inset 0 1px 0 rgba(255,255,255,.18);
}


.service-card-body{
  margin-top:32px;
}

.service-card-body h3{
  font-size:clamp(24px,2.4vw,34px);
  margin:8px 0 12px;
}

.service-card-body>p{
  font-size:12.5px;
  line-height:1.65;
}

.service-detail{
  margin-top:19px;
  padding-top:14px;
}

.service-detail ul{
  margin-top:8px;
  font-size:10.5px;
  line-height:1.7;
}

@media(max-width:900px){
  .service-modern-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:620px){
  .service-modern-card{
    min-height:0;
    padding:20px;
  }
  .service-card-top i{
    width:48px;
    height:48px;
    border-radius:14px;
    font-size:18px;
  }
}


/* Lightbox foto project */
.project-lightbox-trigger{
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  cursor:zoom-in;
}
.project-lightbox-trigger img{
  display:block;
}
.project-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
  background:rgba(3,18,35,.88);
  backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .25s ease,visibility .25s ease;
}
.project-lightbox.show{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.project-lightbox-stage{
  position:relative;
  max-width:min(1100px,92vw);
  max-height:88vh;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.project-lightbox-stage img{
  display:block;
  max-width:92vw;
  max-height:82vh;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:14px;
  box-shadow:0 30px 80px rgba(0,0,0,.38);
}
.project-lightbox-caption{
  margin-top:12px;
  color:#fff;
  font:700 12px/1.4 Inter,sans-serif;
  text-align:center;
}
.project-lightbox-close{
  position:absolute;
  top:22px;
  right:22px;
  width:44px;
  height:44px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(255,255,255,.12);
  color:#fff;
  display:grid;
  place-items:center;
  cursor:pointer;
  font-size:17px;
  z-index:2;
  transition:.2s ease;
}
.project-lightbox-close:hover{
  background:#0878e8;
  border-color:#0878e8;
}
body.lightbox-open{
  overflow:hidden;
}
@media(max-width:620px){
  .project-lightbox{
    padding:18px;
  }
  .project-lightbox-close{
    top:14px;
    right:14px;
    width:40px;
    height:40px;
  }
  .project-lightbox-stage img{
    max-width:94vw;
    max-height:78vh;
    border-radius:10px;
  }
}

/* Tentang Kami — posisi kicker di atas heading dan rata tengah.
   Hero dibiarkan menggunakan styling aslinya. */
.ibu-section-intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
}

.ibu-section-intro > div:last-child {
  width: 100%;
}

.ibu-section-intro .ibu-section-label {
  justify-content: center;
  width: 100%;
}

.ibu-section-intro h2,
.ibu-section-intro p {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.ibu-management-banner > div:first-child {
  text-align: center;
}

.ibu-management-banner > div:first-child .ibu-section-label {
  justify-content: center;
}

@media (max-width: 900px) {
  .ibu-section-intro {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}


/* =========================================================
   TENTANG KAMI — KICKER & DESKRIPSI TERPUSAT
   ========================================================= */
.ibu-about-profile .ibu-section-intro,
.ibu-about-focus .ibu-section-intro,
.ibu-about-vision .ibu-section-intro,
.ibu-about-principles .ibu-section-intro,
.ibu-about-management .ibu-management-banner,
.ibu-about-inline-detail .ibu-detail-block > .ibu-section-label,
.ibu-about-inline-detail .ibu-detail-heading {
  text-align:center;
}

.ibu-about-profile .ibu-section-intro > div:last-child,
.ibu-about-focus .ibu-section-intro > div:last-child,
.ibu-about-vision .ibu-section-intro > div:last-child,
.ibu-about-principles .ibu-section-intro > div:last-child {
  text-align:center;
}

.ibu-about-profile .ibu-section-intro > div:last-child > p,
.ibu-about-focus .ibu-section-intro > div:last-child > p,
.ibu-about-vision .ibu-section-intro > div:last-child > p,
.ibu-about-principles .ibu-section-intro > div:last-child > p,
.ibu-about-management .ibu-management-banner p,
.ibu-about-inline-detail .ibu-detail-heading > p {
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}

.ibu-about-profile .ibu-section-label,
.ibu-about-focus .ibu-section-label,
.ibu-about-vision .ibu-section-label,
.ibu-about-principles .ibu-section-label,
.ibu-about-management .ibu-section-label,
.ibu-about-inline-detail .ibu-section-label {
  justify-content:center;
  text-align:center;
}


/* Tentang Kami — deskripsi seluruh section rata kiri-kanan (justify).
   Hero tetap menggunakan styling hero asli. */
.ibu-about-profile p,
.ibu-about-vision p,
.ibu-about-principles p,
.ibu-about-management p,
.ibu-about-inline-detail p,
.ibu-profile-main p {
  text-align: justify !important;
}

/* Ruang Keahlian dihapus dari halaman Tentang Kami. */


/* =========================================================
   TENTANG KAMI — DESKRIPSI DI BAWAH HEADING
   Semua deskripsi non-hero rata tengah dan satu baris.
   ========================================================= */
.ibu-about-profile .ibu-section-intro p,
.ibu-about-vision .ibu-section-intro p,
.ibu-about-principles .ibu-section-intro p,
.ibu-about-inline-detail .ibu-detail-heading > p,
.ibu-about-inline-detail .ibu-sdm-intro p {
  text-align: center !important;
  white-space: nowrap;
  max-width: none;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Deskripsi pada kartu/isi non-hero juga dipusatkan. */
.ibu-principles-grid article p,
.ibu-legal-grid article p {
  text-align: center !important;
}

/* Banner Organisasi & Manajemen dihapus; informasi organisasi tetap ada
   pada bagian detail #organisasi. */
.ibu-about-management {
  display: none !important;
}

@media (max-width: 900px) {
  .ibu-about-profile .ibu-section-intro p,
  .ibu-about-vision .ibu-section-intro p,
  .ibu-about-principles .ibu-section-intro p,
  .ibu-about-inline-detail .ibu-detail-heading > p {
    font-size: 11px;
    white-space: nowrap;
  }
}

/* =========================================================
   TENTANG KAMI — KICKER PROFIL PERUSAHAAN
   ========================================================= */
.ibu-about-profile .ibu-section-label {
  position:relative;
  display:inline-flex;
  width:auto;
  min-height:36px;
  padding:0 17px;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#0b67c8;
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  line-height:1;
  text-transform:uppercase;
  background:linear-gradient(135deg,#eef8ff 0%,#ffffff 100%);
  border:1px solid #c8e3f5;
  border-radius:999px;
  box-shadow:0 8px 22px rgba(16,79,130,.08), inset 0 1px 0 rgba(255,255,255,.95);
  overflow:visible;
}

.ibu-about-profile .ibu-section-label::before,
.ibu-about-profile .ibu-section-label::after {
  content:"";
  display:block;
  flex:0 0 auto;
  height:5px;
  border-radius:50%;
}

.ibu-about-profile .ibu-section-label::before {
  width:5px;
  background:#0878e8;
  box-shadow:0 0 0 4px rgba(8,120,232,.10);
}

.ibu-about-profile .ibu-section-label::after {
  width:24px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#0878e8,#62c9ff);
}

.ibu-about-profile .ibu-section-label b {
  position:relative;
  z-index:1;
  white-space:nowrap;
}

.ibu-about-profile .ibu-section-intro {
  gap:16px;
}

@media (max-width:600px) {
  .ibu-about-profile .ibu-section-label {
    min-height:33px;
    padding:0 14px;
    font-size:9px;
    letter-spacing:.14em;
  }

  .ibu-about-profile .ibu-section-label::after {
    width:18px;
  }
}

/* =========================================================
   GLOBAL KICKER — PIL / BADGE MODERN
   Berlaku untuk seluruh halaman publik website IBU.
   Hero menggunakan versi transparan agar tetap menyatu
   dengan gambar latar.
   ========================================================= */

/* Kicker pada section terang */
.ibu-section-label,
.eyebrow-light,
.footer-kicker,
.service-card-body > small {
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  min-height:32px;
  padding:7px 14px;
  gap:8px;
  box-sizing:border-box;
  border:1px solid #c8e3f5;
  border-radius:999px;
  background:linear-gradient(135deg,#eef8ff 0%,#ffffff 100%);
  color:#0b67c8;
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  box-shadow:0 7px 20px rgba(16,79,130,.07), inset 0 1px 0 rgba(255,255,255,.95);
  white-space:nowrap;
}

/* Aksen titik kecil */
.ibu-section-label::before,
.eyebrow-light::before,
.footer-kicker::before,
.service-card-body > small::before {
  content:"";
  width:5px;
  height:5px;
  flex:0 0 5px;
  border-radius:50%;
  background:#0878e8;
  box-shadow:0 0 0 4px rgba(8,120,232,.09);
}

/* Kicker hero halaman internal */
.skr-page-hero-kicker,
.ibu-about-kicker {
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  min-height:34px;
  padding:8px 15px;
  gap:8px;
  box-sizing:border-box;
  border:1px solid rgba(98,201,255,.34);
  border-radius:999px;
  background:rgba(4,32,57,.42);
  color:#8bdcff !important;
  font-size:10px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:.17em !important;
  text-transform:uppercase;
  box-shadow:0 8px 24px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  white-space:nowrap;
}

.skr-page-hero-kicker::before,
.ibu-about-kicker::before {
  content:"";
  width:5px;
  height:5px;
  flex:0 0 5px;
  border-radius:50%;
  background:#62c9ff;
  box-shadow:0 0 0 4px rgba(98,201,255,.12);
}

/* Kicker hero beranda */
.hero-kicker {
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  min-height:34px;
  padding:8px 15px;
  gap:8px;
  box-sizing:border-box;
  border:1px solid rgba(98,201,255,.32);
  border-radius:999px;
  background:rgba(5,34,63,.52);
  color:#9bdefc !important;
  font-size:10px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:.17em !important;
  text-transform:uppercase;
  box-shadow:0 8px 24px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  white-space:nowrap;
}

.hero-kicker > span {
  display:block;
  width:5px !important;
  height:5px !important;
  flex:0 0 5px;
  margin:0 !important;
  border-radius:50%;
  background:#62c9ff;
  box-shadow:0 0 0 4px rgba(98,201,255,.12);
}

/* Profil perusahaan tetap menggunakan desain khususnya,
   tetapi mengikuti sistem badge global. */
.ibu-about-profile .ibu-section-label {
  min-height:36px;
  padding:0 17px;
  border-color:#c8e3f5;
}

/* Hilangkan efek aksen lama yang bertabrakan dengan badge global */
.ibu-about-profile .ibu-section-label::after {
  display:none;
}

/* Kicker kartu layanan dibuat lebih ringkas */
.service-card-body > small {
  min-height:26px;
  padding:5px 10px;
  font-size:8px;
  letter-spacing:.13em;
  box-shadow:none;
}
.service-card-body > small::before {
  width:4px;
  height:4px;
  flex-basis:4px;
  box-shadow:0 0 0 3px rgba(8,120,232,.08);
}

/* Footer kicker lebih kecil agar tetap proporsional */
.footer-kicker {
  min-height:27px;
  padding:6px 10px;
  font-size:8px;
  letter-spacing:.14em;
  box-shadow:none;
}
.footer-kicker::before {
  width:4px;
  height:4px;
  flex-basis:4px;
  box-shadow:0 0 0 3px rgba(8,120,232,.08);
}

@media (max-width:700px){
  .ibu-section-label,
  .eyebrow-light,
  .skr-page-hero-kicker,
  .ibu-about-kicker,
  .hero-kicker {
    font-size:8px !important;
    letter-spacing:.13em !important;
    min-height:30px;
    padding:7px 11px;
  }

  .service-card-body > small {
    max-width:calc(100vw - 70px);
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* =========================================================
   KICKER FINAL — PILL/BADGE UNTUK KICKER NON-HERO
   - Border biru muda
   - Shadow halus
   - Titik aksen + garis gradasi biru
   - Bentuk pill modern
   ========================================================= */
.ibu-section-label,
.eyebrow-light,
.footer-kicker,
.service-card-body > small {
  position:relative;
  overflow:visible;
  border:1px solid #c8e3f5;
  border-radius:999px;
  background:linear-gradient(135deg,#eef8ff 0%,#ffffff 100%);
  box-shadow:0 7px 20px rgba(16,79,130,.07), inset 0 1px 0 rgba(255,255,255,.95);
}

.ibu-section-label::before,
.eyebrow-light::before,
.footer-kicker::before,
.service-card-body > small::before {
  width:5px;
  height:5px;
  flex:0 0 5px;
  border-radius:50%;
  background:#0878e8;
  box-shadow:0 0 0 4px rgba(8,120,232,.09);
}

.ibu-section-label::after,
.eyebrow-light::after,
.footer-kicker::after,
.service-card-body > small::after {
  content:"";
  display:block;
  width:24px;
  height:2px;
  flex:0 0 24px;
  border-radius:2px;
  background:linear-gradient(90deg,#0878e8,#62c9ff);
}

/* Kicker hero dikembalikan ke bentuk sebelum badge global */
.hero-kicker {
  display:flex !important;
  align-items:center;
  justify-content:flex-start;
  width:auto;
  max-width:none;
  min-height:0;
  padding:0;
  gap:10px;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color:#d9e9ff !important;
  font:700 11px 'Inter' !important;
  letter-spacing:.19em !important;
  line-height:normal !important;
  text-transform:uppercase;
  white-space:normal;
}
.hero-kicker > span {
  display:block;
  width:42px !important;
  height:2px !important;
  flex:0 0 42px !important;
  margin:0 !important;
  border-radius:0;
  background:#6db6ff;
  box-shadow:none;
}

.skr-page-hero-kicker {
  display:block !important;
  width:auto;
  max-width:none;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color:#62c9ff !important;
  font:800 10px/1 'Manrope',sans-serif !important;
  letter-spacing:.19em !important;
  text-transform:uppercase;
  white-space:normal;
}
.skr-page-hero-kicker span {
  color:#a9c3d9;
  padding:0 7px;
}

.ibu-about-kicker {
  display:inline-block !important;
  width:auto;
  max-width:none;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color:#62c9ff !important;
  font-size:11px !important;
  font-weight:800 !important;
  letter-spacing:.18em !important;
  line-height:normal !important;
  text-transform:uppercase;
  white-space:normal;
}
.ibu-about-kicker::before,
.ibu-about-kicker::after {
  display:none !important;
}

/* Profil Perusahaan tetap memakai pola dot + garis gradasi */
.ibu-about-profile .ibu-section-label::after {
  display:block;
  width:24px;
  height:2px;
  flex:0 0 24px;
  border-radius:2px;
  background:linear-gradient(90deg,#0878e8,#62c9ff);
}

@media (max-width:700px){
  .ibu-section-label,
  .eyebrow-light,
  .footer-kicker,
  .service-card-body > small {
    box-shadow:0 6px 16px rgba(16,79,130,.06), inset 0 1px 0 rgba(255,255,255,.95);
  }

  .ibu-section-label::after,
  .eyebrow-light::after,
  .footer-kicker::after {
    width:18px;
    flex-basis:18px;
  }

  .hero-kicker {
    font-size:11px !important;
    letter-spacing:.19em !important;
  }
  .hero-kicker > span {
    width:30px !important;
    flex-basis:30px !important;
  }
}

/* =========================================================
   FINAL ADJUSTMENT — FOOTER & TENTANG KAMI KICKER
   ========================================================= */

/* Footer kicker dikembalikan ke bentuk semula */
.footer-kicker {
  display:block !important;
  width:auto !important;
  max-width:none;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:#8ed8ff;
  font:800 9px/1 'Manrope',sans-serif;
  letter-spacing:.2em;
  margin-bottom:23px;
  box-shadow:none;
  white-space:normal;
}

.footer-kicker::before,
.footer-kicker::after {
  display:none !important;
  content:none;
}

/* Kicker Tentang Kami dibuat presisi — tidak melebar penuh */
.ibu-about-profile .ibu-section-label,
.ibu-about-vision .ibu-section-label,
.ibu-about-principles .ibu-section-label,
.ibu-about-inline-detail .ibu-section-label {
  width:max-content !important;
  max-width:100%;
  flex:0 0 auto;
}

@media (max-width:600px) {
  .footer-kicker {
    font-size:9px;
    letter-spacing:.2em;
    margin-bottom:18px;
  }

  .ibu-about-profile .ibu-section-label,
  .ibu-about-vision .ibu-section-label,
  .ibu-about-principles .ibu-section-label,
  .ibu-about-inline-detail .ibu-section-label {
    width:max-content !important;
    max-width:calc(100vw - 40px);
  }
}


/* =========================================================
   FINAL — TENTANG KAMI: SEMUA KICKER RATA TENGAH & PRESISI
   ========================================================= */
.ibu-about-profile .ibu-section-label,
.ibu-about-vision .ibu-section-label,
.ibu-about-principles .ibu-section-label,
.ibu-about-inline-detail .ibu-detail-block > .ibu-section-label {
  display: inline-flex !important;
  width: max-content !important;
  max-width: calc(100% - 24px);
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

.ibu-about-profile .ibu-section-intro,
.ibu-about-vision .ibu-section-intro,
.ibu-about-principles .ibu-section-intro,
.ibu-about-inline-detail .ibu-detail-heading {
  align-items: center !important;
  text-align: center !important;
}

.ibu-about-inline-detail .ibu-detail-block {
  text-align: center;
}

.ibu-about-inline-detail .ibu-detail-heading h2,
.ibu-about-inline-detail .ibu-detail-heading p {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}

/* Footer kicker kembali ke bentuk asli sebelum sistem pill */
.site-footer-modern .footer-kicker {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin-bottom: 23px !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: #8ed8ff !important;
  font: 800 9px/1 'Manrope',sans-serif !important;
  letter-spacing: .2em !important;
  text-transform: uppercase;
  box-shadow: none !important;
  white-space: normal !important;
  overflow: visible !important;
}

.site-footer-modern .footer-kicker::before,
.site-footer-modern .footer-kicker::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 900px) {
  .ibu-about-profile .ibu-section-label,
  .ibu-about-vision .ibu-section-label,
  .ibu-about-principles .ibu-section-label,
  .ibu-about-inline-detail .ibu-detail-block > .ibu-section-label {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* =========================================================
   STRUKTUR ORGANISASI — MODERN + ALUR PANAH JELAS
   ========================================================= */
.ibu-org-chart-modern{
  position:relative;
  margin-top:22px;
  padding:34px 28px 38px;
  border:1px solid #d5e6f2;
  border-radius:22px;
  background:linear-gradient(145deg,#f8fcff 0%,#eef7fc 100%);
  box-shadow:0 16px 42px rgba(16,59,112,.08);
  overflow:hidden;
}
.ibu-org-chart-modern:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(7,68,158,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(7,68,158,.035) 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(to bottom,#000,transparent 92%);
}
.ibu-org-level{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  gap:18px;
}
.ibu-org-level-top{margin-bottom:0}
.ibu-org-level-management{max-width:610px;margin:0 auto}
.ibu-org-level-specialists{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ibu-org-level-support{max-width:610px;margin:0 auto}
.ibu-org-level-admin{margin:0}
.ibu-org-level-label{
  position:relative;
  z-index:2;
  margin:4px 0 12px;
  text-align:center;
  color:#07449e;
  font-size:9px;
  font-weight:800;
  letter-spacing:.16em;
}
.ibu-org-node{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  flex:1;
  min-width:0;
  padding:15px 16px;
  border:1px solid #cfe2ef;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 22px rgba(16,59,112,.07);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.ibu-org-node:hover{
  transform:translateY(-3px);
  border-color:#8ebfe1;
  box-shadow:0 13px 28px rgba(16,59,112,.12);
}
.ibu-org-node i{
  flex:0 0 38px;
  width:38px;height:38px;
  display:grid;place-items:center;
  border-radius:11px;
  color:#07449e;
  background:#eaf4ff;
  border:1px solid #c9e1f4;
  font-size:14px;
}
.ibu-org-node small{
  display:block;
  margin-bottom:5px;
  color:#0878e8;
  font-size:8px;
  font-weight:800;
  letter-spacing:.1em;
  line-height:1.3;
}
.ibu-org-node strong{
  display:block;
  color:#103b70;
  font-size:12px;
  line-height:1.35;
}
.ibu-org-node-supervisory{
  width:290px;
  flex:none;
  justify-content:center;
  background:linear-gradient(135deg,#07449e,#103b70);
  border-color:#07449e;
  color:#fff;
  box-shadow:0 12px 28px rgba(7,68,158,.18);
}
.ibu-org-node-supervisory i{color:#fff;background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.2)}
.ibu-org-node-supervisory small,.ibu-org-node-supervisory strong{color:#fff}
.ibu-org-node-primary{background:#f0f7ff;border-color:#a9d1ee}
.ibu-org-node-admin{width:290px;flex:none;justify-content:center;background:#f4fbf7;border-color:#b9dfc7}
.ibu-org-node-admin i{color:#187447;background:#e8f7ed;border-color:#c6e6d1}
.ibu-org-connector{
  position:relative;
  z-index:1;
  width:100%;
  height:42px;
}
.ibu-org-connector:before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:2px;
  height:30px;
  transform:translateX(-50%);
  background:#7caed2;
}
.ibu-org-connector:after{
  content:"";
  position:absolute;
  left:50%;
  top:27px;
  width:8px;height:8px;
  border-right:2px solid #07449e;
  border-bottom:2px solid #07449e;
  transform:translateX(-50%) rotate(45deg);
  background:#f3f9fd;
}
.ibu-org-connector-branch:after{top:28px}
.ibu-org-connector-wide{height:38px}
.ibu-org-connector-wide:before{height:26px}
.ibu-org-connector-wide:after{top:23px}
.ibu-org-arrow-down{display:none}
@media(max-width:980px){
  .ibu-org-level-specialists{grid-template-columns:repeat(2,1fr)}
  .ibu-org-level-management,.ibu-org-level-support{max-width:680px}
}
@media(max-width:600px){
  .ibu-org-chart-modern{padding:24px 14px 28px;border-radius:17px}
  .ibu-org-level-management,.ibu-org-level-support,.ibu-org-level-specialists{display:grid;grid-template-columns:1fr;max-width:none;gap:10px}
  .ibu-org-node-supervisory,.ibu-org-node-admin{width:100%;}
  .ibu-org-node{padding:13px 12px}
  .ibu-org-node i{flex-basis:34px;width:34px;height:34px;font-size:12px}
  .ibu-org-node strong{font-size:11px}
  .ibu-org-level-label{font-size:8px}
}

/* =========================================================
   PENGURUS PERUSAHAAN & PEMEGANG SAHAM — MODERN
   ========================================================= */
.ibu-management-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:20px;
}
.ibu-management-grid article{
  position:relative;
  min-height:190px;
  padding:25px 24px 22px;
  border:1px solid #d7e7f3;
  border-radius:18px;
  background:linear-gradient(145deg,#fff 0%,#f7fbff 100%);
  box-shadow:0 10px 28px rgba(16,59,112,.07);
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.ibu-management-grid article:before{
  content:"";
  position:absolute;
  left:0;top:0;right:0;height:4px;
  background:linear-gradient(90deg,#07449e,#0878e8,#62c9ff);
}
.ibu-management-grid article:after{
  content:"";
  position:absolute;
  width:90px;height:90px;
  right:-38px;bottom:-45px;
  border-radius:50%;
  background:rgba(8,120,232,.055);
}
.ibu-management-grid article:hover{
  transform:translateY(-4px);
  border-color:#b9d8ec;
  box-shadow:0 16px 34px rgba(16,59,112,.11);
}
.ibu-management-grid small{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#eaf4fc;
  color:#07449e;
  font-size:9px;
  font-weight:800;
  letter-spacing:.12em;
}
.ibu-management-grid i{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;height:48px;
  margin:18px 0 14px;
  border-radius:14px;
  background:#e8f4ff;
  color:#07449e;
  font-size:20px;
  border:1px solid #cde5f7;
}
.ibu-management-grid strong{
  display:block;
  position:relative;
  z-index:1;
  color:#103b70;
  font-size:17px;
  line-height:1.35;
}

.ibu-share-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:20px;
}
.ibu-share-grid article{
  position:relative;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  grid-template-areas:"icon info percent";
  align-items:center;
  gap:15px;
  padding:20px 22px;
  min-height:96px;
  border:1px solid #d7e7f3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 9px 25px rgba(16,59,112,.06);
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.ibu-share-grid article:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,#07449e,#0878e8);
}
.ibu-share-grid article:hover{
  transform:translateY(-3px);
  border-color:#b9d8ec;
  box-shadow:0 14px 30px rgba(16,59,112,.10);
}
.ibu-share-grid article:after{
  content:"";
  grid-area:icon;
  width:52px;height:52px;
  border-radius:15px;
  background:#eaf5ff;
  border:1px solid #cfe6f7;
}
.ibu-share-grid strong{
  grid-area:info;
  color:#103b70;
  font-size:15px;
  line-height:1.35;
}
.ibu-share-grid b{
  grid-area:info;
  align-self:end;
  margin-top:38px;
  color:#6b849b;
  font-size:11px;
  font-weight:600;
}
.ibu-share-grid span{
  grid-area:percent;
  width:58px;height:58px;
  border-radius:50%;
  background:linear-gradient(145deg,#07449e,#0878e8);
  color:#fff;
  font-size:13px;
  font-weight:800;
  box-shadow:0 7px 18px rgba(7,68,158,.2);
}
@media(max-width:900px){
  .ibu-management-grid,.ibu-share-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .ibu-management-grid,.ibu-share-grid{grid-template-columns:1fr}
  .ibu-management-grid article{min-height:170px}
  .ibu-share-grid article{grid-template-columns:48px minmax(0,1fr) auto;padding:18px}
  .ibu-share-grid article:after{width:48px;height:48px}
  .ibu-share-grid span{width:52px;height:52px}
}

/* =========================================================
   PENGURUS & PEMEGANG SAHAM — MODEL COMPACT MODERN
   ========================================================= */
.ibu-management-grid-v2{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:18px;
}
.ibu-management-grid-v2 article{
  min-height:0;
  height:92px;
  padding:0 18px 0 0;
  display:flex;
  align-items:center;
  border:1px solid #d8e7f2;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 20px rgba(16,59,112,.055);
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.ibu-management-grid-v2 article:before,
.ibu-management-grid-v2 article:after{display:none}
.ibu-management-grid-v2 article:hover{
  transform:translateY(-3px);
  border-color:#b9d8ec;
  box-shadow:0 12px 26px rgba(16,59,112,.10);
}
.ibu-management-accent{
  width:76px;
  height:100%;
  flex:0 0 76px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  background:linear-gradient(155deg,#07449e,#0b65c1);
  clip-path:polygon(0 0,82% 0,100% 50%,82% 100%,0 100%);
}
.ibu-management-accent:after{
  content:"";
  position:absolute;
  width:38px;height:38px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
}
.ibu-management-accent i{
  position:relative;
  z-index:1;
  margin:0;
  width:auto;height:auto;
  border:0;
  background:transparent;
  color:#fff;
  font-size:18px;
}
.ibu-management-info{
  min-width:0;
  padding-left:15px;
}
.ibu-management-info small{
  display:block;
  margin:0 0 6px;
  padding:0;
  background:none;
  color:#0878e8;
  font-size:8px;
  letter-spacing:.13em;
  line-height:1.2;
}
.ibu-management-info strong{
  display:block;
  color:#103b70;
  font-size:14px;
  line-height:1.3;
}

.ibu-share-grid-v2{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:18px;
}
.ibu-share-grid-v2 article{
  min-height:138px;
  padding:18px 20px;
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:18px;
  align-items:center;
  border:1px solid #d8e7f2;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 24px rgba(16,59,112,.055);
}
.ibu-share-grid-v2 article:before,
.ibu-share-grid-v2 article:after{display:none}
.ibu-share-grid-v2 article:hover{
  transform:translateY(-3px);
  border-color:#b9d8ec;
  box-shadow:0 13px 28px rgba(16,59,112,.10);
}
.ibu-share-donut{
  width:86px;height:86px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:conic-gradient(#0878e8 0 50%,#e2ebf4 50% 100%);
  position:relative;
}
.ibu-share-donut:after{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:50%;
  background:#fff;
}
.ibu-share-donut span{
  position:relative;
  z-index:1;
  width:auto;height:auto;
  background:none;
  color:#103b70;
  font-size:16px;
  font-weight:800;
  box-shadow:none;
}
.ibu-share-info{min-width:0}
.ibu-share-info small{
  display:inline-block;
  padding:5px 9px;
  border-radius:7px;
  background:#e8f2fc;
  color:#07449e;
  font-size:8px;
  font-weight:800;
  letter-spacing:.08em;
}
.ibu-share-info strong{
  display:block;
  margin:9px 0 7px;
  color:#103b70;
  font-size:16px;
  line-height:1.25;
}
.ibu-share-info > div{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:5px;
  color:#5e7891;
  font-size:10px;
}
.ibu-share-info > div i{color:#0878e8;font-size:14px}
.ibu-share-info b{
  display:block;
  margin:0;
  color:#607a95;
  font-size:9px;
  font-weight:600;
}
.ibu-share-info b em{
  margin-left:5px;
  color:#0878e8;
  font-style:normal;
  font-size:14px;
  font-weight:800;
}
@media(max-width:900px){
  .ibu-management-grid-v2{grid-template-columns:1fr 1fr}
  .ibu-share-grid-v2{grid-template-columns:1fr}
}
@media(max-width:600px){
  .ibu-management-grid-v2{grid-template-columns:1fr}
  .ibu-management-grid-v2 article{height:84px}
  .ibu-management-accent{width:68px;flex-basis:68px}
  .ibu-management-info strong{font-size:13px}
  .ibu-share-grid-v2 article{grid-template-columns:76px minmax(0,1fr);gap:14px;padding:15px}
  .ibu-share-donut{width:70px;height:70px}
  .ibu-share-donut:after{inset:9px}
  .ibu-share-donut span{font-size:14px}
  .ibu-share-info strong{font-size:14px}
}

/* ===== Legalitas Perusahaan — tabel modern & detail ===== */
.ibu-legal-modern .ibu-detail-heading>p{max-width:980px}
.ibu-legal-table-title{display:flex;align-items:center;gap:12px;margin-top:34px!important;margin-bottom:14px!important}
.ibu-legal-title-icon{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;background:linear-gradient(145deg,#07449e,#0b5ed7);color:#fff;box-shadow:0 7px 16px rgba(7,68,158,.18);flex:0 0 38px}
.ibu-legal-table-title>div{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.ibu-legal-table-title small{font-size:9px;font-weight:800;letter-spacing:.12em;color:#7a92a8}
.ibu-legal-table-title h3{margin:0;color:#103b70;font-size:16px;line-height:1.3}
.ibu-table-modern{border:1px solid #d6e5f1;border-radius:16px;box-shadow:0 10px 28px rgba(16,59,112,.06);overflow:auto}
.ibu-table-modern .ibu-data-table{min-width:760px}
.ibu-table-modern .ibu-data-table th{padding:14px 16px;text-align:center;background:linear-gradient(135deg,#07449e,#103b70);color:#fff;font-size:10.5px;letter-spacing:.03em;border:0;white-space:nowrap}
.ibu-table-modern .ibu-data-table td{padding:14px 16px;border-top:1px solid #e5eef5;color:#526d88;font-size:12px;line-height:1.55;background:#fff}
.ibu-table-modern .ibu-data-table tbody tr:nth-child(even) td{background:#f8fbfe}
.ibu-table-modern .ibu-data-table tbody tr{transition:transform .18s ease,box-shadow .18s ease}
.ibu-table-modern .ibu-data-table tbody tr:hover td{background:#eef7ff}
.ibu-table-modern .ibu-data-table td:first-child{font-weight:700;color:#103b70}
.ibu-table-modern .ibu-data-table td strong{display:block;color:#163a70;font-size:12px}
.ibu-table-modern .ibu-data-table td small{display:block;margin-top:4px;color:#71879b;font-size:10.5px;line-height:1.5}
.ibu-doc-badge{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:28px;padding:0 10px;border-radius:8px;background:#edf6ff;border:1px solid #cfe4f6;color:#07449e;font-weight:800}
.ibu-code{display:inline-block;padding:5px 8px;border-radius:7px;background:#f2f7fb;border:1px solid #dce9f2;color:#174f82;font-size:11px;font-weight:700;line-height:1.4}
.ibu-status-pill{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border-radius:999px;background:#eaf8f0;border:1px solid #ccebd9;color:#187343;font-size:9.5px;font-weight:800;line-height:1.3;white-space:nowrap}
.ibu-document-name{display:inline-flex;align-items:center;gap:9px;font-weight:800;color:#103b70}
.ibu-document-name i{width:25px;height:25px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;background:#edf6ff;color:#0878e8;font-size:12px;flex:0 0 25px}
.ibu-legal-document-table td:nth-child(2){min-width:190px}
.ibu-legal-document-table td:nth-child(5){min-width:250px}
@media(max-width:900px){
  .ibu-legal-table-title{margin-top:28px!important}
  .ibu-legal-title-icon{width:34px;height:34px;flex-basis:34px}
  .ibu-legal-table-title h3{font-size:14px}
  .ibu-table-modern .ibu-data-table{min-width:760px}
}

/* =========================================================
   LEGALITAS — LAYOUT TIDAK MELEBAR + NOMOR URUT TABEL
   ========================================================= */
html, body { overflow-x: hidden; }

.ibu-legal-modern,
.ibu-legal-modern .container,
.ibu-legal-modern .ibu-detail-heading,
.ibu-legal-modern .ibu-detail-heading > p {
  max-width: 100%;
  box-sizing: border-box;
}

.ibu-legal-modern .ibu-detail-heading > p {
  width: min(100%, 820px);
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.7;
}

.ibu-legal-modern .ibu-table-modern {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: hidden;
}

.ibu-legal-modern .ibu-table-modern .ibu-legal-table {
  width: 100%;
  min-width: 0 !important;
  table-layout: fixed;
}

.ibu-legal-modern .ibu-legal-table th,
.ibu-legal-modern .ibu-legal-table td {
  overflow-wrap: anywhere;
  word-break: normal;
}

.ibu-legal-modern .ibu-legal-table th:first-child,
.ibu-legal-modern .ibu-legal-table td:first-child {
  width: 58px;
  text-align: center;
}

.ibu-row-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  border-radius: 8px;
  background: #edf6ff;
  border: 1px solid #cfe4f6;
  color: #07449e;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}

.ibu-legal-modern .ibu-legal-document-table th:nth-child(2),
.ibu-legal-modern .ibu-legal-document-table td:nth-child(2) { width: 17%; }
.ibu-legal-modern .ibu-legal-document-table th:nth-child(3),
.ibu-legal-modern .ibu-legal-document-table td:nth-child(3) { width: 18%; }
.ibu-legal-modern .ibu-legal-document-table th:nth-child(4),
.ibu-legal-modern .ibu-legal-document-table td:nth-child(4) { width: 13%; }
.ibu-legal-modern .ibu-legal-document-table th:nth-child(5),
.ibu-legal-modern .ibu-legal-document-table td:nth-child(5) { width: 16%; }

@media (max-width: 900px) {
  .ibu-legal-modern .ibu-detail-heading > p {
    width: 100%;
    white-space: normal !important;
  }

  .ibu-legal-modern .ibu-table-modern .ibu-legal-table {
    min-width: 760px !important;
    table-layout: auto;
  }

  .ibu-legal-modern .ibu-legal-table th:first-child,
  .ibu-legal-modern .ibu-legal-table td:first-child {
    width: 58px;
  }
}

/* =========================================================
   LEGALITAS — REBUILD LAYOUT (FINAL)
   Tidak ada elemen legalitas yang boleh melebihi container.
   Desktop: tabel mengikuti lebar container.
   Mobile: hanya area tabel yang dapat digeser horizontal.
   ========================================================= */
.ibu-legal-modern{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:hidden;
  box-sizing:border-box;
}
.ibu-legal-modern .ibu-detail-heading{
  width:100%;
  max-width:820px;
  margin:0 auto;
  box-sizing:border-box;
  min-width:0;
}
.ibu-legal-modern .ibu-detail-heading > p{
  width:100%;
  max-width:820px;
  margin:12px auto 0;
  white-space:normal !important;
  overflow-wrap:anywhere;
  word-break:normal;
  text-align:center !important;
  box-sizing:border-box;
}
.ibu-legal-group{
  width:100%;
  max-width:100%;
  min-width:0;
  margin-top:30px;
  padding:0;
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid #dbe8f2;
  border-radius:16px;
  background:#fff;
  box-shadow:0 9px 26px rgba(16,59,112,.055);
}
.ibu-legal-group .ibu-legal-table-title{
  width:100%;
  max-width:100%;
  margin:0 !important;
  padding:14px 17px;
  box-sizing:border-box;
  background:#f7fbfe;
  border-bottom:1px solid #dbe8f2;
}
.ibu-legal-group .ibu-table-modern{
  width:100%;
  max-width:100%;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  overflow-x:auto;
  overflow-y:hidden;
  box-sizing:border-box;
}
.ibu-legal-group .ibu-data-table{
  width:100%;
  max-width:none;
  min-width:0 !important;
  table-layout:fixed;
  border-collapse:collapse;
  box-sizing:border-box;
}
.ibu-legal-group .ibu-data-table th,
.ibu-legal-group .ibu-data-table td{
  box-sizing:border-box;
  overflow-wrap:anywhere;
  word-break:normal;
  white-space:normal;
}
.ibu-legal-group .ibu-data-table th{
  padding:12px 13px;
  text-align:center;
}
.ibu-legal-group .ibu-data-table td{
  padding:13px;
  vertical-align:top;
}
.ibu-legal-group .ibu-data-table th:first-child,
.ibu-legal-group .ibu-data-table td:first-child{width:6%;text-align:center}

/* Akta Perusahaan */
.ibu-legal-akta .ibu-data-table th:nth-child(2),
.ibu-legal-akta .ibu-data-table td:nth-child(2){width:14%}
.ibu-legal-akta .ibu-data-table th:nth-child(3),
.ibu-legal-akta .ibu-data-table td:nth-child(3){width:16%}
.ibu-legal-akta .ibu-data-table th:nth-child(4),
.ibu-legal-akta .ibu-data-table td:nth-child(4){width:20%}
.ibu-legal-akta .ibu-data-table th:nth-child(5),
.ibu-legal-akta .ibu-data-table td:nth-child(5){width:44%}

/* Pengesahan dan Status Hukum */
.ibu-legal-pengesahan .ibu-data-table th:nth-child(2),
.ibu-legal-pengesahan .ibu-data-table td:nth-child(2){width:23%}
.ibu-legal-pengesahan .ibu-data-table th:nth-child(3),
.ibu-legal-pengesahan .ibu-data-table td:nth-child(3){width:28%}
.ibu-legal-pengesahan .ibu-data-table th:nth-child(4),
.ibu-legal-pengesahan .ibu-data-table td:nth-child(4){width:15%}
.ibu-legal-pengesahan .ibu-data-table th:nth-child(5),
.ibu-legal-pengesahan .ibu-data-table td:nth-child(5){width:28%}

/* Identitas, Izin Usaha & Dokumen */
.ibu-legal-dokumen .ibu-data-table th:nth-child(2),
.ibu-legal-dokumen .ibu-data-table td:nth-child(2){width:15%}
.ibu-legal-dokumen .ibu-data-table th:nth-child(3),
.ibu-legal-dokumen .ibu-data-table td:nth-child(3){width:19%}
.ibu-legal-dokumen .ibu-data-table th:nth-child(4),
.ibu-legal-dokumen .ibu-data-table td:nth-child(4){width:13%}
.ibu-legal-dokumen .ibu-data-table th:nth-child(5),
.ibu-legal-dokumen .ibu-data-table td:nth-child(5){width:17%}
.ibu-legal-dokumen .ibu-data-table th:nth-child(6),
.ibu-legal-dokumen .ibu-data-table td:nth-child(6){width:30%}

.ibu-legal-group .ibu-code{
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  box-sizing:border-box;
}
.ibu-legal-group .ibu-status-pill{
  max-width:100%;
  white-space:normal;
  text-align:center;
  box-sizing:border-box;
}
.ibu-legal-group .ibu-document-name{
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
}
.ibu-legal-group .ibu-source-note{max-width:100%}

@media (max-width:900px){
  .ibu-legal-modern .ibu-detail-heading{
    max-width:100%;
  }
  .ibu-legal-group{
    overflow:hidden;
  }
  .ibu-legal-group .ibu-legal-table-title{
    padding:12px 14px;
  }
  .ibu-legal-group .ibu-table-modern{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .ibu-legal-group .ibu-data-table{
    width:max-content;
    min-width:760px !important;
    table-layout:auto;
  }
  .ibu-legal-group .ibu-data-table th,
  .ibu-legal-group .ibu-data-table td{
    min-width:110px;
  }
  .ibu-legal-group .ibu-data-table th:first-child,
  .ibu-legal-group .ibu-data-table td:first-child{
    min-width:55px;
    width:55px;
  }
  .ibu-legal-modern .ibu-detail-heading > p{
    width:100%;
    max-width:100%;
  }
}
@media (max-width:600px){
  .ibu-legal-group{border-radius:13px}
  .ibu-legal-group .ibu-legal-table-title h3{font-size:13px}
  .ibu-legal-group .ibu-data-table{min-width:720px !important}
  .ibu-legal-group .ibu-data-table th,
  .ibu-legal-group .ibu-data-table td{padding:11px 12px}
}

/* ===== Pemegang Saham — kartu lebih compact & angka donut benar-benar terpusat ===== */
.ibu-share-grid-v2{
  gap:12px;
  margin-top:16px;
}
.ibu-share-grid-v2 article{
  min-height:116px;
  padding:14px 16px;
  grid-template-columns:76px minmax(0,1fr);
  gap:14px;
  border-radius:14px;
  box-shadow:0 6px 18px rgba(16,59,112,.045);
}
.ibu-share-donut{
  width:72px;
  height:72px;
}
.ibu-share-donut:after{
  inset:9px;
}
.ibu-share-donut span{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  height:auto;
  margin:0;
  padding:0;
  background:transparent;
  color:#103b70;
  font-size:15px;
  line-height:1;
  font-weight:800;
  box-shadow:none;
  transform:none;
}
.ibu-share-info small{
  padding:4px 8px;
  font-size:7.5px;
}
.ibu-share-info strong{
  margin:7px 0 5px;
  font-size:14px;
}
.ibu-share-info > div{
  margin-bottom:3px;
  font-size:9px;
}
.ibu-share-info > div i{font-size:12px}
.ibu-share-info b{font-size:8.5px}
.ibu-share-info b em{font-size:12px}
@media(max-width:600px){
  .ibu-share-grid-v2 article{
    grid-template-columns:68px minmax(0,1fr);
    gap:12px;
    min-height:104px;
    padding:12px 14px;
  }
  .ibu-share-donut{width:64px;height:64px}
  .ibu-share-donut:after{inset:8px}
  .ibu-share-donut span{font-size:13px}
}

/* Penyesuaian Prinsip Dasar: judul lebih ringkas dan isi card justify */
.ibu-about-principles .ibu-section-intro h2{
  font-size:clamp(24px,2.5vw,34px);
  line-height:1.15;
}
.ibu-about-principles .ibu-principles-grid article p{
  text-align:justify;
  text-justify:inter-word;
}
@media(max-width:600px){
  .ibu-about-principles .ibu-section-intro h2{font-size:24px}
}

/* Prinsip Dasar — isi card rata kiri-kanan, bukan rata tengah. */
.ibu-about-principles .ibu-principles-grid article p,
.ibu-principles-grid article p {
  text-align: justify !important;
  text-justify: inter-word;
}

/* Visi & Misi — ukuran judul disamakan dengan Prinsip Dasar dan card dibuat lebih modern */
.ibu-about-vision .ibu-section-intro h2{
  font-size:clamp(24px,2.5vw,34px);
  line-height:1.15;
}

.ibu-about-vision .ibu-vision-grid{
  gap:18px;
}

.ibu-about-vision .ibu-vision-grid article{
  position:relative;
  min-height:180px;
  padding:26px 28px 28px;
  border:1px solid #d7e7f2;
  border-radius:18px;
  background:linear-gradient(145deg,#ffffff 0%,#f6fbff 100%);
  box-shadow:0 10px 28px rgba(16,59,112,.07);
  overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}

.ibu-about-vision .ibu-vision-grid article::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,#0878e8,#49b6ff);
}

.ibu-about-vision .ibu-vision-grid article::after{
  content:"";
  position:absolute;
  width:110px;
  height:110px;
  right:-45px;
  top:-48px;
  border-radius:50%;
  background:rgba(8,120,232,.06);
}

.ibu-about-vision .ibu-vision-grid article.primary{
  background:linear-gradient(145deg,#eef8ff 0%,#f9fcff 100%);
  border-color:#c7e3f5;
}

.ibu-about-vision .ibu-vision-grid article:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 34px rgba(16,59,112,.11);
  border-color:#b8d9ed;
}

.ibu-about-vision .ibu-vision-grid small{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:5px 10px;
  border-radius:999px;
  background:#eaf5fd;
  color:#0878e8;
  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
}

.ibu-about-vision .ibu-vision-grid span{
  right:24px;
  top:20px;
  color:#9bb9d0;
  font-size:12px;
  letter-spacing:.08em;
}

.ibu-about-vision .ibu-vision-grid p{
  position:relative;
  z-index:1;
  max-width:none;
  margin:24px 0 0;
  color:#244b70;
  font-size:16px;
  line-height:1.7;
  font-weight:600;
  text-align:justify;
}

@media(max-width:600px){
  .ibu-about-vision .ibu-section-intro h2{font-size:24px}
  .ibu-about-vision .ibu-vision-grid article{min-height:0;padding:22px 22px 24px}
  .ibu-about-vision .ibu-vision-grid p{font-size:15px;line-height:1.65}
}

/* === Profil Perusahaan: modern value cards === */
.ibu-profile-facts > div {
  position: relative;
  overflow: hidden;
  padding: 20px 20px 18px 23px;
  border: 1px solid #dbeaf5;
  border-radius: 16px;
  background: linear-gradient(145deg,#ffffff 0%,#f5faff 100%);
  box-shadow: 0 10px 24px rgba(16,59,112,.07);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ibu-profile-facts > div::before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,#0878e8,#65b9ff);
}
.ibu-profile-facts > div::after {
  content:"";
  position:absolute;
  width:72px;
  height:72px;
  right:-28px;
  top:-30px;
  border-radius:50%;
  background:rgba(8,120,232,.06);
}
.ibu-profile-facts > div:hover {
  transform:translateY(-3px);
  border-color:#c8e0f1;
  box-shadow:0 14px 30px rgba(16,59,112,.11);
}
.ibu-profile-facts small { position:relative; z-index:1; }
.ibu-profile-facts strong {
  position:relative;
  z-index:1;
  font-size:18px;
  letter-spacing:-.02em;
  margin-top:8px;
}
.ibu-profile-facts span { position:relative; z-index:1; display:block; margin-top:4px; }
.ibu-profile-facts > div:nth-child(1) strong { color:#0878e8; }
.ibu-profile-facts > div:nth-child(2) strong { color:#103b70; }
.ibu-profile-facts > div:nth-child(3) strong { color:#0878e8; }

/* Replace generic profile facts with value-oriented labels */
.ibu-profile-facts > div:nth-child(1) small::after { content:""; }

@media(max-width:900px){
  .ibu-profile-facts > div { min-height:118px; }
}
@media(max-width:600px){
  .ibu-profile-facts > div { min-height:0; }
}

/* Profil perusahaan — detail tambahan pada card kiri */
.ibu-profile-main > p strong{color:#103b70}
.ibu-profile-main > p em{color:#0878e8;font-style:normal;font-weight:600}
.ibu-profile-scope{margin-top:20px;padding:16px 18px;border:1px solid #dceaf4;border-left:3px solid #0878e8;border-radius:12px;background:linear-gradient(135deg,#f8fcff,#eef7fd)}
.ibu-profile-scope-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-bottom:11px}
.ibu-profile-scope-head small{color:#0878e8;font-size:9px;font-weight:800;letter-spacing:.14em}
.ibu-profile-scope-head strong{color:#103b70;font-size:12px}
.ibu-profile-scope-items{display:flex;flex-wrap:wrap;gap:8px}
.ibu-profile-scope-items span{display:inline-flex;align-items:center;padding:7px 10px;border:1px solid #d4e7f4;border-radius:999px;background:#fff;color:#536d87;font-size:11px;font-weight:600}
@media(max-width:600px){.ibu-profile-scope-head{display:block}.ibu-profile-scope-head strong{display:block;margin-top:4px}.ibu-profile-scope-items{display:grid;grid-template-columns:1fr}.ibu-profile-scope-items span{border-radius:9px}}


/* =========================================================
   LAYANAN — CARD LEBIH KOMPAK & SERAGAM
   Semua kartu menggunakan satu gaya visual yang konsisten.
   ========================================================= */
.service-list-modern .service-modern-grid{
  align-items:stretch;
}

.service-list-modern .service-modern-card,
.service-list-modern .service-modern-card.featured{
  min-height:330px;
  padding:20px;
  border-radius:18px;
  background:linear-gradient(145deg,#ffffff 0%,#f7fbff 100%);
  color:#082f67;
  border:1px solid #d9eaf6;
  box-shadow:0 6px 20px rgba(30,100,150,.055);
  overflow:hidden;
}

.service-list-modern .service-modern-card::before,
.service-list-modern .service-modern-card.featured::before{
  content:"";
  display:block;
  position:absolute;
  left:0;
  top:0;
  right:0;
  bottom:auto;
  width:100%;
  height:3px;
  border-radius:18px 18px 0 0;
  background:linear-gradient(90deg,#07449e,#0878e8,#62c9ff);
  opacity:1;
  pointer-events:none;
}

.service-list-modern .service-modern-card:hover,
.service-list-modern .service-modern-card.featured:hover{
  transform:translateY(-3px);
  border-color:#b9d9ef;
  box-shadow:0 14px 30px rgba(28,109,165,.10);
}

.service-list-modern .service-card-top>span,
.service-list-modern .service-modern-card.featured .service-card-top>span{
  color:#6c8aa8;
  font-size:10px;
  font-weight:800;
}

.service-list-modern .service-card-top i,
.service-list-modern .service-modern-card.featured .service-card-top i{
  width:44px;
  height:44px;
  border-radius:13px;
  background:linear-gradient(145deg,#ffffff 0%,#eaf7ff 100%);
  border:1px solid #cfe7f7;
  color:#0878e8;
  font-size:17px;
  box-shadow:0 7px 18px rgba(8,120,232,.10),inset 0 1px 0 rgba(255,255,255,.95);
}

.service-list-modern .service-card-body,
.service-list-modern .service-modern-card.featured .service-card-body{
  margin-top:24px;
  max-width:100%;
}

.service-list-modern .service-card-body small,
.service-list-modern .service-modern-card.featured .service-card-body small{
  color:#1483e7;
  font-size:8px;
}

.service-list-modern .service-card-body h3,
.service-list-modern .service-modern-card.featured .service-card-body h3{
  color:#082f67;
  font-size:clamp(22px,2.1vw,29px);
  line-height:1.08;
  margin:8px 0 10px;
}

.service-list-modern .service-card-body>p,
.service-list-modern .service-modern-card.featured .service-card-body>p{
  color:#627d9a;
  font-size:11.5px;
  line-height:1.58;
}

.service-list-modern .service-detail,
.service-list-modern .service-modern-card.featured .service-detail{
  margin-top:15px;
  padding-top:11px;
  border-top:1px solid #dfedf6;
}

.service-list-modern .service-detail>b,
.service-list-modern .service-modern-card.featured .service-detail>b{
  color:#466b8e;
  font-size:8.5px;
  line-height:1.4;
}

.service-list-modern .service-detail ul,
.service-list-modern .service-modern-card.featured .service-detail ul{
  margin-top:6px;
  padding-left:15px;
  color:#637e99;
  font-size:9.5px;
  line-height:1.55;
}

.service-list-modern .service-detail-btn{
  margin-top:13px;
  padding:7px 11px;
  border-radius:8px;
  font-size:9px;
}

@media(max-width:620px){
  .service-list-modern .service-modern-card,
  .service-list-modern .service-modern-card.featured{
    min-height:0;
    padding:18px;
    border-radius:16px;
  }
  .service-list-modern .service-card-top i,
  .service-list-modern .service-modern-card.featured .service-card-top i{
    width:42px;
    height:42px;
    border-radius:12px;
    font-size:16px;
  }
  .service-list-modern .service-card-body,
  .service-list-modern .service-modern-card.featured .service-card-body{
    margin-top:22px;
  }
  .service-list-modern .service-card-body h3,
  .service-list-modern .service-modern-card.featured .service-card-body h3{
    font-size:24px;
  }
}

/* ===== LAYANAN: FINAL CARD SERAGAM & TEKS LEBIH JELAS ===== */
.service-list-modern .service-modern-card,
.service-list-modern .service-modern-card.featured{
  background:#f5fbff !important;
  color:#082f67 !important;
  border:1px solid #d9eaf6 !important;
  min-height:370px;
  padding:24px;
  border-radius:20px;
}
.service-list-modern .service-modern-card:hover{
  transform:translateY(-4px);
  border-color:#b8daf2 !important;
  box-shadow:0 18px 38px rgba(28,109,165,.10);
}
.service-list-modern .service-card-top>span,
.service-list-modern .featured .service-card-top>span{
  color:#5f8caf !important;
  font-size:14px;
}
.service-list-modern .service-card-top i,
.service-list-modern .featured .service-card-top i{
  background:#eaf7ff !important;
  color:#0878e8 !important;
  border:1px solid #cfe7f7;
}
.service-list-modern .service-card-body small,
.service-list-modern .featured .service-card-body small{
  color:#0878e8 !important;
  font-size:10px;
}
.service-list-modern .service-card-body h3,
.service-list-modern .featured .service-card-body h3{
  color:#082f67 !important;
  font-size:25px;
  line-height:1.12;
  margin:9px 0 13px;
}
.service-list-modern .service-card-body>p,
.service-list-modern .featured .service-card-body>p{
  color:#506f8e !important;
  font-size:13px;
  line-height:1.65;
}
.service-list-modern .service-detail,
.service-list-modern .featured .service-detail{
  border-color:#dcecf7 !important;
}
.service-list-modern .service-detail>b,
.service-list-modern .featured .service-detail>b{
  color:#3e6385 !important;
  font-size:10px;
}
.service-list-modern .service-detail ul,
.service-list-modern .featured .service-detail ul{
  color:#5a7895 !important;
  font-size:11px;
  line-height:1.7;
}
.service-list-modern .service-detail-btn,
.service-list-modern .featured .service-detail-btn{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  background:#0878e8 !important;
  color:#fff !important;
  border:1px solid #0878e8;
  margin-top:14px;
  padding:9px 13px;
  border-radius:9px;
  font-size:10px;
  font-weight:800;
}
.service-list-modern .service-detail-btn:hover,
.service-list-modern .featured .service-detail-btn:hover{
  background:#075fb8 !important;
  color:#fff !important;
}
@media(max-width:620px){
  .service-list-modern .service-modern-card,
  .service-list-modern .service-modern-card.featured{
    min-height:0;
    padding:18px;
    border-radius:16px;
  }
  .service-list-modern .service-card-body h3,
  .service-list-modern .featured .service-card-body h3{
    font-size:23px;
  }
  .service-list-modern .service-card-body>p,
  .service-list-modern .featured .service-card-body>p{
    font-size:12.5px;
  }
}

/* =========================================================
   MOBILE & TABLET RESPONSIVE POLISH — IBU
   Panel navigation + animated hamburger
   ========================================================= */
@media (max-width: 980px){
  html, body{max-width:100%;overflow-x:hidden}
  .site-header{padding:12px 0}
  .site-header.scrolled{padding:8px 0}
  .nav-wrap{gap:16px}
  .brand{min-width:0;max-width:calc(100% - 58px)}
  .ibu-logo-header{width:42px;height:42px;object-fit:contain;flex:0 0 auto}
  .brand-name{min-width:0}
  .brand-name strong{font-size:11px;letter-spacing:.045em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .nav-toggle{
    position:relative;
    z-index:1102;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px;
    width:44px;
    height:44px;
    padding:0;
    border:1px solid rgba(255,255,255,.18);
    border-radius:12px;
    background:rgba(255,255,255,.06);
    cursor:pointer;
    transition:background .25s ease,border-color .25s ease,transform .25s ease;
  }
  .nav-toggle:hover{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.30)}
  .nav-toggle span{
    width:21px;
    height:2px;
    margin:0;
    border-radius:2px;
    background:#fff;
    transition:transform .3s ease,opacity .2s ease,width .3s ease;
  }
  .nav-toggle[aria-expanded="true"]{background:rgba(18,102,227,.22);border-color:rgba(39,200,255,.45)}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;width:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .nav-menu{
    position:fixed;
    z-index:1100;
    top:0;
    right:0;
    bottom:0;
    left:auto;
    width:min(380px,88vw);
    height:100dvh;
    padding:92px 22px 28px;
    overflow-y:auto;
    overscroll-behavior:contain;
    align-items:stretch;
    gap:5px;
    background:linear-gradient(180deg,rgba(5,18,35,.985),rgba(7,26,51,.985));
    border-left:1px solid rgba(255,255,255,.12);
    box-shadow:-25px 0 70px rgba(0,0,0,.30);
    transform:translateX(105%);
    opacity:0;
    visibility:hidden;
    transition:transform .38s cubic-bezier(.22,.75,.18,1),opacity .28s ease,visibility 0s linear .38s;
  }
  .nav-menu::before{
    content:'MENU';
    display:block;
    margin:0 0 13px;
    padding-bottom:12px;
    border-bottom:1px solid rgba(255,255,255,.10);
    color:rgba(255,255,255,.45);
    font:700 10px/1 'Plus Jakarta Sans',sans-serif;
    letter-spacing:.24em;
  }
  .nav-menu.open{
    transform:translateX(0);
    opacity:1;
    visibility:visible;
    transition-delay:0s;
  }
  .nav-menu>a,
  .nav-dropdown>a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    min-height:48px;
    padding:11px 13px;
    border-radius:12px;
    font-size:15px;
    line-height:1.3;
    color:#f4f8ff;
    opacity:1;
    transition:background .2s ease,color .2s ease,transform .2s ease;
  }
  .nav-menu>a:hover,
  .nav-dropdown>a:hover,
  .nav-menu>a.active,
  .nav-dropdown>a.active{background:rgba(255,255,255,.07);transform:translateX(2px)}
  .nav-menu>a.active:after,
  .nav-dropdown>a.active:after{display:none}
  .nav-dropdown{width:100%}
  .nav-dropdown>a{gap:12px}
  .nav-dropdown>a i{font-size:10px;transition:transform .25s ease}
  .nav-dropdown.mobile-open>a i{transform:rotate(180deg)}
  .dropdown-menu{
    position:static;
    width:100%;
    max-height:0;
    display:block;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    padding:0 0 0 8px;
    margin:0;
    background:rgba(255,255,255,.025);
    border:0;
    border-left:1px solid rgba(39,200,255,.30);
    border-radius:0 0 10px 10px;
    box-shadow:none;
    transform:none;
    transition:max-height .35s ease,opacity .25s ease,visibility 0s linear .35s,padding .35s ease;
  }
  .nav-dropdown.mobile-open .dropdown-menu{
    max-height:700px;
    opacity:1;
    visibility:visible;
    padding:5px 0 6px 8px;
    transition-delay:0s;
  }
  .dropdown-menu a{
    min-height:38px;
    padding:9px 10px;
    gap:10px;
    border-radius:8px;
    font-size:12px;
    color:#cdd9e8;
  }
  .dropdown-menu a:hover{background:rgba(255,255,255,.07);transform:none}
  .dropdown-menu span{min-width:20px;font-size:10px}
  .nav-whatsapp{
    margin-top:10px!important;
    justify-content:center!important;
    min-height:46px!important;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(37,211,102,.13);
    color:#fff!important;
  }
  .nav-whatsapp i{font-size:17px}

  /* Prevent common content overflow on tablet/mobile */
  .section-v3,.section,.hero-v3,.site-footer,main{max-width:100%;overflow-x:hidden}
  .hero-v3{min-height:680px}
  .hero-grid-lines,.tech-lines{pointer-events:none}
  .container{width:min(calc(100% - 32px),var(--container))}
  .grid,.profile-grid,.ibu-profile-grid,.ibu-vision-grid,.ibu-management-grid,.ibu-share-grid,.ibu-focus-grid,.ibu-legal-grid{min-width:0}
  .card,.ibu-principles-grid article,.ibu-profile-card,.ibu-vision-card{min-width:0}
}

@media (max-width:600px){
  .container{width:calc(100% - 26px)}
  .site-header{padding:9px 0}
  .site-header.scrolled{padding:7px 0}
  .ibu-logo-header{width:38px;height:38px}
  .brand{gap:8px}
  .brand-name strong{font-size:10px;letter-spacing:.025em}
  .nav-toggle{width:42px;height:42px;border-radius:11px}
  .nav-menu{width:min(330px,92vw);padding:84px 16px 22px}
  .nav-menu>a,.nav-dropdown>a{font-size:14px;min-height:46px;padding:10px 12px}
  .dropdown-menu a{font-size:11.5px;min-height:36px;padding:8px 9px}
  .nav-whatsapp{font-size:13px!important}
  .hero-v3{min-height:640px}
  .hero-v3 h1{font-size:clamp(38px,12vw,58px);line-height:1.02}
  .hero-v3 p{font-size:14px}
  .section-v3{padding:64px 0}
  .section-title,.section-v3 h2{font-size:clamp(27px,8vw,38px)}
  .ibu-profile-facts{grid-template-columns:1fr}
  .ibu-principles-grid{gap:12px}
  .ibu-principles-grid article{padding:18px}
  .ibu-principles-grid p{font-size:12px;line-height:1.65;text-align:justify}
  .ibu-data-table,.ibu-sdm-table{min-width:680px}
  .ibu-table-wrap,.table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .back-to-top{width:38px;height:38px}
}

/* =========================================================
   HAMBURGER VISIBILITY — MOBILE & TABLET
   Header IBU menggunakan background terang, sehingga tombol
   hamburger menggunakan aksen biru tua agar selalu terlihat.
   ========================================================= */
@media (max-width:980px){
  .site-header .nav-toggle{
    background:linear-gradient(145deg,#f4f8fd,#e5eef9) !important;
    border:1px solid #c7d9ee !important;
    box-shadow:0 5px 16px rgba(7,68,158,.12);
  }
  .site-header .nav-toggle span{
    background:#07449e !important;
    height:2.5px;
  }
  .site-header .nav-toggle:hover{
    background:#eaf3ff !important;
    border-color:#9fc2e8 !important;
  }
  .site-header .nav-toggle[aria-expanded="true"]{
    background:#07449e !important;
    border-color:#07449e !important;
  }
  .site-header .nav-toggle[aria-expanded="true"] span{
    background:#fff !important;
  }
}

/* HOME PAGE DESCRIPTION ALIGNMENT */
.home-page .hero-light-copy>p,
.home-page .section-top-light>p,
.home-page .service-card-text>p,
.home-page .about-home-copy>p,
.home-page .project-showcase-light .section-top-light>p{
  text-align:justify;
  text-justify:inter-word;
}

/* Beranda hero — posisi presisi khusus tablet & mobile */
@media (min-width:621px) and (max-width:980px){
  .hero-light-inner{align-items:flex-start;padding:0 28px}
  .hero-light-copy{width:min(100%,620px);max-width:620px;padding-top:78px;padding-bottom:18px}
  .hero-kicker{margin-bottom:14px;max-width:100%;white-space:normal;line-height:1.25}
  .hero-light h1{font-size:clamp(40px,6vw,52px);line-height:1.03;max-width:560px}
  .hero-light-copy>p{max-width:560px;font-size:14px;line-height:1.55;margin:19px 0 24px}
}
@media (max-width:620px){
  .hero-light-inner{align-items:flex-start;padding:0 20px}
  .hero-light-copy{width:100%;max-width:100%;padding-top:30px;padding-bottom:10px}
  .hero-kicker{font-size:8px;letter-spacing:.12em;gap:7px;margin-bottom:13px;white-space:normal;line-height:1.3;max-width:100%;align-items:flex-start}
  .hero-kicker span{width:24px;min-width:24px;flex:0 0 24px;margin-top:5px}
  .hero-light h1{font-size:34px;line-height:1.04;letter-spacing:-.04em;max-width:430px}
  .hero-light-copy>p{max-width:430px;font-size:12px;line-height:1.55;margin:17px 0 22px;text-align:justify}
}

/* =========================================================
   HERO BERANDA — MOBILE/TABLET FINAL POSITION
   Vertically centered, but text remains left-aligned.
   Kicker rule is vertically centered with wrapped kicker text.
   ========================================================= */
@media (min-width:621px) and (max-width:980px){
  .hero-light-inner{
    align-items:center !important;
    padding:0 28px !important;
  }
  .hero-light-copy{
    width:min(100%,620px);
    max-width:620px;
    padding-top:0 !important;
    padding-bottom:0 !important;
    transform:translateY(10px);
  }
  .hero-kicker{
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:left !important;
  }
  .hero-kicker > span{
    align-self:center;
    margin-top:0 !important;
  }
}

@media (max-width:620px){
  .hero-light-inner{
    align-items:center !important;
    padding:0 20px !important;
  }
  .hero-light-copy{
    width:100%;
    max-width:430px;
    padding-top:0 !important;
    padding-bottom:0 !important;
    transform:translateY(18px);
  }
  .hero-kicker{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:left !important;
    width:100%;
    max-width:100%;
    gap:8px;
  }
  .hero-kicker > span{
    align-self:center !important;
    margin-top:0 !important;
    width:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;
  }
  .hero-light h1,
  .hero-light-copy > p,
  .hero-actions-light{
    text-align:left !important;
  }
}

/* =========================================================
   HERO BERANDA — MOBILE/TABLET FINAL TUNING
   Kicker satu baris; seluruh blok sedikit diturunkan.
   ========================================================= */
@media (min-width:621px) and (max-width:980px){
  .hero-light-copy{
    transform:translateY(40px) !important;
  }
  .hero-kicker{
    white-space:nowrap !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    line-height:1 !important;
    gap:8px !important;
  }
  .hero-kicker > span{
    width:32px !important;
    min-width:32px !important;
    height:2px !important;
    flex:0 0 32px !important;
    margin:0 !important;
  }
}

@media (max-width:620px){
  .hero-light-copy{
    transform:translateY(52px) !important;
  }
  .hero-kicker{
    white-space:nowrap !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    line-height:1 !important;
    gap:7px !important;
    font-size:7.3px !important;
    letter-spacing:.095em !important;
  }
  .hero-kicker > span{
    width:26px !important;
    min-width:26px !important;
    height:2px !important;
    flex:0 0 26px !important;
    margin:0 !important;
  }
  .hero-light-copy > p{
    text-align:justify !important;
    text-justify:inter-word !important;
  }
}

/* =========================================================
   BERANDA — LAYANAN UNGGULAN: DESKRIPSI CARD LEBIH RAPI
   ========================================================= */
.services-home .service-card-light .service-card-text p{
  text-align:left !important;
  text-justify:auto !important;
  font-size:12px;
  line-height:1.6;
  letter-spacing:-0.005em;
  max-width:100%;
  margin-bottom:18px;
}

@media (max-width:1100px){
  .services-home .service-card-light .service-card-text{
    width:64%;
    padding:23px;
  }
  .services-home .service-card-light .service-card-text p{
    font-size:11.5px;
  }
}

@media (max-width:620px){
  .services-home .service-card-light .service-card-text{
    width:74%;
    padding:22px;
  }
  .services-home .service-card-light .service-card-text p{
    font-size:12px;
    line-height:1.58;
  }
}
/* Project gallery lightbox */
.project-modern-image{position:relative}.project-modern-gallery-count{position:absolute;right:10px;bottom:10px;background:rgba(5,20,40,.88);color:#fff;border-radius:7px;padding:5px 8px;font-size:9px;font-weight:800;z-index:2}.project-lightbox-nav{display:none;position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(5,20,40,.72);color:#fff;cursor:pointer;z-index:3;align-items:center;justify-content:center}.project-lightbox-nav.show{display:flex}.project-lightbox-prev{left:16px}.project-lightbox-next{right:16px}.project-lightbox-counter{position:absolute;right:18px;top:18px;background:rgba(5,20,40,.72);color:#fff;border-radius:8px;padding:6px 9px;font-size:10px;font-weight:800}.project-lightbox-stage{position:relative}
@media(max-width:600px){.project-lightbox-nav{width:36px;height:36px}.project-lightbox-prev{left:8px}.project-lightbox-next{right:8px}}

/* Project card gallery — maksimal 5 foto */
.project-card-thumbs{
  position:absolute;
  top:10px;
  right:10px;
  z-index:4;
  display:flex;
  flex-direction:row;
  gap:5px;
  max-width:calc(100% - 20px);
  padding:5px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:10px;
  background:rgba(3,25,48,.52);
  backdrop-filter:blur(8px);
  box-shadow:0 8px 20px rgba(3,25,48,.18);
}
.project-card-thumb{
  position:relative;
  flex:0 0 42px;
  display:block;
  width:42px;
  height:32px;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.65);
  border-radius:6px;
  background:#edf6fc;
  cursor:pointer;
  transition:.22s ease;
}
.project-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.25s ease}
.project-card-thumb:hover{border-color:#fff;transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.2)}
.project-card-thumb.active{border:2px solid #fff;box-shadow:0 0 0 2px rgba(8,120,232,.55)}
.project-card-thumb.active:after{content:'';position:absolute;inset:0;background:rgba(8,120,232,.10);pointer-events:none}
.project-no-image{height:100%;display:grid;place-items:center;color:#6f879b;font:700 11px Inter;background:#edf6fc}
@media(max-width:900px){.project-card-thumbs{top:8px;right:8px;gap:4px;padding:4px;border-radius:9px}.project-card-thumb{flex-basis:38px;width:38px;height:29px;border-radius:5px}}
@media(max-width:560px){.project-modern-image{height:200px}.project-card-thumbs{top:7px;right:7px;max-width:calc(100% - 14px)}.project-card-thumb{flex-basis:34px;width:34px;height:26px;border-radius:5px}}

/* Project cards: no thumbnail strip; zoom control in top corner */
.project-card-thumbs{display:none!important}
.project-modern-arrow{top:12px!important;right:12px!important;bottom:auto!important;left:auto!important;width:36px!important;height:36px!important;border-radius:10px!important;background:rgba(5,20,40,.76)!important;color:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:4!important;opacity:1!important;transform:none!important}
.project-modern-card:hover .project-modern-arrow{opacity:1!important;transform:none!important}
@media(max-width:600px){.project-modern-arrow{top:9px!important;right:9px!important;width:32px!important;height:32px!important;border-radius:8px!important}}


/* Lightbox project — navigasi benar-benar di luar foto */
.project-lightbox .project-lightbox-stage{
  position:relative;
  width:min(1320px,calc(100vw - 48px));
  max-width:none;
  max-height:90vh;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 48px;
  grid-template-rows:auto auto;
  column-gap:18px;
  align-items:center;
  justify-items:center;
}
.project-lightbox .project-lightbox-stage img{
  grid-column:2;
  grid-row:1;
  width:auto;
  max-width:100%;
  max-height:82vh;
  object-fit:contain;
  justify-self:center;
}
.project-lightbox .project-lightbox-nav{
  position:static;
  grid-row:1;
  width:42px;
  height:42px;
  margin:0;
  transform:none;
  display:none;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(5,20,40,.78);
  color:#fff;
  z-index:4;
}
.project-lightbox .project-lightbox-nav.show{display:flex}
.project-lightbox .project-lightbox-prev{grid-column:1;left:auto;right:auto}
.project-lightbox .project-lightbox-next{grid-column:3;left:auto;right:auto}
.project-lightbox .project-lightbox-counter{right:66px;top:12px}
.project-lightbox .project-lightbox-caption{grid-column:2;grid-row:2}
@media(max-width:700px){
  .project-lightbox{padding:12px}
  .project-lightbox .project-lightbox-stage{
    width:100%;
    grid-template-columns:34px minmax(0,1fr) 34px;
    column-gap:8px;
  }
  .project-lightbox .project-lightbox-stage img{max-width:100%;max-height:76vh}
  .project-lightbox .project-lightbox-nav{width:32px;height:32px}
  .project-lightbox .project-lightbox-counter{right:44px;top:8px}
}


/* Final project card: photo count replaces zoom icon */
.project-modern-arrow{display:none!important}
.project-modern-gallery-count{
  position:absolute!important;
  top:12px!important;
  right:12px!important;
  bottom:auto!important;
  left:auto!important;
  z-index:5!important;
  min-width:38px;
  height:28px;
  padding:0 9px!important;
  border:1px solid rgba(255,255,255,.72);
  border-radius:8px!important;
  background:rgba(5,20,40,.78)!important;
  color:#fff!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  font:800 10px/1 Inter,sans-serif!important;
  letter-spacing:.1px;
  backdrop-filter:blur(6px);
}
@media(max-width:600px){.project-modern-gallery-count{top:9px!important;right:9px!important;height:26px;min-width:34px;font-size:9px!important;padding:0 8px!important}}

/* Final lightbox: navigation columns stay outside the photo */
.project-lightbox .project-lightbox-stage{
  width:min(1320px,calc(100vw - 48px))!important;
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr) 48px!important;
  grid-template-rows:auto auto!important;
  column-gap:18px!important;
  align-items:center!important;
  justify-items:center!important;
}
.project-lightbox .project-lightbox-stage img{
  grid-column:2!important;
  grid-row:1!important;
  max-width:100%!important;
  max-height:82vh!important;
  justify-self:center!important;
}
.project-lightbox .project-lightbox-nav{
  position:static!important;
  grid-row:1!important;
  transform:none!important;
  margin:0!important;
}
.project-lightbox .project-lightbox-prev{grid-column:1!important;left:auto!important;right:auto!important}
.project-lightbox .project-lightbox-next{grid-column:3!important;left:auto!important;right:auto!important}
@media(max-width:700px){
 .project-lightbox .project-lightbox-stage{width:100%!important;grid-template-columns:34px minmax(0,1fr) 34px!important;column-gap:8px!important}
 .project-lightbox .project-lightbox-stage img{max-width:100%!important;max-height:76vh!important}
}

/* Fokus notifikasi formulir kontak: selalu berada tepat di area atas form. */
.contact-modern-form .contact-alert {
  scroll-margin-top: 100px;
}

.contact-modern-form .contact-alert:focus {
  outline: 2px solid rgba(7, 68, 158, .18);
  outline-offset: 3px;
}

/* ===== TENTANG KAMI — HERO SPACING PRESISI FINAL ===== */
.ibu-about-hero-inner{
  min-height:315px;
  padding:40px 0 40px;
  display:block;
}
.ibu-about-kicker{
  display:inline-block;
  margin:0 0 16px;
  color:#62c9ff;
  font-size:11px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.ibu-about-hero h1{
  margin:0;
  max-width:900px;
  font-size:clamp(42px,4.2vw,56px);
  line-height:1.02;
  letter-spacing:-.045em;
}
.ibu-about-hero p{
  max-width:900px;
  margin:16px 0 0;
  color:#dceaf6;
  font-size:15px;
  line-height:1.65;
}
.ibu-about-year{display:none !important}
@media (max-width:900px){
  .ibu-about-hero-inner{min-height:300px;padding:34px 0 36px;display:block}
  .ibu-about-kicker{margin-bottom:14px;font-size:10px}
  .ibu-about-hero h1{font-size:clamp(36px,7vw,48px)}
  .ibu-about-hero p{margin-top:14px;font-size:14px;line-height:1.65}
}
@media (max-width:600px){
  .ibu-about-hero-inner{min-height:0;padding:30px 0 32px}
  .ibu-about-kicker{font-size:9px;letter-spacing:.15em}
  .ibu-about-hero h1{font-size:34px;line-height:1.05}
  .ibu-about-hero p{font-size:13px;line-height:1.6}
}

/* ===== TENTANG KAMI — POSISI HERO DISELARASKAN DENGAN HERO LAYANAN ===== */
.ibu-about-hero{
  min-height:360px;
  padding:145px 0 72px;
  position:relative;
  overflow:hidden;
}
.ibu-about-hero-inner{
  position:relative;
  z-index:2;
  max-width:1240px;
}
.ibu-about-kicker{
  margin:0 0 17px;
  font:800 10px/1 'Manrope',sans-serif;
  letter-spacing:.19em;
}
.ibu-about-hero h1{
  margin:0 0 12px;
  max-width:900px;
  font-size:clamp(40px,4.2vw,56px);
  line-height:1.02;
  letter-spacing:-.045em;
}
.ibu-about-hero p{
  max-width:690px;
  margin:0;
  font-size:14px;
  line-height:1.75;
}
@media(max-width:900px){
  .ibu-about-hero{
    min-height:330px;
    padding:125px 0 55px;
  }
  .ibu-about-hero h1{font-size:clamp(38px,7vw,50px)}
  .ibu-about-hero p{font-size:13px}
}
@media(max-width:700px){
  .ibu-about-hero{
    min-height:300px;
    padding:125px 0 55px;
  }
  .ibu-about-kicker{font-size:9px;margin-bottom:14px}
  .ibu-about-hero h1{font-size:34px;line-height:1.05}
  .ibu-about-hero p{font-size:13px;line-height:1.6}
}

/* =========================================================
   TENTANG KAMI — PADDING HERO SAMA DENGAN LAYANAN & PROJECT
   ========================================================= */
.ibu-about-hero{
  min-height:360px;
  padding:145px 0 72px;
}

@media(max-width:700px){
  .ibu-about-hero{
    min-height:300px;
    padding:125px 0 55px;
  }
}


/* FINAL: Hero Tentang Kami menggunakan spacing IDENTIK dengan Hero Layanan & Project */
.skr-hero-about.ibu-about-hero{
  min-height:360px;
  padding:145px 0 72px;
  background-image:url('../img/hero-about-ai.jpg');
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.skr-hero-about.ibu-about-hero .skr-page-hero-kicker{
  margin-bottom:17px;
  font-size:10px;
  line-height:1;
}
.skr-hero-about.ibu-about-hero h1{
  max-width:900px;
  margin:0 0 12px;
  font-size:clamp(40px,4.2vw,56px);
  line-height:1.02;
  letter-spacing:-.045em;
}
.skr-hero-about.ibu-about-hero p{
  max-width:690px;
  margin:0;
  font-size:14px;
  line-height:1.75;
}
@media(max-width:900px){
 .skr-hero-about.ibu-about-hero{min-height:330px;padding:125px 0 55px;}
}
@media(max-width:700px){
 .skr-hero-about.ibu-about-hero{min-height:300px;padding:125px 0 55px;}
 .skr-hero-about.ibu-about-hero h1{font-size:34px;line-height:1.05;}
 .skr-hero-about.ibu-about-hero p{font-size:13px;line-height:1.6;}
}

/* ===== FINAL: JUDUL HERO HALAMAN NON-BERANDA SERAGAM ===== */
/* Tentang Kami, Layanan, dan Project memakai ukuran judul yang sama.
   Hero Beranda tidak disentuh karena menggunakan class hero-v3/hero-light tersendiri. */
.skr-page-hero h1{
  font-size:clamp(40px,5vw,62px);
  line-height:1;
  letter-spacing:-.055em;
}
@media(max-width:700px){
  .skr-page-hero h1{font-size:39px;line-height:1.05;}
}

/* =========================================================
   FINAL HERO HEIGHT SYNC — IBU
   Tentang Kami, Layanan, dan Project harus memiliki tinggi hero
   yang identik pada setiap breakpoint.
   ========================================================= */
.skr-page-hero.skr-hero-about,
.skr-page-hero.skr-hero-services,
.skr-page-hero.skr-hero-projects{
  height:360px;
  min-height:360px;
  max-height:360px;
  padding:145px 0 72px;
  box-sizing:border-box;
}

@media(max-width:900px){
  .skr-page-hero.skr-hero-about,
  .skr-page-hero.skr-hero-services,
  .skr-page-hero.skr-hero-projects{
    height:330px;
    min-height:330px;
    max-height:330px;
    padding:125px 0 55px;
  }
}

@media(max-width:700px){
  .skr-page-hero.skr-hero-about,
  .skr-page-hero.skr-hero-services,
  .skr-page-hero.skr-hero-projects{
    height:300px;
    min-height:300px;
    max-height:300px;
    padding:125px 0 55px;
  }
}


/* =========================================================
   FINAL FOOTER REFINEMENT — IBU
   Address kept on a clean two-line layout and copyright in English.
   ========================================================= */
.site-footer-modern .footer-modern-top{
  grid-template-columns:1.35fr .72fr 1.05fr 1.12fr;
  gap:46px;
  padding-top:76px;
  padding-bottom:58px;
}
.site-footer-modern .footer-contact-modern{
  padding-left:0;
  min-width:0;
}
.site-footer-modern .footer-contact-item{
  gap:13px;
  margin-bottom:18px;
  font-size:12px;
  line-height:1.55;
}
.site-footer-modern .footer-contact-item > span{
  min-width:0;
  white-space:normal;
}
.site-footer-modern .footer-contact-item:first-of-type > span{
  white-space:nowrap;
}
.site-footer-modern .footer-modern-bottom{
  display:flex;
  align-items:center;
  justify-content:center;
  padding-top:22px;
  padding-bottom:24px;
}
.site-footer-modern .footer-copyright{
  text-align:center;
  white-space:nowrap;
  color:#eaf6ff;
  font-size:10px;
  font-weight:600;
  letter-spacing:.01em;
}

@media(max-width:1100px){
  .site-footer-modern .footer-modern-top{
    grid-template-columns:1.2fr 1fr 1fr;
    gap:40px;
  }
  .site-footer-modern .footer-modern-brand{
    grid-column:span 3;
  }
  .site-footer-modern .footer-contact-item:first-of-type > span{
    white-space:normal;
  }
}

@media(max-width:760px){
  .site-footer-modern .footer-modern-top{
    grid-template-columns:1fr 1fr;
    gap:38px 28px;
  }
  .site-footer-modern .footer-modern-brand{
    grid-column:span 2;
  }
  .site-footer-modern .footer-services-column{
    grid-column:span 2;
  }
  .site-footer-modern .footer-contact-item:first-of-type > span{
    white-space:normal;
  }
  .site-footer-modern .footer-modern-bottom{
    display:flex;
    justify-content:center;
    text-align:center;
  }
  .site-footer-modern .footer-copyright{
    white-space:normal;
  }
}

@media(max-width:520px){
  .site-footer-modern .footer-modern-top{
    grid-template-columns:1fr;
    gap:34px;
  }
  .site-footer-modern .footer-modern-brand,
  .site-footer-modern .footer-services-column{
    grid-column:auto;
  }
  .site-footer-modern .footer-copyright{
    font-size:9px;
  }
}

/* Security honeypot field: invisible to real visitors, visible to basic bots. */
.contact-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;}

/* =========================================================
   LARGE DISPLAY / 2K / 4K / SMART TV OPTIMIZATION — IBU
   Keeps the existing desktop/tablet/mobile design intact while
   scaling content proportionally on very wide viewports.
   ========================================================= */
@media (min-width: 1920px){
  :root{--container:1480px}
  .container{width:min(calc(100% - 96px),var(--container))}
  .site-header{padding:22px 0}
  .site-header.scrolled{padding:13px 0}
  .brand{gap:14px}
  .brand-symbol{width:50px;height:50px}
  .brand-symbol span{font-size:15px}
  .brand-text{font-size:16px}
  .nav-wrap{gap:42px}
  .nav-links{gap:30px}
  .nav-links a{font-size:14px}

  .skr-page-hero.skr-hero-about,
  .skr-page-hero.skr-hero-services,
  .skr-page-hero.skr-hero-projects{
    height:430px;
    min-height:430px;
    max-height:430px;
    padding:170px 0 80px;
  }
  .skr-page-hero h1{font-size:clamp(48px,3.4vw,72px)}
  .skr-hero-about.ibu-about-hero h1{font-size:clamp(48px,3.4vw,72px)}
  .skr-page-hero p{font-size:16px;line-height:1.7}

  .section-v3{padding:88px 0}
  .section-title,.section-v3 h2{font-size:clamp(38px,3.1vw,54px)}
  .service-list-modern .service-modern-grid{gap:24px}
  .service-list-modern .service-modern-card,
  .service-list-modern .service-modern-card.featured{
    min-height:400px;
    padding:28px;
    border-radius:22px;
  }
  .service-list-modern .service-card-top i{width:52px;height:52px;font-size:20px}
  .service-list-modern .service-card-body h3{font-size:clamp(25px,1.7vw,34px)}
  .service-list-modern .service-card-body>p{font-size:13px}

  .project-modern-grid{gap:24px}
  .project-modern-image{height:270px}
  .project-modern-content{padding:24px 25px 26px}
  .project-modern-content h3{font-size:22px}
  .project-modern-description{font-size:14px}

  .site-footer-modern .footer-modern-top{
    gap:58px;
    padding-top:88px;
    padding-bottom:68px;
  }
  .site-footer-modern .footer-contact-item{font-size:14px}
  .site-footer-modern .footer-copyright{font-size:12px}
}

@media (min-width: 2560px){
  :root{--container:1720px}
  .container{width:min(calc(100% - 120px),var(--container))}
  body{font-size:17px}
  .site-header{padding:26px 0}
  .site-header.scrolled{padding:15px 0}
  .brand-symbol{width:56px;height:56px}
  .brand-symbol span{font-size:16px}
  .brand-text{font-size:18px}
  .nav-wrap{gap:52px}
  .nav-links{gap:36px}
  .nav-links a{font-size:15px}

  .skr-page-hero.skr-hero-about,
  .skr-page-hero.skr-hero-services,
  .skr-page-hero.skr-hero-projects{
    height:500px;
    min-height:500px;
    max-height:500px;
    padding:195px 0 90px;
  }
  .skr-page-hero h1,
  .skr-hero-about.ibu-about-hero h1{font-size:clamp(56px,3.1vw,82px)}
  .skr-page-hero p{font-size:18px;max-width:820px}

  .section-v3{padding:105px 0}
  .section-title,.section-v3 h2{font-size:clamp(44px,2.8vw,64px)}
  .service-list-modern .service-modern-grid{gap:28px}
  .service-list-modern .service-modern-card,
  .service-list-modern .service-modern-card.featured{
    min-height:450px;
    padding:32px;
    border-radius:24px;
  }
  .service-list-modern .service-card-top i{width:58px;height:58px;font-size:22px}
  .service-list-modern .service-card-body h3{font-size:clamp(28px,1.55vw,38px)}
  .service-list-modern .service-card-body>p{font-size:14px;line-height:1.7}
  .service-list-modern .service-detail ul{font-size:11px}

  .project-modern-grid{gap:28px}
  .project-modern-image{height:315px}
  .project-modern-content{padding:28px 30px 30px}
  .project-modern-content h3{font-size:25px}
  .project-modern-description{font-size:15px}
  .project-modern-link{font-size:11px}

  .site-footer-modern .footer-modern-top{
    gap:72px;
    padding-top:100px;
    padding-bottom:78px;
  }
  .site-footer-modern .footer-contact-item{font-size:15px}
  .site-footer-modern .footer-copyright{font-size:13px}
}

@media (min-width: 3200px){
  :root{--container:1920px}
  .container{width:min(calc(100% - 160px),var(--container))}
  body{font-size:18px}
  .site-header{padding:30px 0}
  .site-header.scrolled{padding:18px 0}
  .brand-symbol{width:62px;height:62px}
  .brand-symbol span{font-size:18px}
  .brand-text{font-size:20px}
  .nav-links{gap:44px}
  .nav-links a{font-size:16px}

  .skr-page-hero.skr-hero-about,
  .skr-page-hero.skr-hero-services,
  .skr-page-hero.skr-hero-projects{
    height:590px;
    min-height:590px;
    max-height:590px;
    padding:225px 0 105px;
  }
  .skr-page-hero h1,
  .skr-hero-about.ibu-about-hero h1{font-size:clamp(64px,3vw,94px)}
  .skr-page-hero p{font-size:20px;max-width:940px}

  .section-v3{padding:125px 0}
  .section-title,.section-v3 h2{font-size:clamp(50px,2.6vw,72px)}
  .service-list-modern .service-modern-grid{gap:32px}
  .service-list-modern .service-modern-card,
  .service-list-modern .service-modern-card.featured{
    min-height:500px;
    padding:38px;
  }
  .service-list-modern .service-card-body h3{font-size:40px}
  .service-list-modern .service-card-body>p{font-size:15px}
  .service-list-modern .service-detail ul{font-size:12px}

  .project-modern-grid{gap:32px}
  .project-modern-image{height:350px}
  .project-modern-content{padding:32px 34px 34px}
  .project-modern-content h3{font-size:28px}
  .project-modern-description{font-size:16px}

  .site-footer-modern .footer-modern-top{
    gap:82px;
    padding-top:115px;
    padding-bottom:90px;
  }
  .site-footer-modern .footer-contact-item{font-size:16px}
  .site-footer-modern .footer-copyright{font-size:14px}
}

/* Prevent accidental horizontal overflow on very wide displays. */
@media (min-width:1920px){
  html,body{overflow-x:hidden}
}


/* Proteksi interaksi foto saat Project lightbox/zoom aktif */
.project-lightbox-stage img{
  -webkit-user-drag:none;
  user-select:none;
}

/* Final audit: privacy and 404 pages */
.narrow-content{max-width:900px;margin-inline:auto}
.simple-page-hero{padding:120px 0 70px;background:linear-gradient(135deg,#0b5ed7,#163a70);color:#fff}
.simple-page-hero .eyebrow{display:inline-block;margin-bottom:12px;font-size:.78rem;font-weight:800;letter-spacing:.14em;color:#b9dcff}
.simple-page-hero h1{margin:0 0 14px;font-size:clamp(2rem,4vw,3.5rem);line-height:1.08}
.simple-page-hero p{max-width:720px;margin:0;color:rgba(255,255,255,.86);font-size:1.05rem;line-height:1.7}
.content-card{background:#fff;border:1px solid rgba(22,58,112,.10);border-radius:18px;padding:clamp(24px,4vw,42px);box-shadow:0 12px 35px rgba(15,45,85,.07)}
.content-card h2{margin:0 0 10px;color:#163a70;font-size:1.2rem}
.content-card h2:not(:first-child){margin-top:28px}
.content-card p{margin:0;color:#4b5563;line-height:1.8}
.content-card a{color:#0b5ed7;font-weight:700}
.privacy-updated{margin-top:28px!important;padding-top:18px;border-top:1px solid #e5e7eb;font-size:.9rem;color:#6b7280!important}
.error-page{min-height:58vh;display:grid;place-items:center;padding-block:70px}
.error-card{text-align:center;padding:50px 24px}
.error-code{display:block;color:#0b5ed7;font-size:clamp(5rem,14vw,9rem);font-weight:800;line-height:.9;letter-spacing:-.06em}
.error-card h1{margin:24px 0 10px;color:#163a70}
.error-card p{margin:0 auto 26px;max-width:600px;color:#6b7280;line-height:1.7}
.error-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.error-actions a{text-decoration:none}


/* Visual media protection: prevent native image dragging/selection affordances. */
img, picture, svg, canvas, video {
  -webkit-user-drag: none;
}
.project-lightbox-stage img, .project-modern-image img, .project-card img {
  user-select: none;
  -webkit-user-select: none;
}

/* Project page: tampilkan pesan yang jelas bila query production mengembalikan 0 baris. */
.project-empty-visible{
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:180px;
  padding:35px 20px;
  margin:0 0 24px;
  border:1px dashed #cbddea;
  border-radius:18px;
  background:#f8fcff;
  color:#5f7488;
  text-align:center;
  font:500 13px/1.6 Inter,sans-serif;
}
.project-empty-visible strong{color:#082f67;font-weight:800}
.project-empty-visible span{max-width:620px}
.project-empty-visible code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em}