/* October 14 local review: KACA projections, testimonial board and History flow. */
html body[data-page][class] .kaca-popover{position:absolute!important;left:-218px;top:50px;width:250px;z-index:12;padding:0 0 18px;border:1px solid #bde7f3;border-radius:24px;background:linear-gradient(160deg,#ffffffed,#eafaffed);backdrop-filter:blur(20px);box-shadow:0 16px 40px #17496024;color:#183a57;animation:holo-arrive .28s ease both}
html body[data-page][class] .kaca-popover[hidden]{display:none!important}
.holo-close{position:absolute;right:8px;top:6px;width:32px;height:32px;border:0;background:#ffffffbd;color:#20506c;border-radius:50%;font:24px Arial;cursor:pointer;z-index:3}
.holo-visual{position:relative;height:205px;overflow:hidden;border-radius:23px 23px 0 0;background:radial-gradient(ellipse at 50% 65%,#123f62,#0b233e 72%)}
.holo-canvas{height:100%;width:100%;filter:drop-shadow(0 0 4px #3aeaff70)}
.holo-canvas canvas{display:block;width:100%;height:100%}
.holo-canvas>img{width:100%;height:100%;object-fit:contain;filter:grayscale(1) sepia(1) hue-rotate(125deg)}
.holo-scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 4px,#7aeaff0b 5px 6px);opacity:.65}
html body[data-page][class] .holo-copy{padding:17px 20px 0!important;text-align:left}
html body[data-page][class] .holo-copy h2{font:700 25px/1.05 LeagueSpartan,Arial,sans-serif!important;letter-spacing:.02em;margin:0 0 9px!important;color:#175b86!important;background:none!important;-webkit-text-fill-color:currentColor!important}
html body[data-page][class] .holo-copy p{font:14px/1.4 Arial,sans-serif!important;margin:0!important;color:#375c73!important}
html body[data-page][class] .holo-copy .holo-detail{font-size:12px!important;margin-top:5px!important;color:#5a7484!important}
.holo-link{display:inline-block;margin-top:13px;color:#176d98;font:700 12px/1.4 Arial,sans-serif;text-decoration:none}
html body[data-page][class] [data-mini-kaca][aria-expanded=true]{box-shadow:0 0 0 2px #38b7d9,0 0 24px #5fe9ff55!important}
@keyframes holo-arrive{from{opacity:0;transform:translate(10px,8px) scale(.96)}to{opacity:1;transform:none}}
html body[data-page][class] .armada-dialog{width:min(640px,calc(100vw - 28px));max-height:88dvh;padding:0;border:1px solid #d1dfeb;border-radius:22px;background:#f5f9fc;overflow:auto;color:#23394e;box-shadow:0 18px 70px #132c4d40}
.armada-heading{padding:22px 24px 8px}.armada-heading h2{font:700 30px LeagueSpartan,Arial;margin:7px 0}.armada-heading .eyebrow{font-size:10px;margin:0}
.armada-close{position:absolute;right:10px;top:10px;z-index:3;border:0;border-radius:50%;width:34px;height:34px;background:white;color:#244778;font:25px Arial;cursor:pointer}
html body[data-page][class] .armada-dialog .kaca-truck-stage{background:none;border-radius:0;padding:0 20px 14px}
html body[data-page][class] .armada-dialog .kaca-truck-host{height:280px}
html body[data-page][class] .armada-dialog .truck-load-status{font-size:10px}
/* Full-width context image above each consultation form. */
html body[data-page][class] #konsultasi .business-preview .sector-panel{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;border-radius:16px!important;overflow:hidden!important}
html body[data-page][class] #konsultasi .business-preview .shelf-photo{width:100%!important;height:158px!important;min-height:0!important;max-height:none!important;aspect-ratio:auto!important;flex:none!important;position:relative!important}
html body[data-page][class] #konsultasi .business-preview .shelf-photo img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 54%!important;position:absolute!important;inset:0!important}
html body[data-page][class] #konsultasi .business-preview .sector-copy{padding:15px 18px 17px!important}
/* Shared title/caption/model grid avoids legacy absolute positioning overlaps. */
html body[data-page=tentang][class]{padding-top:0!important}
html body[data-page=tentang][class] main#main{padding-top:96px!important;margin-top:0!important}
html body[data-page=tentang][class] #cerita.branch-story{height:auto!important;margin:0!important;padding:0!important;border:0!important;min-height:0!important;background:linear-gradient(110deg,#f7f9fc,#edf2f7)!important}
html body[data-page=tentang][class] #cerita .branch-stage{position:relative!important;top:auto!important;display:grid!important;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr)!important;grid-template-rows:auto minmax(360px,430px) auto auto!important;gap:0 14px!important;width:min(1240px,88%)!important;height:auto!important;min-height:0!important;max-height:none!important;padding:30px 0 12px!important;margin:0 auto!important;overflow:hidden!important;background:none!important}
html body[data-page=tentang][class] #cerita .history-title{position:static!important;grid-column:1/-1;grid-row:1;margin:0 0 12px!important;font-size:clamp(30px,3.4vw,46px)!important;line-height:1.1!important;z-index:2}
html body[data-page=tentang][class] #cerita .branch-caption{position:static!important;grid-column:1;grid-row:2;align-self:center!important;inset:auto!important;transform:none!important;width:auto!important;padding:0!important;pointer-events:auto!important;z-index:2}
html body[data-page=tentang][class] #cerita .branch-caption .eyebrow{margin:0 0 16px!important;font-size:10px!important;letter-spacing:.13em!important}
html body[data-page=tentang][class] #cerita .branch-year{font:400 clamp(55px,6vw,84px)/1 Arial,sans-serif!important;margin:0 0 22px!important}
html body[data-page=tentang][class] #cerita .branch-caption h2{font:700 clamp(27px,3vw,38px)/1.1 LeagueSpartan,Arial,sans-serif!important;margin:0 0 12px!important}
html body[data-page=tentang][class] #cerita .branch-description{font:15px/1.6 Arial,sans-serif!important;max-width:34ch!important;margin:0!important}
html body[data-page=tentang][class] #cerita .branch-canvas{position:relative!important;inset:auto!important;grid-column:2;grid-row:2;width:100%!important;height:100%!important;min-height:0!important;clip-path:none!important;overflow:hidden!important}
html body[data-page=tentang][class] #cerita .branch-canvas canvas{width:100%!important;height:100%!important;display:block!important}
html body[data-page=tentang][class] #cerita .branch-nav{position:relative!important;inset:auto!important;grid-column:1/-1;grid-row:3;margin:8px 0 0!important;padding:12px 0!important;background:none!important;gap:8px!important}
html body[data-page=tentang][class] #cerita .branch-nav button{font-size:15px!important;padding:8px 4px!important}
html body[data-page=tentang][class] #cerita .branch-nav span{font-size:11px!important}
html body[data-page=tentang][class] #cerita .branch-hint{position:static!important;grid-column:1;grid-row:4;font-size:10px!important;margin:8px 0!important}
html body[data-page=tentang][class] #cerita .branch-reconstruction{display:none!important}
html body[data-page=tentang][class] #cerita .history-motion-toggle{position:static!important;grid-column:2;grid-row:4;justify-self:end!important;align-self:center!important;margin:0!important;padding:6px 10px!important;font-size:10px!important}
html body[data-page=tentang][class] #cerita .branch-shop{font-size:12px!important;padding:10px 14px!important;margin-top:17px!important}
@media(max-width:1000px){html body[data-page][class] .kaca-popover{left:-170px;width:230px;top:70px}.holo-visual{height:190px}}
@media(max-width:760px){
 html body[data-page][class] .kaca-popover{left:-145px;top:45px;width:225px}
 html body[data-page][class] #konsultasi .business-preview .shelf-photo{height:110px!important}
 html body[data-page][class] #konsultasi .business-preview .sector-copy{padding:10px!important}
 html body[data-page=tentang][class] main#main{padding-top:90px!important}
 html body[data-page=tentang][class] #cerita .branch-stage{width:92%!important;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)!important;grid-template-rows:auto 300px auto auto!important;padding-top:22px!important;gap:0 10px!important}
 html body[data-page=tentang][class] #cerita .history-title{font-size:30px!important;margin-bottom:14px!important}
 html body[data-page=tentang][class] #cerita .branch-year{font-size:46px!important;margin-bottom:14px!important}
 html body[data-page=tentang][class] #cerita .branch-caption h2{font-size:23px!important}
 html body[data-page=tentang][class] #cerita .branch-caption .eyebrow{font-size:8px!important}
 html body[data-page=tentang][class] #cerita .branch-description{font-size:12px!important}
 html body[data-page=tentang][class] #cerita .branch-nav{gap:2px!important}
 html body[data-page=tentang][class] #cerita .branch-nav button{font-size:12px!important}
 html body[data-page=tentang][class] #cerita .branch-nav span{font-size:9px!important}
}
@media(max-width:500px){
 html body[data-page][class] .kaca-popover{left:-10px;top:45px;width:250px;z-index:15}
 html body[data-page=tentang][class] #cerita .branch-stage{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)!important;grid-template-rows:auto 260px auto auto!important}
 html body[data-page=tentang][class] #cerita .history-title{font-size:27px!important}
 html body[data-page=tentang][class] #cerita .branch-year{font-size:40px!important}
 html body[data-page=tentang][class] #cerita .branch-caption h2{font-size:21px!important}
 html body[data-page=tentang][class] #cerita .branch-description{font-size:11px!important}
 html body[data-page=tentang][class] #cerita .branch-nav button{font-size:11px!important}
 html body[data-page=tentang][class] #cerita .branch-nav span{font-size:8px!important}
 html body[data-page=tentang][class] #cerita .branch-shop{font-size:10px!important;padding:8px 10px!important}
}
@media(prefers-reduced-motion:reduce){.kaca-popover{animation:none!important}}
html body[data-page][class] #konsultasi .business-preview .sector-copy{width:100%!important;max-width:none!important;box-sizing:border-box!important;align-self:stretch!important;margin:0!important;text-align:left!important}
/* Compact pinned-video corkboard, with actual push pins and two brand stickers. */
html body[data-page][class] #ulasan .cafeholics-board{min-width:0;width:100%;align-self:center}
html body[data-page][class] #ulasan .visits-wall{position:relative!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:auto auto!important;gap:20px 15px!important;padding:24px 19px 39px!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;align-content:center!important}
html body[data-page][class] #ulasan .visit-polaroid{position:relative!important;display:block!important;width:100%!important;min-width:0!important;max-width:120px!important;margin:0!important;padding:6px 6px 9px!important;transform:rotate(-2deg)!important;background:#fff!important;border:0!important;border-radius:2px!important;align-self:start!important;box-shadow:2px 5px 7px #52371b3d!important;transition:transform .2s!important}
html body[data-page][class] #ulasan .visit-polaroid:nth-child(even){transform:rotate(2deg)!important}
html body[data-page][class] #ulasan .visit-polaroid:hover,html body[data-page][class] #ulasan .visit-polaroid:focus-visible{transform:rotate(0) translateY(-3px)!important}
html body[data-page][class] #ulasan .visit-polaroid:before,html body[data-page][class] #ulasan .visit-polaroid:nth-child(even):before{content:''!important;display:block!important;position:absolute!important;top:-5px!important;left:calc(50% - 5px)!important;width:10px!important;height:10px!important;border-radius:50%!important;background:radial-gradient(circle at 33% 25%,#ffb39a,#cf3b2b 55%,#92281d)!important;border:0!important;transform:none!important;box-shadow:1px 3px 3px #53241180!important;z-index:3}
html body[data-page][class] #ulasan .visit-polaroid:nth-child(3n):before{background:radial-gradient(circle at 33% 25%,#a0c8ff,#2d66b4 55%,#244577)!important}
html body[data-page][class] #ulasan .visit-polaroid:after{display:none!important;content:none!important}
html body[data-page][class] #ulasan .visit-photo{display:block;position:relative;width:100%;height:116px;overflow:hidden;background:#e8f0f7}
html body[data-page][class] #ulasan .visit-photo>img{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:center 38%!important;display:block!important}
html body[data-page][class] #ulasan .visit-photo>img.visit-top-aligned{object-position:center top!important}
html body[data-page][class] #ulasan .visit-polaroid strong{display:block!important;font-size:11px!important;line-height:1.3!important;margin:8px 0 0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.visit-play{position:absolute;right:5px;bottom:5px;display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#fffef2ed;color:#25449d;font-size:10px;box-shadow:0 1px 4px #17345130}
.visit-placeholder{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;width:100%;height:100%;background:linear-gradient(140deg,#eaf5fd,#dfe8ff);color:#2444ad;font:700 9px Arial;letter-spacing:.13em}
html body[data-page][class] #ulasan .visit-placeholder img{width:68%!important;height:auto!important;object-fit:contain!important;aspect-ratio:auto!important}
html body[data-page][class] #ulasan .board-sticker{position:absolute;object-fit:contain;pointer-events:none;filter:drop-shadow(1px 0 #fff) drop-shadow(-1px 0 #fff) drop-shadow(0 -1px #fff) drop-shadow(0 2px #fff) drop-shadow(0 2px 2px #69442f40)}
.board-logo{width:63px;height:33px;bottom:2px;left:15px;transform:rotate(-8deg)}
.board-mascot{width:42px;height:53px;bottom:-5px;right:9px;transform:rotate(9deg)}
.board-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:0 4px}
.board-controls>a{font:600 10px/1.4 Arial;color:#37598b;text-decoration:none;letter-spacing:.03em}
.board-controls>div{display:flex;gap:6px}
html body[data-page][class] .board-controls button{display:grid;place-items:center;border:1px solid #cfdbed;border-radius:50%;background:#ffffffaa;color:#294a9e;width:28px;height:28px;min-height:0;min-width:0;padding:0;font:14px Arial;cursor:pointer}
@media(max-width:760px){
 html body[data-page][class] #ulasan .visits-wall{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:19px 14px!important;padding:23px 17px 35px!important}
 html body[data-page][class] #ulasan .visit-polaroid{max-width:125px!important;padding:5px 5px 8px!important}
 html body[data-page][class] #ulasan .visit-photo{height:112px}
 html body[data-page][class] #ulasan .visit-polaroid strong{font-size:10px!important}
 html body[data-page][class] #ulasan .visit-polaroid:nth-child(n+7){display:none!important}
}
@media(prefers-reduced-motion:reduce){html body[data-page][class] #ulasan .visit-polaroid{transition:none!important}}