
/* design-systems/premium/tokens.css
 * Structured token bindings for Premium.
 * premium marketing system with warm white canvas, graphite type, and muted bronze signal.
 */
:root {
  --bg: #faf8f4;
  --surface: #ffffff;
  --surface-warm: #f0e7d8;
  --fg: #1c1b19;
  --fg-2: #4b4740;
  --muted: #746d63;
  --meta: #a06a3b;
  --border: #ded6c9;
  --border-soft: #eee7dc;
  --accent: #a06a3b;
  --accent-on: #ffffff;
  --accent-hover: color-mix(in oklab, var(--accent), black 8%);
  --accent-active: color-mix(in oklab, var(--accent), black 14%);
  --success: #3f8f5f;
  --warn: #c4872c;
  --danger: #b84a4a;
  --font-display: "Canela", Georgia, serif;
  --font-body: Inter, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 19px;
  --text-xl: 26px;
  --text-2xl: 40px;
  --text-3xl: 60px;
  --text-4xl: 84px;
  --leading-body: 1.58;
  --leading-tight: 1.02;
  --tracking-display: -0.02em;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --section-y-desktop: 112px;
  --section-y-tablet: 80px;
  --section-y-phone: 56px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-pill: 9999px;
  --elev-flat: none;
  --elev-ring: 0 0 0 1px var(--border);
  --elev-raised: 0 24px 64px rgba(28, 27, 25, 0.12);
  --focus-ring: 0 0 0 4px rgba(160, 106, 59, 0.24);
  --motion-fast: 170ms;
  --motion-base: 280ms;
  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --container-max: 1160px;
  --container-gutter-desktop: 36px;
  --container-gutter-tablet: 24px;
  --container-gutter-phone: 16px;
}
html[data-brand="lampung"]{--bg:oklch(.985 .003 25);--surface:oklch(1 0 0);--fg:oklch(.22 .025 20);--fg-2:oklch(.34 .025 22);--muted:oklch(.44 .018 25);--border:oklch(.86 .008 25);--border-soft:oklch(.92 .006 25);--accent:oklch(.39 .145 20);--accent-on:oklch(1 0 0);--meta:oklch(.56 .1 78);--surface-warm:oklch(.965 .006 25);--accent-hover:oklch(.33 .145 20);--accent-active:oklch(.29 .14 20);--focus-ring:0 0 0 4px oklch(.62 .1 78 / .45)}
  *,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-body);line-height:var(--leading-body)}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{font:inherit}h1,h2,h3,p{margin-top:0}h1,h2{font-family:var(--font-display);font-weight:500;letter-spacing:var(--tracking-display);line-height:1.08;text-wrap:balance}p{max-width:68ch;text-wrap:pretty}a:focus-visible,summary:focus-visible{outline:3px solid var(--meta);outline-offset:4px;border-radius:var(--radius-sm)}.container{width:min(100% - 2 * var(--container-gutter-desktop),var(--container-max));margin-inline:auto}.skip{position:absolute;left:12px;top:-60px;padding:10px;background:var(--surface);z-index:50}.skip:focus{top:12px}
  .topnav{position:sticky;top:0;z-index:20;background:color-mix(in oklch,var(--surface) 96%,transparent);border-bottom:1px solid var(--border-soft);backdrop-filter:blur(14px)}.topnav-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{font-family:var(--font-display);font-size:25px;font-weight:700;line-height:1}.logo small{display:block;font:600 10px var(--font-mono);letter-spacing:.17em;color:var(--accent);margin-top:7px}.topnav nav{display:flex;align-items:center;gap:28px}.topnav nav a,.nav-contact{font-size:14px;font-weight:600}.topnav nav a:hover,.nav-contact:hover{color:var(--accent)}.nav-contact{white-space:nowrap;border-bottom:1px solid var(--accent);padding-bottom:3px}.coverage{background:var(--accent);color:var(--accent-on);font-size:12px;text-align:center;padding:8px 14px;letter-spacing:.02em}
  .section{padding-block:clamp(68px,8vw,112px)}.section+.section{border-top:1px solid var(--border-soft)}.eyebrow{font:700 12px var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:20px}.lead{font-size:19px;color:var(--fg-2);line-height:1.55}.hero{padding-block:clamp(48px,6vw,80px);background:var(--surface)}.hero-split{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(36px,5vw,68px);align-items:center}.hero h1{font-size:clamp(43px,4.4vw,64px);margin-bottom:22px}.hero .lead{max-width:46ch;margin-bottom:28px}.hero-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.btn{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:12px 22px;border-radius:var(--radius-sm);font-size:15px;font-weight:700;transition:background var(--motion-fast),color var(--motion-fast),transform var(--motion-fast);text-align:center}.btn-primary{background:var(--accent);color:var(--accent-on)}.btn-primary:hover{background:var(--accent-hover);color:var(--accent-on)}.btn-primary:active{background:var(--accent-active);transform:translateY(1px)}.btn-secondary{border:1px solid var(--border);background:var(--surface);color:var(--fg)}.btn-secondary:hover{border-color:var(--fg);background:var(--bg)}.text-link{font-size:14px;font-weight:700;border-bottom:1px solid var(--fg);padding-bottom:3px}.text-link:hover{color:var(--accent);border-color:var(--accent)}.hero-visual{border-radius:var(--radius-sm);box-shadow:0 22px 52px color-mix(in oklch,var(--fg) 16%,transparent);border-bottom:5px solid var(--meta);overflow:hidden}.hero-visual img{width:100%;height:auto}.hero-note{margin-top:32px;padding-top:18px;border-top:1px solid var(--border);display:flex;gap:22px;flex-wrap:wrap;font-size:13px;font-weight:600;color:var(--fg-2)}.hero-note span::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--meta);vertical-align:2px;margin-right:8px}
  .section-head{max-width:660px;margin-bottom:48px}.section-head h2{font-size:clamp(36px,4vw,55px);margin-bottom:16px}.section-head p{color:var(--muted);margin-bottom:0}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:30px}.card h3{font-size:22px;line-height:1.25;margin-bottom:10px}.card p{color:var(--muted);font-size:15px;margin-bottom:0}.service-no{font:13px var(--font-mono);color:var(--meta);display:block;margin-bottom:36px}.service-card{min-height:245px;display:flex;flex-direction:column}.service-card p{margin-bottom:22px}.service-card .text-link{align-self:start;margin-top:auto}.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,82px);align-items:center}.panel{border-top:2px solid var(--meta);padding-top:26px}.panel h3{font-size:21px}.panel p{color:var(--muted)}.panel+.panel{margin-top:28px}.service-mode{background:var(--surface-warm)}.service-mode .section-head{margin-bottom:0}.mode-copy{display:grid;gap:20px}.mode-copy .card{background:var(--surface)}.mode-copy strong{font-size:17px}.mode-copy p{margin:8px 0 0}.mode-copy .text-link{display:inline-block;margin-top:14px}
  .location-card{display:flex;flex-direction:column;min-height:300px}.location-card .eyebrow{margin-bottom:12px}.location-card address{font-style:normal;line-height:1.65;color:var(--fg-2);margin-bottom:26px}.location-card .text-link{align-self:start;margin-top:auto}.location-card h3{font-family:var(--font-display);font-size:29px}.location-note{margin-top:18px;color:var(--muted);font-size:14px}.review-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:clamp(26px,4vw,50px)}.review-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:30px}.review-box h2{font-size:clamp(34px,3.5vw,49px);max-width:18ch;margin-bottom:0}.review-summary{border-left:1px solid var(--border);padding-left:30px;min-width:230px}.review-score{font:600 38px var(--font-display);line-height:1;color:var(--accent)}.review-score span{font:500 17px var(--font-body);color:var(--fg-2)}.review-summary p{font-size:13px;color:var(--muted);margin:8px 0 0}.review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.review-card{border-top:2px solid var(--meta);padding-top:18px}.review-card blockquote{font-family:var(--font-display);font-size:21px;line-height:1.35;margin:0 0 18px}.review-card p{font-size:13px;color:var(--muted);margin:0}.review-disclaimer{font-size:12px;color:var(--muted);margin:26px 0 0;max-width:none}
  .faq-list{max-width:860px}.faq-list details{border-top:1px solid var(--border);padding:22px 0}.faq-list details:last-child{border-bottom:1px solid var(--border)}.faq-list summary{cursor:pointer;font-size:18px;font-weight:700;list-style:none;padding-right:30px;position:relative}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:"+";position:absolute;right:0;top:-2px;color:var(--accent);font-size:25px;font-weight:400}.faq-list details[open] summary::after{content:"−"}.faq-list p{margin:14px 0 0;color:var(--muted)}.cta-strip{text-align:center;background:var(--accent);color:var(--accent-on)}.cta-strip .container{max-width:720px}.cta-strip h2{font-size:clamp(34px,4vw,54px);margin-bottom:16px}.cta-strip p{margin:18px auto 28px;color:var(--accent-on)}.cta-strip .btn{background:var(--surface);color:var(--accent)}.cta-strip .btn:hover{background:var(--bg);color:var(--accent-active)}.pagefoot{background:oklch(.12 0 0);color:var(--surface);padding:58px 0 30px}.pagefoot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px}.pagefoot p,.pagefoot a{color:color-mix(in oklch,var(--surface) 86%,oklch(.12 0 0))}.pagefoot .logo,.pagefoot h3{color:var(--surface)}.pagefoot .logo small{color:var(--meta)}.pagefoot a:hover{color:var(--surface);text-decoration:underline}.pagefoot h3{font-size:14px;text-transform:uppercase;letter-spacing:.1em}.pagefoot address{font-style:normal;font-size:13px;color:color-mix(in oklch,var(--surface) 86%,oklch(.12 0 0))}.pagefoot-bottom{border-top:1px solid color-mix(in oklch,var(--surface) 24%,oklch(.12 0 0));margin-top:44px;padding-top:22px;font-size:12px;color:color-mix(in oklch,var(--surface) 78%,oklch(.12 0 0))}
  @media(max-width:920px){.hero-split,.split{grid-template-columns:1fr}.grid-3,.review-grid{grid-template-columns:1fr}.topnav nav{display:none}.hero-visual{max-width:650px}.pagefoot-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.container{width:calc(100% - 2 * var(--container-gutter-phone))}.topnav-inner{min-height:66px}.logo{font-size:21px}.nav-contact{font-size:12px}.hero h1{font-size:clamp(40px,10vw,54px)}.hero .lead,.lead{font-size:17px}.hero-cta{align-items:stretch}.hero-cta .btn{width:100%}.hero-visual{box-shadow:0 12px 30px color-mix(in oklch,var(--fg) 12%,transparent)}.grid-2,.pagefoot-grid{grid-template-columns:1fr}.review-head{display:block}.review-summary{border-left:0;border-top:1px solid var(--border);padding:20px 0 0;margin-top:24px}.card{padding:24px}.service-card{min-height:0}.service-no{margin-bottom:25px}.section-head{margin-bottom:30px}.coverage{font-size:11px}.pagefoot{padding-top:45px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
  .article-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.article-preview{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.article-preview img{width:100%;aspect-ratio:3/2;object-fit:cover}.article-preview-body{padding:24px}.article-preview h3{font:500 25px/1.2 var(--font-display);margin:0 0 12px}.article-preview p{font-size:14px;color:var(--muted)}.article-preview .text-link{display:inline-block;margin-top:8px}.article-more{display:inline-block;margin-top:28px}.quote-section{background:var(--surface-warm)}.quote-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:start}.quote-layout h2{font-size:clamp(36px,4vw,54px)}.quote-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:32px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.form-field{display:grid;gap:7px}.form-field.wide{grid-column:1/-1}.form-field label{font-size:14px;font-weight:700}.form-field input,.form-field select,.form-field textarea{width:100%;min-height:48px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--fg);padding:11px 13px;font:inherit}.form-field textarea{min-height:92px;resize:vertical}.form-field input:focus-visible,.form-field select:focus-visible,.form-field textarea:focus-visible,.quote-form button:focus-visible{outline:3px solid var(--meta);outline-offset:2px}.form-help{font-size:12px;color:var(--muted);margin:14px 0}.message-preview{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;margin:18px 0;white-space:pre-wrap;font-size:13px;color:var(--fg-2)}@media(max-width:920px){.article-preview-grid,.quote-layout{grid-template-columns:1fr}}@media(max-width:600px){.form-grid{grid-template-columns:1fr}.quote-form{padding:22px}}
  .logo img{display:block;width:156px;height:auto}.pagefoot .logo{display:inline-block;background:var(--surface);border-radius:var(--radius-sm);padding:3px 9px}.pagefoot .logo img{width:166px}@media(max-width:600px){.topnav .logo img{width:122px}}
  .floating-whatsapp{position:fixed;right:20px;bottom:20px;z-index:60;display:grid;place-items:center;width:60px;height:60px;border:1px solid var(--border);border-radius:50%;background:var(--surface);box-shadow:0 8px 24px color-mix(in oklch,var(--fg) 22%,transparent);transition:transform var(--motion-fast),box-shadow var(--motion-fast)}
  .floating-whatsapp img{width:40px;height:40px;transform-origin:center bottom;animation:whatsapp-dribble 4.8s ease-in-out infinite}
  @keyframes whatsapp-dribble{0%,76%,100%{transform:translateY(0) scale(1)}80%{transform:translateY(-8px) scale(.96,1.04)}84%{transform:translateY(0) scale(1.04,.94)}88%{transform:translateY(-4px) scale(.98,1.02)}92%{transform:translateY(0) scale(1)}}
  .floating-whatsapp:hover img,.floating-whatsapp:focus-visible img{animation:none}
  @media(prefers-reduced-motion:reduce){.floating-whatsapp img{animation:none}}
  .floating-whatsapp:hover{transform:translateY(-3px);box-shadow:0 12px 28px color-mix(in oklch,var(--fg) 26%,transparent)}
  .floating-whatsapp:active{transform:translateY(0)}
  .floating-whatsapp:focus-visible{outline:3px solid var(--meta);outline-offset:4px}
  #lokasi .section-head p + p{margin-top:14px}
  #artikel .article-preview img{display:block;width:100%;height:180px;aspect-ratio:auto;object-fit:cover;object-position:center}
  @media(max-width:600px){.floating-whatsapp{right:16px;bottom:16px}}
  .topnav{position:sticky;top:0;z-index:30;background:color-mix(in oklch,var(--surface) 96%,transparent);border-bottom:1px solid var(--border-soft);backdrop-filter:blur(14px)}
  .topnav .topnav-inner{min-height:76px;gap:24px}
  .topnav .desktop-nav{display:flex;align-items:center;gap:clamp(14px,2vw,25px)}
  .topnav .desktop-nav a,.topnav .mobile-nav a{font-size:14px;font-weight:600}
  .topnav .desktop-nav a[aria-current="page"],.topnav .mobile-nav a[aria-current="page"]{color:var(--accent);text-decoration:underline;text-underline-offset:6px}
  .topnav .mobile-nav{display:none}
  .topnav .nav-contact{font-size:14px;font-weight:700;white-space:nowrap;border-bottom:1px solid var(--accent);padding-bottom:3px}
  .topnav .nav-contact:hover{color:var(--accent)}
  .topnav a:focus-visible{outline:3px solid var(--meta);outline-offset:4px;border-radius:4px}
  .topnav .coverage,.topnav .topband{background:var(--accent);color:var(--accent-on);text-align:center;font-size:12px;padding:8px 16px;letter-spacing:.02em}
  .hero-split{row-gap:12px}
  .hero-coverage{grid-column:1/-1;margin:0;color:var(--fg-2);font-size:12px;line-height:1.65;text-wrap:pretty}
  @media(max-width:960px){.topnav .desktop-nav{display:none}.topnav .mobile-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--border-soft)}.topnav .mobile-nav a,.topnav .mobile-nav a:last-child{display:grid;place-items:center;min-height:44px;text-align:center;font-size:12px}.topnav .nav-contact{font-size:12px}}
  @media(max-width:520px){.topnav .nav-contact{display:none}.topnav .topnav-inner{min-height:66px}}
  .brand-gallery{background:var(--surface)}
  .brand-gallery-group+.brand-gallery-group{margin-top:clamp(48px,6vw,76px);padding-top:clamp(40px,5vw,60px);border-top:1px solid var(--border)}
  .brand-gallery-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
  .brand-gallery-head h2{font-size:clamp(32px,3.5vw,46px);margin:0}
  .brand-logo-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
  .brand-logo-grid.glass{grid-template-columns:repeat(4,minmax(0,1fr))}
  .brand-logo-link{min-height:142px;display:grid;place-items:center;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);transition:border-color var(--motion-fast),transform var(--motion-fast),box-shadow var(--motion-fast)}
  .brand-logo-link:hover{border-color:var(--fg);transform:translateY(-2px);box-shadow:0 8px 24px color-mix(in oklch,var(--fg) 9%,transparent)}
  .brand-logo-link:active{transform:translateY(0)}
  .brand-logo-link:focus-visible{outline:3px solid var(--meta);outline-offset:3px}
  .brand-logo-link img{display:block;width:min(100%,126px);height:auto;object-fit:contain}
  .brand-logo-grid.glass img{width:min(100%,116px)}
  @media(max-width:920px){.brand-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.brand-logo-grid.glass{grid-template-columns:repeat(4,minmax(0,1fr))}}
  @media(max-width:600px){.brand-gallery-head{align-items:start;flex-direction:column;gap:12px}.brand-logo-grid,.brand-logo-grid.glass{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.brand-logo-link{min-height:128px}}
  @media(prefers-reduced-motion:reduce){.brand-logo-link{transition:none}.brand-logo-link:hover{transform:none}}
  footer .footer-coverage{max-width:none;margin:28px 0 0;font-size:13px;line-height:1.65;text-align:left;text-wrap:pretty}.footer-coverage+.pagefoot-bottom{margin-top:14px}
  #ulasan .review-head{align-items:center}
  #ulasan .review-score{color:var(--fg)}
  #ulasan .review-summary{border-left-color:var(--border)}
  #ulasan .review-card{border-top-color:var(--border)}
  #ulasan .review-card blockquote{font-size:clamp(18px,1.8vw,21px)}
  #ulasan .review-card .review-author{font-weight:700;color:var(--fg);font-size:14px;margin-bottom:3px}
  #ulasan .review-card .review-location{color:var(--muted);font-size:13px;margin-bottom:14px}
  #ulasan .review-star-defs{position:absolute;width:0;height:0;overflow:hidden}
  #ulasan .review-card .review-rating{display:block;width:120px;height:24px;fill:currentColor;color:var(--warn);margin:0 0 14px}
  #ulasan .review-card .text-link{display:inline-block;margin-top:6px}
  #ulasan .review-source{max-width:none;margin:28px 0 0;color:var(--muted);font-size:13px}
  a.contextual-link{display:inline;color:inherit;text-decoration:underline;text-underline-offset:3px}a.contextual-link:hover{color:inherit;text-decoration-thickness:2px}
  .service-hero{padding-block:clamp(52px,7vw,92px)}.service-hero .hero-split{align-items:center}.service-hero h1{max-width:14ch}.service-photo{margin:0}.service-photo img{width:100%;height:auto;border-radius:var(--radius-sm);box-shadow:0 22px 52px color-mix(in oklch,var(--fg) 13%,transparent)}.service-photo figcaption{font-size:12px;color:var(--muted);margin-top:10px}.service-breadcrumb{font-size:13px;color:var(--fg-2);margin-bottom:24px}.service-breadcrumb a{text-decoration:underline;text-underline-offset:3px}.service-copy{max-width:76ch}.service-copy p,.service-copy li{color:var(--fg-2)}.service-copy li+li{margin-top:9px}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.service-grid .card{height:100%}.service-grid h3{font-family:var(--font-display);font-size:25px}.service-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}.service-split .card{background:var(--surface)}.service-faq details{border-top:1px solid var(--border);padding:18px 0}.service-faq details:last-child{border-bottom:1px solid var(--border)}.service-faq summary{cursor:pointer;font-weight:700}.service-faq details p{max-width:72ch;color:var(--fg-2);margin:12px 0 0}.service-related{display:flex;gap:14px 24px;flex-wrap:wrap;margin-top:22px}.service-related a{font-weight:700;text-decoration:underline;text-underline-offset:4px}.service-related a:hover{color:var(--accent)}.service-cta{background:var(--accent);color:var(--accent-on);text-align:center}.service-cta .container{max-width:750px}.service-cta h2{font-size:clamp(34px,4vw,54px);margin-bottom:16px}.service-cta p{color:var(--accent-on);max-width:62ch;margin-inline:auto}.service-cta .btn{background:var(--surface);color:var(--accent)}.service-cta .btn:hover{background:var(--bg);color:var(--accent-active)}.service-cta .btn:active{background:var(--border-soft)}@media(max-width:920px){.service-grid,.service-split{grid-template-columns:1fr}}@media(max-width:600px){.service-hero h1{max-width:none}.service-photo{margin-top:18px}.service-grid{gap:14px}.service-grid .card{padding:22px}}