/* Café Glass: local review of guided shopping, September 2026. */
:root{--guide-blue:#1637c7;--guide-ink:#19263f;--guide-red:#d93832;--guide-line:#dce5f3}
body main h1,body main h2,body main h3,.guide-contact-dialog h2,.guide-contact-dialog h3{font-family:Fredoka,Arial,sans-serif;font-weight:550;letter-spacing:-.02em;line-height:1.2}
body main .brand-script{font-family:Lobster,Georgia,serif}
.site-header .logo{transition:transform .25s,filter .25s;position:relative}
.site-header .logo:hover,.site-header .logo:focus-visible{transform:translateY(-3px) rotate(-2deg);filter:drop-shadow(0 3px 10px #84a7ff70)}
.site-header .logo:after{content:'Beranda';position:absolute;left:32px;bottom:-13px;opacity:0;font-size:12px;letter-spacing:.03em;color:var(--guide-blue);transition:opacity .2s}
.site-header .logo:hover:after,.site-header .logo:focus-visible:after{opacity:1}
.header-cta.button{position:relative;isolation:isolate;overflow:visible;font-size:14px;margin-right:6px}
.header-cta>span{position:relative;z-index:2}
.header-mascot{position:absolute!important;z-index:-1;width:68px!important;height:74px!important;max-width:none!important;right:-14px;bottom:13px;object-fit:contain;pointer-events:none;transform:rotate(9deg);transition:transform .25s}
.header-cta:hover .header-mascot,.header-cta:focus-visible .header-mascot{transform:translateY(-5px) rotate(2deg)}
.header-cta:before{content:'';position:absolute;inset:0;border-radius:inherit;background:inherit;z-index:0}
.catalog-nav{position:relative}.catalog-nav-top{display:flex;align-items:center;gap:2px}.catalog-toggle{display:grid;place-items:center;width:32px;height:42px;border:0;background:transparent;color:var(--guide-blue);cursor:pointer;border-radius:10px}
.catalog-toggle svg{transition:transform .2s}.catalog-toggle[aria-expanded=true] svg{transform:rotate(180deg)}
.catalog-subnav{position:absolute;top:100%;left:-18px;min-width:310px;background:#fff;border:1px solid var(--guide-line);border-radius:20px;padding:10px;box-shadow:0 18px 45px #142c5820}
.catalog-subnav[hidden]{display:none!important}.header-inner nav .catalog-subnav a{display:flex;flex-direction:column;gap:6px;padding:17px 15px;border-radius:12px}.catalog-subnav a:hover,.catalog-subnav a:focus-visible{background:#eff4ff}.catalog-subnav strong{font-size:17px;color:var(--guide-blue)}.catalog-subnav span{font-size:14px;font-weight:400;color:#53647b}.header-inner nav .catalog-subnav a[aria-current]:after{display:none}
.guide-page{background:#fff}.guide-page main{padding-bottom:0}.guide-page p{font-size:1rem;line-height:1.75;color:#53647b}.guide-breadcrumb{display:flex;gap:10px;flex-wrap:wrap;font-size:14px;color:#65748b;margin:10px 0 34px}.guide-breadcrumb a:hover{color:var(--guide-blue);text-decoration:underline}
.guide-hero{padding-bottom:50px}.guide-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:6%;align-items:center}.guide-hero h1{font-size:clamp(2.6rem,4.7vw,4.5rem);margin:16px 0 22px;line-height:1.13}.guide-hero h1 span{color:var(--guide-blue)}.guide-hero-grid>div>p:not(.eyebrow){max-width:48ch;font-size:1.1rem}.guide-hero figure{position:relative;margin:0}.guide-hero figure>img{width:100%;height:390px;object-fit:cover;border-radius:38px 38px 110px 38px}.guide-hero figcaption{position:absolute;bottom:22px;left:22px;background:#fffffff0;padding:12px 16px;border-radius:30px;letter-spacing:.06em;font-size:12px;font-weight:700;color:var(--guide-blue);max-width:calc(100% - 44px)}
.guide-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:28px}.guide-page .button{border-radius:30px;font-size:14px;min-height:48px}.guide-page .text-link{font-size:14px}.guide-page .eyebrow{font-size:12px;letter-spacing:.12em;color:var(--guide-red);font-weight:700}
.guide-section{padding-block:48px 64px}.guide-section-heading{margin-bottom:28px}.guide-section-heading h2,.guide-detail-body h2,.guide-help h2{font-size:clamp(2rem,3.1vw,3rem);color:var(--guide-blue);margin:8px 0 14px}.guide-section-heading>p:not(.eyebrow){max-width:60ch}
.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.guide-card{display:block;border:1px solid var(--guide-line);border-radius:25px;overflow:hidden;background:#fff;transition:transform .25s,box-shadow .25s}.guide-card:hover,.guide-card:focus-visible{transform:translateY(-6px);box-shadow:0 15px 35px #173a7015}.guide-card-image{aspect-ratio:1.65;overflow:hidden;background:#f1f5fc}.guide-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.guide-card:hover img{transform:scale(1.035)}.guide-card-copy{position:relative;padding:23px 24px 25px}.guide-number{position:absolute;right:22px;top:22px;color:#7687a2;font-size:12px}.guide-card h3{font-size:1.55rem;color:var(--guide-ink);padding-right:25px}.guide-card p{margin:10px 0 22px;font-size:15px}.guide-card-link{font-size:14px;color:var(--guide-blue);font-weight:650;display:flex;justify-content:space-between}.guide-card-link span{font-size:20px}
.guide-process{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));list-style:none;padding:0;margin:30px 0 0;gap:0;border:1px solid var(--guide-line);border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#f0f5ff,#fff)}.guide-process li{padding:26px 20px;border-right:1px solid var(--guide-line)}.guide-process li:last-child{border:0}.guide-process li>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:white;border:1px solid #d1dcf8;color:var(--guide-blue);font-size:14px;font-weight:700;margin-bottom:30px}.guide-process h3{font-size:1.2rem;margin-bottom:12px}.guide-process p{font-size:14px}
.consult-band{background:#173ac4;background:linear-gradient(130deg,#143cc5,#2034a9);padding:64px 0 72px}.consult-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:7%;align-items:start}.consult-band h2{font-size:clamp(2.2rem,3.5vw,3.6rem);color:white;margin:12px 0 22px}.consult-band .eyebrow{color:#d6e7ff}.guide-page .consult-intro{color:#e0e7ff;max-width:49ch;margin-bottom:30px}.consult-band fieldset{border:0;padding:0;margin:24px 0}.consult-band legend{color:white;font-size:15px;font-weight:650;margin-bottom:13px}.consult-options{display:flex;gap:8px;flex-wrap:wrap}.consult-options label{position:relative;cursor:pointer;display:block;margin:0}.consult-options input{position:absolute;width:1px;height:1px;opacity:0}.consult-options span{display:block;border:1px solid #9eb2ff;padding:10px 14px;border-radius:25px;font-size:14px;color:white;line-height:1.4;transition:background .2s}.consult-options input:checked+span{background:white;color:#173ac4;border-color:white;font-weight:600}.consult-options input:focus-visible+span{outline:3px solid #ffc857;outline-offset:3px}.consult-result{background:#fff;border-radius:26px;padding:32px;position:sticky;top:125px}.consult-result .eyebrow{color:var(--guide-red)}.consult-result h3{font-size:1.8rem;margin:10px 0}.consult-result p{font-size:15px}.consult-result ul{padding:0;list-style:none;margin:22px 0}.consult-result li{padding:12px 0;border-bottom:1px solid var(--guide-line)}.consult-result li a{display:flex;justify-content:space-between;gap:14px;color:var(--guide-blue);font-size:15px;text-decoration:underline;text-underline-offset:4px}.consult-result .consult-note{font-size:14px;margin-bottom:20px}.consult-branch{display:block;font-size:14px;font-weight:600;margin-bottom:16px}.consult-branch select{display:block;width:100%;border:1px solid #c8d5ed;background:white;border-radius:12px;padding:12px;margin-top:8px;color:var(--guide-ink);font:inherit}.consult-whatsapp{width:100%;background:#177947!important;color:white!important}.consult-more{display:block;text-align:center;color:var(--guide-blue);margin:18px 0;text-decoration:underline;font-size:14px}.consult-result small{display:block;font-size:12px;line-height:1.6;color:#65748b}
.guide-detail-hero{padding-bottom:42px}.guide-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center}.guide-detail-grid h1{font-size:clamp(2.8rem,5vw,4.5rem);color:var(--guide-blue);margin:14px 0}.guide-detail-grid .guide-tagline{font-size:1.45rem;font-family:Fredoka,Arial,sans-serif;color:var(--guide-ink);margin-bottom:15px}.guide-detail-grid .button{margin-top:25px}.guide-detail-grid>img{width:100%;height:330px;object-fit:cover;border-radius:30px 30px 90px 30px}.guide-detail-body{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:5%;align-items:start;border-top:1px solid var(--guide-line)}.guide-explainer{margin:0 0 24px}.guide-table-scroll{overflow-x:auto;border:1px solid var(--guide-line);border-radius:20px}.guide-table{border-collapse:collapse;width:100%;font-size:15px;text-align:left}.guide-table th{background:#eef3ff;padding:18px 16px;font-size:14px;color:var(--guide-blue)}.guide-table td{padding:20px 16px;border-top:1px solid var(--guide-line);vertical-align:top;line-height:1.65}.guide-table td:nth-child(2){color:#53647b}.guide-table td a{color:var(--guide-blue);text-decoration:underline;text-underline-offset:4px}.guide-table tr:has(input:checked){background:#f1f6ff}.guide-check{display:flex;gap:10px;align-items:start;font-weight:600;cursor:pointer}.guide-check input{width:19px;height:19px;flex:none;margin:3px 0;accent-color:var(--guide-blue)}.guide-selection{position:sticky;top:125px;background:#f0f5ff;border:1px solid #d8e3f6;border-radius:24px;padding:28px}.guide-selection h3{font-size:1.6rem;margin:14px 0}.guide-selection p{font-size:14px;margin:14px 0}.guide-selection ul{padding-left:20px;font-size:14px;line-height:1.7;margin:14px 0 24px}.guide-selection .button{white-space:normal;text-align:center}.guide-reset{display:block;background:none;border:0;text-decoration:underline;color:#65748b;margin:14px auto;font-size:14px;cursor:pointer}.guide-reset:disabled{opacity:.5;cursor:default}.guide-planning{margin:38px 0 25px}.guide-planning h2{font-size:1.8rem}.guide-planning ul{padding-left:22px;line-height:1.85;color:#53647b;font-size:16px}.guide-planning li{padding-left:5px;margin-bottom:10px}.guide-sources{border-top:1px solid var(--guide-line);padding:18px 0;color:#65748b;font-size:14px}.guide-sources summary{cursor:pointer}.guide-sources p{font-size:14px;margin:15px 0}.guide-sources a{text-decoration:underline;line-height:1.7}.guide-important{background:#f0f5ff;border-left:3px solid var(--guide-blue);padding:20px;margin:24px 0;font-size:14px!important}.guide-help{display:flex;justify-content:space-between;align-items:center;gap:30px;background:#eef4ff;border-radius:28px;padding:36px 40px;margin-bottom:60px}
.cafefam-float{position:fixed;z-index:46;right:20px;bottom:82px;display:flex;align-items:center;justify-content:flex-end;border:0;border-radius:40px;background:var(--guide-blue);color:white;min-height:54px;width:60px;box-shadow:0 8px 28px #1236a833;cursor:pointer;padding:10px 16px;transition:width .25s;isolation:isolate}.cafefam-float .help-icon{flex:none;width:26px;height:26px}.cafefam-float .float-label{white-space:nowrap;font-size:14px;max-width:0;opacity:0;overflow:hidden;transition:max-width .25s,opacity .2s}.cafefam-float:hover,.cafefam-float:focus-visible{width:240px}.cafefam-float:hover .float-label,.cafefam-float:focus-visible .float-label{max-width:190px;opacity:1;margin-right:13px}.cafefam-float .float-mascot{position:absolute;width:68px;height:80px;object-fit:contain;right:0;bottom:32px;z-index:-1;pointer-events:none}.cafefam-float:before{content:'';position:absolute;inset:0;border-radius:inherit;background:inherit;z-index:-1}.guide-contact-dialog{border:1px solid var(--guide-line);border-radius:28px;padding:38px;max-width:560px;width:calc(100% - 32px);max-height:88dvh;overflow:auto;color:var(--guide-ink)}.guide-contact-dialog::backdrop{background:#10285877;backdrop-filter:blur(5px)}.guide-contact-dialog h2{font-size:2.3rem;color:var(--guide-blue);margin:12px 0}.guide-contact-dialog p{font-size:16px;line-height:1.7;color:#53647b}.guide-contact-dialog .help-branches{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0}.help-branches a{border:1px solid var(--guide-line);border-radius:14px;padding:17px;font-size:15px;color:var(--guide-blue);font-weight:600}.help-branches a:hover{background:#edf3ff}.help-branches small{display:block;margin-top:6px;font-size:12px;font-weight:400;color:#65748b}.guide-contact-dialog .help-close{position:absolute;right:16px;top:15px;width:36px;height:36px;border:0;border-radius:50%;background:#edf3ff;color:var(--guide-blue);font-size:24px;cursor:pointer}.guide-contact-dialog .help-details{font-size:14px;color:var(--guide-blue);text-decoration:underline}.home-shortcuts{flex-wrap:wrap}.mascot-hub{padding-top:28px}.music-launch{font-size:14px!important;min-height:44px}
@media(min-width:1000px) and (max-width:1200px){.header-inner.wrap{display:grid;grid-template-columns:135px minmax(0,1fr) 150px;gap:10px}.header-inner nav{position:static;display:flex!important;flex-direction:row;align-items:center;padding:0;border:0;box-shadow:none;background:none!important;overflow:visible;gap:18px;font-size:14px}.header-inner nav a{padding:18px 0}.menu-toggle{display:none}.header-inner nav a[aria-current]:after{right:auto;left:50%;bottom:6px}}
@media(max-width:999px){.header-inner nav .catalog-nav-top>a{flex:1}.catalog-toggle{width:44px}.catalog-subnav{position:static;min-width:0;box-shadow:none;border:0;background:#f0f5ff;margin-bottom:8px}.header-inner nav .catalog-subnav a{padding:14px}.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-hero figure>img{height:330px}.guide-process{grid-template-columns:repeat(3,1fr)}.guide-process li{border-bottom:1px solid var(--guide-line)}.consult-layout{gap:30px;grid-template-columns:1fr 1fr}.guide-detail-body{gap:25px;grid-template-columns:minmax(0,1.6fr) minmax(230px,1fr)}.guide-table{font-size:14px}.guide-table td{padding:16px 12px}.guide-selection{padding:22px}}
@media(max-width:700px){.header-cta.button{font-size:12px;padding:11px 13px;margin-right:0}.header-mascot{width:50px!important;height:60px!important;bottom:14px;right:-7px}.site-header .logo:after{bottom:-9px;left:24px;font-size:11px}.guide-breadcrumb{font-size:12px;margin-bottom:24px}.guide-hero-grid,.guide-detail-grid{grid-template-columns:1fr;gap:30px}.guide-hero h1{font-size:2.8rem}.guide-hero figure>img{height:260px;border-radius:24px 24px 65px 24px}.guide-hero figcaption{font-size:11px;left:15px;bottom:15px}.guide-hero{padding-bottom:12px}.guide-section{padding-block:30px 42px}.guide-grid{gap:16px}.guide-card{border-radius:18px}.guide-card-copy{padding:18px 15px}.guide-card h3{font-size:1.3rem;padding-right:0}.guide-number{display:none}.guide-card p{font-size:14px;line-height:1.5;min-height:42px;margin-bottom:16px}.guide-card-link{font-size:12px;gap:6px}.guide-card-link span{font-size:16px}.guide-card-image{aspect-ratio:1.2}.guide-process{grid-template-columns:1fr;gap:0;border-radius:20px}.guide-process li{display:grid;grid-template-columns:40px 1fr;column-gap:16px;padding:20px;border-right:0}.guide-process li>span{grid-row:span 2;margin:0}.guide-process h3{font-size:1.2rem;margin-bottom:6px}.guide-process p{grid-column:2}.consult-band{padding-block:40px}.consult-layout{grid-template-columns:1fr}.consult-result{position:static;padding:25px}.consult-band h2{font-size:2.5rem}.guide-detail-grid>img{height:240px}.guide-detail-grid h1{font-size:3rem}.guide-detail-body{grid-template-columns:1fr}.guide-table-scroll{border-radius:15px}.guide-table th{padding:12px 10px;font-size:12px}.guide-table td{padding:15px 10px;font-size:14px;overflow-wrap:anywhere}.guide-table th:first-child{width:29%}.guide-check{gap:6px}.guide-check input{width:17px;height:17px}.guide-selection{position:static}.guide-help{display:block;padding:28px 24px}.guide-help .button{margin-top:20px}.cafefam-float{right:12px;bottom:76px;width:54px;min-height:50px;padding:10px 14px}.cafefam-float .float-mascot{width:58px;height:66px;bottom:30px}.guide-contact-dialog{padding:32px 24px}.guide-contact-dialog h2{font-size:2rem}.guide-actions{gap:18px}.guide-page .guide-actions .text-link{font-size:14px}}
@media(max-width:380px){.guide-grid{grid-template-columns:1fr}.guide-card-image{aspect-ratio:1.7}.guide-card p{min-height:0}.guide-hero h1{font-size:2.4rem}}
@media(prefers-reduced-motion:reduce){.site-header .logo,.header-mascot,.catalog-toggle svg,.guide-card,.guide-card-image img,.cafefam-float,.float-label{transition:none!important;transform:none!important}}
/* Keep the header mascot fully within the viewport. */
.header-mascot{height:62px!important;width:62px!important;bottom:0;right:-12px}
@media(max-width:700px){.header-mascot{height:53px!important;width:53px!important;bottom:0;right:-7px}}
.header-cta.button>span{font-size:inherit;line-height:1.3}
.header-cta.button{margin-right:20px}
.header-mascot{height:72px!important;width:72px!important;bottom:-10px;right:-28px}
@media(max-width:700px){.header-cta.button{margin-right:15px}.header-mascot{height:62px!important;width:62px!important;bottom:-10px;right:-23px}}
@media(max-width:550px){.guide-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.guide-table tbody,.guide-table tr,.guide-table td{display:block;width:auto}.guide-table tr{padding:18px;border-bottom:1px solid var(--guide-line)}.guide-table tr:last-child{border:0}.guide-table td{border:0;padding:6px 0;font-size:15px}.guide-table td:first-child{padding-top:0;font-size:17px}.guide-table td:nth-child(2):before{content:attr(data-label);display:block;font-size:12px;font-weight:600;color:#65748b;margin-bottom:5px}.guide-table td:last-child{padding-bottom:0}.guide-table td a{display:inline-block;padding-block:7px}.guide-check{align-items:center;gap:10px}.guide-check input{width:22px;height:22px;margin:0}}
/* Override legacy page-specific heading families while retaining brand-script lettering. */
body main h1:not(.brand-script),body main h2:not(.brand-script),body main h3:not(.brand-script){font-family:Fredoka,Arial,sans-serif!important;letter-spacing:-.02em;line-height:1.2}