:root{
  --background:#faf6ee;
  --foreground:#142f36;
  --card:#ffffff;
  --muted:#6b7d81;
  --muted-soft:#edf1ef;
  --border:#dce6e7;
  --primary:#138491;
  --primary-glow:#39c2ce;
  --secondary:#ff8355;
  --accent:#ffd15b;
  --whatsapp:#25d366;
  --dark:#0f2e35;
  --dark-2:#173c45;
  --radius:24px;
  --shadow-soft:0 10px 28px rgba(15,46,53,.08);
  --shadow-card:0 18px 38px rgba(15,46,53,.14);
  --shadow-glow:0 18px 44px rgba(19,132,145,.28);
  --gradient-ocean:linear-gradient(135deg,#138491,#39c2ce);
  --gradient-sunset:linear-gradient(135deg,#ff8355,#ffd15b);
  --gradient-hero:linear-gradient(135deg,rgba(19,132,145,.84),rgba(15,46,53,.78),rgba(255,131,85,.45));
  --gradient-card:linear-gradient(180deg,#ffffff,#f9f6f0);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--background);color:var(--foreground);font-family:'Plus Jakarta Sans',system-ui,sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit}
textarea{resize:vertical}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;line-height:1.1;letter-spacing:-.02em;margin:0 0 12px}
p{margin:0 0 14px}
.container{width:min(1240px,calc(100% - 32px));margin:0 auto}
.narrow{max-width:860px}
.narrow-left{max-width:820px}
.section-block{padding:84px 0}
.section-block.topless{padding-top:0}
.section-muted{background:rgba(19,132,145,.06)}
.section-dark{background:var(--dark);color:#f7f2ea}
.section-center{text-align:center}
.section-center h2,.section-row h2,.package-main h2,.about-split h2,.subhero h1,.cta-banner h2,.package-hero h1{font-size:clamp(2rem,4vw,3.4rem)}
.section-copy{max-width:760px;color:var(--muted);font-size:1.05rem}
.section-copy.large{font-size:1.15rem}
.section-copy.compact{max-width:560px;font-size:.98rem}
.section-row{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:34px}
.section-label{display:inline-block;margin-bottom:10px;font-size:.85rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--primary)}
.section-label.light{color:rgba(255,255,255,.92)}
.section-label.glow{color:#86eef5}
.text-gradient-sunset{background:var(--gradient-sunset);-webkit-background-clip:text;background-clip:text;color:transparent}
.muted{color:var(--muted)}
.top-gap-small{margin-top:18px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:999px;padding:14px 22px;font-weight:800;transition:transform .28s ease, box-shadow .28s ease, background .28s ease;color:inherit;cursor:pointer}
.btn:hover{transform:translateY(-1px)}
.btn-sm{padding:11px 17px;font-size:.92rem}
.btn-block{width:100%}
.btn-hero{background:var(--gradient-sunset);color:#fff;box-shadow:0 14px 26px rgba(255,131,85,.28)}
.btn-whatsapp{background:var(--whatsapp);color:#fff;box-shadow:0 12px 22px rgba(37,211,102,.24)}
.btn-outline-light{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.28)}
.btn-outline-dark{background:#fff;color:var(--foreground);border:1px solid var(--border);box-shadow:var(--shadow-soft)}

.site-header{position:sticky;top:0;z-index:50;background:rgba(250,246,238,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(20,47,54,.08)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;position:relative}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand-mark{width:42px;height:42px;border-radius:999px;display:grid;place-items:center;background:var(--gradient-ocean);color:#fff;font-weight:900;font-size:1.15rem;box-shadow:var(--shadow-soft)}
.brand-copy{display:grid;line-height:1.1}
.brand-copy strong{font-size:1.1rem}
.brand-copy small{font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.nav-desktop,.nav-cta{display:flex;align-items:center;gap:22px}
.nav-link{position:relative;padding:10px 0;font-size:.95rem;font-weight:700;color:rgba(20,47,54,.82)}
.nav-link:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:999px;background:var(--gradient-sunset);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.nav-link:hover:after,.nav-link.is-active:after{transform:scaleX(1)}
.nav-link.is-active{color:var(--foreground)}
.nav-dropdown{position:relative}
.nav-dropdown-toggle{background:none;border:0;cursor:pointer}
.nav-dropdown-menu{position:absolute;left:50%;top:calc(100% + 12px);transform:translateX(-50%);width:320px;padding:10px;background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-card);opacity:0;visibility:hidden;transition:.25s ease}
.nav-dropdown:hover .nav-dropdown-menu{opacity:1;visibility:visible}
.nav-dropdown-item{display:flex;gap:12px;padding:11px 12px;border-radius:14px;transition:background .2s ease}
.nav-dropdown-item:hover,.nav-dropdown-item.is-current{background:rgba(19,132,145,.08)}
.nav-dropdown-item strong{display:block;font-size:.96rem}
.nav-dropdown-item small{display:block;font-size:.78rem;color:var(--muted)}
.nav-dropdown-emoji{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;overflow:hidden;flex:0 0 52px;background:#eef7f7;box-shadow:0 10px 20px rgba(14,44,54,.08)}
.nav-dropdown-emoji img{width:100%;height:100%;object-fit:cover;display:block}
.nav-toggle{display:none;border:0;background:#fff;border-radius:14px;padding:10px 12px;box-shadow:var(--shadow-soft);font-size:1rem;cursor:pointer}
.nav-mobile{display:none;border-top:1px solid rgba(20,47,54,.08);background:#fff}
.nav-mobile-inner{display:grid;gap:6px;padding:14px 0 16px}
.nav-mobile-label{padding:8px 14px 4px;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.nav-mobile-link{padding:11px 14px;border-radius:14px;font-weight:700}
.nav-mobile-link-media{display:flex;align-items:center;gap:12px;}
.nav-mobile-thumb{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;overflow:hidden;flex:0 0 38px;background:#eef7f7;}
.nav-mobile-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.nav-mobile-link.indent{margin-left:10px}
.nav-mobile-link.is-active,.nav-mobile-link:hover{background:rgba(19,132,145,.08);color:var(--primary)}
.nav-mobile-actions{display:grid;gap:10px;padding-top:10px}
.nav-mobile.open{display:block}

.hero-section{position:relative;overflow:hidden;color:#fff}
.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:var(--gradient-hero)}
.hero-content{position:relative;padding:110px 0 150px}
.hero-copy{max-width:840px}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);backdrop-filter:blur(8px);font-size:.86rem;font-weight:700}
.hero-copy h1{margin-top:20px;font-size:clamp(2.6rem,7vw,5.4rem)}
.hero-copy p{max-width:760px;font-size:clamp(1.05rem,2.2vw,1.28rem);opacity:.95}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.hero-trustbar{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-trustbar span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);font-size:.92rem;font-weight:700}
.home-category-overlap{margin-top:-68px;position:relative;z-index:3}
.card-soft{background:var(--gradient-card);border:1px solid rgba(20,47,54,.08);border-radius:var(--radius);box-shadow:var(--shadow-soft)}
.category-icon-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;padding:18px}
.category-icon-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:14px;border-radius:20px;text-align:center;transition:transform .3s ease, background .2s ease}
.category-icon-card:hover{transform:translateY(-4px);background:rgba(19,132,145,.06)}
.category-icon-circle{display:grid;place-items:center;width:58px;height:58px;border-radius:999px;background:var(--gradient-ocean);font-size:1.65rem;color:#fff;box-shadow:var(--shadow-soft)}
.category-icon-name{font-size:.86rem;font-weight:800}

.package-grid,.benefit-grid,.steps-grid,.testimonial-grid{display:grid;gap:24px}
.three-up{grid-template-columns:repeat(3,minmax(0,1fr))}
.two-up{grid-template-columns:repeat(2,minmax(0,1fr))}
.package-card{border-radius:28px;overflow:hidden;background:#fff;border:1px solid rgba(20,47,54,.08);box-shadow:var(--shadow-soft);transition:transform .32s ease, box-shadow .32s ease}
.package-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-card)}
.package-card-link{display:flex;flex-direction:column;height:100%}
.package-card-media{position:relative;overflow:hidden;aspect-ratio:4/3}
.package-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .38s ease}
.package-card:hover .package-card-media img{transform:scale(1.06)}
.package-float-badge{position:absolute;left:16px;top:16px}
.package-price-bubble{position:absolute;right:16px;bottom:16px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.95);box-shadow:var(--shadow-soft);font-size:.8rem;font-weight:700}
.package-price-bubble strong{color:var(--primary);font-size:1rem}
.package-card-body{display:flex;flex:1;flex-direction:column;padding:22px}
.package-rating{font-size:.85rem;color:var(--muted);margin-bottom:8px}
.package-rating strong{color:var(--foreground)}
.package-card h3{font-size:1.4rem;margin-bottom:8px}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.package-card-meta{display:flex;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--border);font-size:.84rem;color:var(--muted)}
.package-card-linktext{margin-top:16px;font-size:.95rem;font-weight:800;color:var(--primary)}
.package-card-linktext span{transition:transform .25s ease;display:inline-block}
.package-card:hover .package-card-linktext span{transform:translateX(5px)}

.badge{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;font-size:.8rem;font-weight:800}
.badge-secondary{background:rgba(255,131,85,.18);color:#a04d2f}
.badge-accent{background:rgba(255,209,91,.28);color:#815d00}
.badge-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}

.benefit-card,.step-card,.testimonial-card-light{padding:26px;border-radius:24px;border:1px solid rgba(20,47,54,.08);background:#fff;box-shadow:var(--shadow-soft)}
.benefit-card.compact{padding:22px}
.benefit-icon{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:var(--gradient-ocean);color:#fff;font-size:1.35rem;margin-bottom:16px;box-shadow:var(--shadow-soft)}
.benefit-card h3,.step-card h3,.testimonial-card-light h3{font-size:1.25rem}
.benefit-card p,.step-card p,.testimonial-card-light p{color:var(--muted);margin:0}
.step-card{text-align:center;background:var(--gradient-card)}
.step-number{font-family:'Fraunces',Georgia,serif;font-size:3.25rem;font-weight:800;line-height:1;background:var(--gradient-sunset);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:16px}
.testimonial-card-dark{padding:26px;border-radius:24px;background:rgba(255,255,255,.06);backdrop-filter:blur(12px)}
.testimonial-card-dark p{opacity:.92}
.testimonial-stars{color:#ffd15b;letter-spacing:.12em;margin-bottom:12px}
.testimonial-foot{display:flex;justify-content:space-between;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:.9rem}
.testimonial-foot strong span{opacity:.72;font-weight:600}
.testimonial-foot small{opacity:.65}
.testimonial-grid.two-up{grid-template-columns:repeat(2,minmax(0,1fr))}

.cta-banner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:42px 46px;border-radius:34px;background:var(--gradient-ocean);color:#fff;box-shadow:var(--shadow-glow)}
.cta-banner p{max-width:640px;opacity:.94;margin-bottom:0}
.cta-actions{display:flex;flex-wrap:wrap;gap:14px}

.faq-accordion{display:grid;gap:16px}
.faq-accordion details{background:#fff;border:1px solid var(--border);border-radius:20px;padding:18px 22px;box-shadow:var(--shadow-soft)}
.faq-accordion.big details{padding:20px 24px}
.faq-accordion summary{list-style:none;cursor:pointer;font-weight:800;padding-right:34px;position:relative}
.faq-accordion summary::-webkit-details-marker{display:none}
.faq-accordion summary:after{content:'+';position:absolute;right:0;top:-3px;font-size:1.5rem;color:var(--primary)}
.faq-accordion details[open] summary:after{content:'−'}
.faq-accordion details div{padding-top:12px;color:var(--muted)}

.subhero{position:relative;overflow:hidden;color:#fff;padding:86px 0}
.subhero.compact{padding:74px 0}
.subhero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.subhero-overlay{position:absolute;inset:0}
.subhero-overlay.dark{background:rgba(15,46,53,.68)}
.subhero.subhero-gradient{background:var(--gradient-ocean)}
.subhero-gradient .container,.subhero-dark .container{position:relative}
.subhero h1{font-size:clamp(2.4rem,5vw,4.2rem);margin-bottom:14px}
.subhero p{font-size:1.06rem;max-width:760px;opacity:.95;margin:0 auto}

.split-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.about-split{align-items:start}
.contact-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);gap:28px;align-items:start}
.contact-layout.two-col-wide{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.contact-sidebar,.package-sidebar{display:grid;gap:18px}
.side-card,.booking-note-card{padding:26px}
.contact-list,.footer-list,.footer-contact,.check-list,.simple-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.contact-list strong,.footer-contact strong{display:block;margin-bottom:4px}
.contact-list a,.footer-contact a,.footer-list a{color:var(--primary);font-weight:700}
.contact-list span,.footer-contact span{color:var(--muted)}
.map-card{overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow-soft);border:1px solid rgba(20,47,54,.08);min-height:340px;background:#fff}
.map-card iframe{width:100%;height:100%;min-height:340px;border:0;display:block}

.booking-form-shell{width:100%}
.booking-form{padding:28px}
.booking-form-head h3,.success-card h3{font-size:2rem;margin-bottom:6px}
.booking-form-head p,.success-card p{color:var(--muted)}
.form-grid{display:grid;gap:16px}
.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.booking-form label{display:block;font-weight:800;margin-bottom:8px}
.booking-form input,.booking-form textarea,.booking-form select{width:100%;padding:14px 16px;border-radius:16px;border:1px solid var(--border);background:#fff;color:var(--foreground)}
.booking-form input:focus,.booking-form textarea:focus,.booking-form select:focus{outline:2px solid rgba(19,132,145,.16);border-color:var(--primary)}
.hidden-field{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.form-note{margin-top:14px;text-align:center;font-size:.85rem;color:var(--muted)}
.success-card{text-align:center;padding:32px}
.success-icon{width:58px;height:58px;border-radius:999px;display:grid;place-items:center;margin:0 auto 14px;background:rgba(37,211,102,.16);color:#0b8d46;font-size:1.5rem}

.package-hero{position:relative;overflow:hidden;color:#fff}
.package-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.package-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,46,53,.42),rgba(15,46,53,.62),rgba(15,46,53,.84))}
.package-hero .container{position:relative;padding:70px 0 84px}
.breadcrumb-light{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.82rem;opacity:.9;margin-bottom:22px}
.breadcrumb-light a:hover{text-decoration:underline}
.package-hero-copy{max-width:820px}
.package-hero-copy p{font-size:1.1rem;opacity:.95}
.hero-info-line{display:flex;flex-wrap:wrap;gap:22px;font-size:.93rem;margin-top:20px}
.info-strip{border-bottom:1px solid var(--border);background:rgba(19,132,145,.06)}
.info-strip-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:16px 0;font-size:.95rem}
.package-layout-wrap{padding-top:48px}
.package-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);gap:32px;align-items:start}
.package-main{display:grid;gap:36px}
.sticky-box{position:sticky;top:98px}
.price-box{padding:28px;display:grid;gap:12px}
.price-label{font-size:.92rem;color:var(--muted)}
.price-display{font-family:'Fraunces',Georgia,serif;font-size:2.6rem;font-weight:800;color:var(--primary);line-height:1.1}
.price-display small{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:1rem;color:var(--muted);font-weight:700}
.price-perks{display:grid;gap:8px;font-size:.92rem;color:var(--muted)}
.cta-stack{display:grid;gap:12px;padding-top:6px}
.gallery-grid-public{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gallery-card-public{background:#fff;border:1px solid rgba(15,59,67,.08);border-radius:24px;overflow:hidden;box-shadow:var(--shadow-soft)}
.gallery-card-public .card-image{border-radius:0;box-shadow:none}
.gallery-card-body{padding:18px 18px 20px;display:grid;gap:10px}
.gallery-card-body h3{margin:0;font-size:1.08rem}
.gallery-card-body p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.65}
.gallery-card-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--primary)}
.gallery-card-meta time{color:var(--muted)}
.card-image{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;box-shadow:var(--shadow-soft)}
.highlight-list{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.highlight-list li{padding:14px 16px;border-radius:18px;background:rgba(19,132,145,.06);font-weight:600}
.itinerary-list{list-style:none;padding:0;margin:0;border-left:2px solid rgba(19,132,145,.18);display:grid;gap:16px}
.itinerary-list li{position:relative;padding-left:28px}
.itinerary-step{position:absolute;left:-13px;top:0;width:24px;height:24px;border-radius:999px;background:var(--gradient-ocean);color:#fff;display:grid;place-items:center;font-size:.75rem;font-weight:800}
.itinerary-time{font-size:.88rem;font-weight:800;color:var(--primary)}
.itinerary-activity{font-size:.97rem}
.info-card{padding:24px}
.gradient-lite{background:linear-gradient(180deg,#fff,#f5fbfb)}
.check-list li,.simple-list li{color:var(--foreground)}
.muted-list li{color:var(--muted)}
.browse-more{padding:24px}
.tag-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.tag-links a{padding:11px 16px;border-radius:999px;background:#fff;border:1px solid var(--border);font-weight:700;transition:.2s ease}
.tag-links a:hover{border-color:var(--primary);color:var(--primary)}
.empty-state{padding:34px;text-align:center}

.site-footer{margin-top:28px;background:var(--foreground);color:#fff;padding-top:72px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:28px}
.site-footer h3{font-size:1.1rem;margin-bottom:16px}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.footer-copy{opacity:.8;max-width:420px}
.footer-socials{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.footer-socials a{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.08);font-size:.85rem;font-weight:700}
.footer-socials a.wa{background:var(--whatsapp);color:#fff}
.footer-socials.center{justify-content:center}
.footer-list li,.footer-contact li{font-size:.92rem;opacity:.82}
.footer-list a{color:#fff;font-weight:600}
.footer-bottom{margin-top:36px;padding:18px 0 24px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:.82rem;opacity:.7}

.floating-whatsapp{position:fixed;right:20px;bottom:20px;z-index:60;width:58px;height:58px;border-radius:999px;background:var(--whatsapp);display:grid;place-items:center;color:#fff;font-size:1.65rem;box-shadow:0 18px 34px rgba(37,211,102,.32);transition:transform .25s ease}
.floating-whatsapp:hover{transform:scale(1.08)}
.sticky-mobile-cta{display:none}

[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .55s ease, transform .55s ease;transition-delay:var(--reveal-delay,0ms)}
[data-reveal].in-view{opacity:1;transform:translateY(0)}

/* admin styles preserved */
.admin-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh;background:#f4f8f9}.admin-side{background:#10343a;color:#fff;padding:24px;position:sticky;top:0;height:100vh}.admin-side a{display:block;padding:12px 14px;border-radius:14px;color:#d9f3f5;margin-bottom:8px}.admin-side a:hover,.admin-side a.active{background:rgba(255,255,255,.08);color:#fff}.admin-main{padding:28px}.table-wrap{overflow:auto;background:#fff;border-radius:22px;box-shadow:var(--shadow-soft)}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:14px 16px;border-bottom:1px solid #eef4f5;text-align:left;vertical-align:top}.badge-new{background:#e9f6ff;color:#20658b}.badge-processing{background:#fff4dd;color:#8a5a00}.badge-confirmed{background:#e8f7ec;color:#1c7b46}.badge-completed{background:#e6fbf6;color:#0d7568}.badge-cancelled{background:#fff0f0;color:#b13a3a}.badge-default{background:#edf7f8;color:var(--primary)}.alert{padding:14px 18px;border-radius:16px;margin-bottom:16px}.alert-success{background:#ecfbf1;color:#1d7c45}.alert-error{background:#fff2f2;color:#b13a3a}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}.admin-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.admin-preview-compact .preview-box{padding:12px}
.admin-preview-compact img,.preview-box img{width:100%;border-radius:16px;object-fit:cover;aspect-ratio:4/3;background:#f6fbfb}.preview-box{background:#fff;border:1px solid #e4eef0;border-radius:20px;padding:16px}.preview-box strong{display:block;margin-bottom:10px}.help{font-size:13px;color:var(--muted)}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.kpi{padding:22px;border-radius:22px;background:#fff;box-shadow:var(--shadow-soft)}.auth-wrap{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),#0f3b43)}.auth-card{width:min(460px,calc(100% - 32px));background:#fff;border-radius:28px;padding:28px;box-shadow:var(--shadow-soft)}.actions{display:flex;gap:14px;align-items:center}.review-card p{margin:12px 0 16px}.map-embed iframe{width:100%;border:0;border-radius:18px;overflow:hidden}.admin-side h2{margin-top:0}.admin-inline-form{display:grid;gap:8px}.admin-inline-form .btn{margin-top:4px}.timeline{display:grid;gap:18px}.timeline-item{display:grid;grid-template-columns:16px 1fr;gap:14px;align-items:start}.timeline-dot{width:12px;height:12px;border-radius:999px;background:var(--gradient-sunset);margin-top:8px;box-shadow:0 0 0 6px rgba(255,133,87,.12)}.timeline-body{padding:16px 18px;border:1px solid rgba(20,50,58,.08);border-radius:18px;background:#fff}.nav-pill{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:#ff8557;color:#fff;font-size:12px;font-weight:800;margin-left:8px}.alert-warning{background:#fff6df;border:1px solid #f2d58a;color:#7a5a00}.badge-reminder-overdue{background:#ffe2df;color:#a93422}.badge-reminder-today{background:#fff4d6;color:#8b6400}.badge-reminder-upcoming{background:#e6f6ff;color:#0d5f86}.inline-toggle-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

@media (max-width:1080px){
  .category-icon-grid{grid-template-columns:repeat(4,1fr)}
  .three-up{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .package-layout,.contact-layout{grid-template-columns:1fr}
  .sticky-box{position:static}
}
@media (max-width:860px){
  .nav-desktop,.nav-cta{display:none}
  .nav-toggle{display:block}
  .section-block{padding:68px 0}
  .hero-content{padding:88px 0 128px}
  .category-icon-grid{grid-template-columns:repeat(3,1fr)}
  .split-two,.form-grid.two,.form-grid.three,.info-strip-grid,.testimonial-grid.two-up,.admin-shell,.admin-preview,.kpis,.gallery-grid{grid-template-columns:1fr}
  .cta-banner{padding:34px 28px;flex-direction:column;align-items:flex-start}
  .package-grid.three-up,.benefit-grid.three-up,.steps-grid.three-up,.testimonial-grid.three-up{grid-template-columns:1fr}
  .gallery-grid-public{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr}
  .admin-side{position:relative;height:auto}
}
@media (max-width:640px){
  .container{width:min(100% - 24px,1240px)}
  .hero-copy h1,.subhero h1,.package-hero h1{font-size:clamp(2.1rem,10vw,3rem)}
  .hero-actions,.cta-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn,.cta-actions .btn{width:100%}
  .home-category-overlap{margin-top:-48px}
  .category-icon-grid{grid-template-columns:repeat(2,1fr);padding:16px}
  .gallery-grid-public{grid-template-columns:1fr}
  .floating-whatsapp{bottom:84px;right:14px}
  .sticky-mobile-cta{position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px;background:rgba(250,246,238,.96);backdrop-filter:blur(12px);border-top:1px solid var(--border);box-shadow:0 -10px 30px rgba(15,46,53,.08)}
  .sticky-mobile-cta a{display:flex;align-items:center;justify-content:center;padding:14px 16px;border-radius:14px;font-weight:800}
  .sticky-mobile-cta a:first-child{background:var(--whatsapp);color:#fff}
  .sticky-mobile-cta a:last-child{background:var(--gradient-sunset);color:#fff}
}


/* === pembaruan tampilan website dan panel admin === */
body{
  background:
    radial-gradient(1200px 500px at 10% -10%, rgba(57,194,206,.10), transparent 55%),
    radial-gradient(900px 420px at 100% 0%, rgba(255,209,91,.12), transparent 45%),
    var(--background);
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(20,47,54,.03) 1px, transparent 1px);
  background-size:22px 22px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.28), transparent 70%);
  z-index:-1;
}
.btn{position:relative;overflow:hidden}
.btn:before{content:"";position:absolute;inset:-120% auto auto -40%;width:40%;height:300%;transform:rotate(24deg);background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);transition:transform .75s ease;pointer-events:none}
.btn:hover:before{transform:translateX(260%) rotate(24deg)}
.btn-hero:hover,.btn-whatsapp:hover,.btn-primary:hover,.btn-secondary-soft:hover{box-shadow:var(--shadow-card)}
.card-soft,.package-card,.benefit-card,.step-card,.testimonial-card-light,.side-card,.booking-note-card,.info-card,.price-box,.cta-banner,.map-card,.preview-box,.kpi,.card{position:relative;isolation:isolate}
.card-soft:before,.package-card:before,.benefit-card:before,.step-card:before,.testimonial-card-light:before,.side-card:before,.booking-note-card:before,.info-card:before,.price-box:before,.cta-banner:before,.map-card:before,.preview-box:before,.kpi:before,.card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg, rgba(255,255,255,.18), transparent 32%);pointer-events:none}
.package-card-media:after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(180deg, transparent, rgba(15,46,53,.18));pointer-events:none}
.hero-section:after,.package-hero:after{content:"";position:absolute;right:-120px;top:40px;width:380px;height:380px;border-radius:999px;background:radial-gradient(circle, rgba(255,209,91,.28), transparent 62%);filter:blur(8px);pointer-events:none}
.hero-copy,.package-hero-copy{position:relative;z-index:2}
.section-row .btn-outline-dark{background:rgba(255,255,255,.85)}
.package-card-linktext,.nav-link,.tag-links a,.admin-side a,.table-wrap tbody tr,.admin-list-item,.status-card,.admin-stat-card,.kpi,.preview-box,.card,.card-soft{transition:all .28s ease}
.package-card-linktext{display:inline-flex;align-items:center;gap:8px}
.booking-form input,.booking-form textarea,.booking-form select,.admin-main input,.admin-main select,.admin-main textarea{transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease, background .22s ease}
.booking-form input:hover,.booking-form textarea:hover,.booking-form select:hover,.admin-main input:hover,.admin-main select:hover,.admin-main textarea:hover{border-color:#bfd5d9}
.booking-form input:focus,.booking-form textarea:focus,.booking-form select:focus,.admin-main input:focus,.admin-main select:focus,.admin-main textarea:focus{box-shadow:0 0 0 4px rgba(19,132,145,.12);transform:translateY(-1px)}
.site-footer{position:relative;overflow:hidden}
.site-footer:before{content:"";position:absolute;inset:-140px auto auto -60px;width:320px;height:320px;border-radius:999px;background:radial-gradient(circle, rgba(57,194,206,.18), transparent 65%);pointer-events:none}
.floating-whatsapp{animation:wa-bob 3s ease-in-out infinite}
@keyframes wa-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* admin visual system */
.btn-primary{background:var(--gradient-ocean);color:#fff;box-shadow:0 14px 26px rgba(19,132,145,.22)}
.btn-secondary-soft{background:rgba(19,132,145,.10);color:var(--primary);border:1px solid rgba(19,132,145,.18);box-shadow:var(--shadow-soft)}
.btn-secondary-soft:hover{background:rgba(19,132,145,.14)}
.card{background:var(--gradient-card);border:1px solid rgba(20,47,54,.08);border-radius:28px;box-shadow:var(--shadow-soft)}
.pad{padding:24px}
.admin-body{background:radial-gradient(900px 420px at 0% 0%, rgba(57,194,206,.13), transparent 52%),radial-gradient(900px 420px at 100% 0%, rgba(255,131,85,.12), transparent 50%),linear-gradient(180deg, #f7fbfb, #f5efe5 68%, #f7fbfb)}
.admin-shell{display:grid;grid-template-columns:290px 1fr;gap:0;min-height:100vh;background:transparent}
.admin-side{position:sticky;top:0;height:100vh;padding:24px 18px 22px;background:linear-gradient(180deg, #0f3138 0%, #153f48 100%);color:#fff;border-right:1px solid rgba(255,255,255,.08);box-shadow:inset -1px 0 0 rgba(255,255,255,.04), 18px 0 34px rgba(12,32,38,.08);display:flex;flex-direction:column}
.admin-brand{display:flex;align-items:center;gap:14px;padding:12px 14px 18px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.08)}
.admin-brand .brand-mark{flex:0 0 46px;width:46px;height:46px;border-radius:16px;background:var(--gradient-sunset);box-shadow:0 14px 26px rgba(255,131,85,.28)}
.admin-brand strong{display:block;font-size:1rem;line-height:1.15}.admin-brand small{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-top:4px}
.admin-side-section{margin-top:16px}.admin-side-label{padding:0 12px 8px;font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.admin-side a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-radius:16px;color:rgba(255,255,255,.84);margin-bottom:6px;font-weight:700}.admin-side a:hover,.admin-side a.is-active{background:rgba(255,255,255,.10);color:#fff;transform:translateX(4px)}
.admin-side-footer{margin-top:auto;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);display:grid;gap:6px}
.admin-main{padding:28px 32px 40px;min-width:0}
.admin-topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:22px;padding:24px 26px;border-radius:30px;background:rgba(255,255,255,.74);backdrop-filter:blur(12px);border:1px solid rgba(20,47,54,.08);box-shadow:var(--shadow-soft)}
.admin-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin-bottom:8px}.admin-kicker:before{content:"";width:8px;height:8px;border-radius:999px;background:var(--secondary);box-shadow:0 0 0 8px rgba(255,131,85,.12)}
.admin-topbar h1{font-size:clamp(2rem,4vw,3rem);margin:0}.admin-topbar p{margin:8px 0 0;color:var(--muted)}.admin-topbar-actions{display:flex;gap:12px;flex-wrap:wrap}
.toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:20px}.toolbar h1,.toolbar h2,.toolbar h3{margin:0}.toolbar > a:not(.btn), .toolbar .actions a:not(.btn){font-weight:800;color:var(--primary)}
.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-bottom:24px}.kpi{padding:22px 20px;background:rgba(255,255,255,.9);border:1px solid rgba(20,47,54,.08);border-radius:24px;box-shadow:var(--shadow-soft)}.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow-card)}.kpi .muted{font-size:.84rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.kpi h2{margin:10px 0 0;font-size:2rem}
.admin-hero{display:grid;grid-template-columns:1.35fr 1fr;gap:24px;padding:30px;border-radius:32px;overflow:hidden;background:linear-gradient(135deg, rgba(19,132,145,.11), rgba(255,255,255,.92) 42%, rgba(255,209,91,.18));border:1px solid rgba(20,47,54,.08);box-shadow:var(--shadow-soft)}
.admin-hero-copy h2{font-size:clamp(2rem,4vw,3.2rem);max-width:760px}.admin-hero-badge{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(19,132,145,.10);color:var(--primary);font-size:.82rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.admin-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.admin-hero-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-self:stretch}.admin-stat-card{padding:20px;border-radius:24px;background:#fff;border:1px solid rgba(20,47,54,.08);box-shadow:var(--shadow-soft);display:flex;flex-direction:column;justify-content:space-between;min-height:132px}.admin-stat-card span{font-size:.86rem;color:var(--muted);font-weight:700}.admin-stat-card strong{font-family:'Fraunces',Georgia,serif;font-size:2.3rem;line-height:1.05}
.admin-grid-hero{display:grid;grid-template-columns:1.35fr .95fr;gap:22px}.status-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.status-card{padding:18px;border-radius:20px;background:#fff;border:1px solid rgba(20,47,54,.08);box-shadow:var(--shadow-soft)}.status-card:hover{transform:translateY(-3px)}.status-card span{display:block;font-size:.84rem;color:var(--muted);font-weight:700}.status-card strong{display:block;margin-top:10px;font-size:1.85rem;line-height:1.05}
.status-new{background:linear-gradient(180deg,#f4fbff,#fff)}.status-processing{background:linear-gradient(180deg,#fff9ec,#fff)}.status-confirmed{background:linear-gradient(180deg,#f1fcf4,#fff)}.status-completed{background:linear-gradient(180deg,#eefcf8,#fff)}.status-cancelled{background:linear-gradient(180deg,#fff4f4,#fff)}
.admin-mini-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:2px 0 14px}.admin-mini-stats > div{padding:16px;border-radius:18px;background:#fff;border:1px solid rgba(20,47,54,.08)}.admin-mini-stats span{display:block;font-size:.8rem;color:var(--muted);font-weight:700}.admin-mini-stats strong{display:block;margin-top:8px;font-size:1.45rem}
.admin-panels{display:grid;grid-template-columns:1.45fr .95fr;gap:22px}.admin-side-stack{display:grid;gap:22px}.admin-list{display:grid;gap:12px}.admin-list-item{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:18px;background:rgba(19,132,145,.05);border:1px solid rgba(19,132,145,.08)}.admin-list-item:hover{background:rgba(19,132,145,.08);transform:translateY(-2px)}.admin-list-item strong{display:block;margin-bottom:4px}.admin-list-item span{display:block;font-size:.85rem;color:var(--muted)}.admin-list-meta{display:grid;justify-items:end;gap:8px;flex:0 0 auto}
.chips{display:flex;gap:10px;flex-wrap:wrap}.chip{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;background:rgba(19,132,145,.10);color:var(--primary);font-size:.8rem;font-weight:800}
.table-wrap{overflow:auto;background:rgba(255,255,255,.92);border-radius:28px;box-shadow:var(--shadow-soft);border:1px solid rgba(20,47,54,.08)}.table-wrap table{width:100%;border-collapse:separate;border-spacing:0}.table-wrap th{position:sticky;top:0;background:#f6fbfb;z-index:1;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:#6d8488}.table-wrap th,.table-wrap td{padding:16px 18px;border-bottom:1px solid #e8eff0;text-align:left;vertical-align:top}.table-wrap tbody tr:hover{background:rgba(19,132,145,.045)}.table-wrap a{font-weight:800;color:var(--primary)}.table-wrap img{box-shadow:var(--shadow-soft)}.admin-table-modern .btn.btn-primary{padding:10px 14px;font-size:.86rem}
.alert{padding:16px 18px;border-radius:18px;margin-bottom:16px;border:1px solid transparent}.alert-success{background:#ecfbf1;color:#1d7c45;border-color:#cbeed8}.alert-error{background:#fff3f2;color:#b13a3a;border-color:#f4d1d1}.alert-warning{background:#fff7e6;border-color:#f3db9c;color:#785900}
.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.help{font-size:.82rem;color:var(--muted)}
.admin-main > form{display:grid;gap:18px}.admin-main .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.admin-main .form-grid > div,.admin-main > form > div{min-width:0}.admin-main > form > button{justify-self:start}
.admin-main input,.admin-main select,.admin-main textarea{width:100%;padding:14px 16px;border-radius:16px;border:1px solid var(--border);background:#fff;color:var(--foreground)}.admin-main textarea{min-height:130px}.admin-main label{display:block;margin-bottom:8px;font-weight:800;color:var(--foreground)}
.admin-inline-form{display:grid;gap:10px}.admin-inline-form .btn{margin-top:4px}.preview-box img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:16px}.admin-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:14px}
.timeline{display:grid;gap:18px}.timeline-item{display:grid;grid-template-columns:18px 1fr;gap:14px;align-items:start}.timeline-dot{width:12px;height:12px;border-radius:999px;background:var(--gradient-sunset);margin-top:10px;box-shadow:0 0 0 8px rgba(255,131,85,.12)}.timeline-body{padding:18px 18px;border:1px solid rgba(20,47,54,.08);border-radius:20px;background:#fff;box-shadow:var(--shadow-soft)}.inline-toggle-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:28px;background:radial-gradient(600px 320px at 5% 5%, rgba(57,194,206,.28), transparent 55%),radial-gradient(700px 340px at 95% 10%, rgba(255,131,85,.22), transparent 54%),linear-gradient(135deg,#0f3b43,#143840 58%,#102f36)}
.auth-card{width:min(960px,calc(100% - 32px));display:grid;grid-template-columns:1.1fr .95fr;overflow:hidden;background:rgba(255,255,255,.95);border-radius:34px;box-shadow:0 28px 70px rgba(8,25,30,.28);padding:0}.auth-showcase{padding:42px 34px;background:linear-gradient(145deg, rgba(19,132,145,.98), rgba(15,46,53,.98));color:#fff;display:flex;flex-direction:column;justify-content:space-between;gap:24px}.auth-showcase h2{font-size:clamp(2rem,4vw,3.2rem);margin:14px 0 12px}.auth-showcase p{max-width:520px;opacity:.88}.auth-pill{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);font-size:.82rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.auth-points{display:grid;gap:12px;padding:0;margin:0;list-style:none}.auth-points li{padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.08)}.auth-form{padding:38px 34px;display:grid;align-content:center}.auth-form h1{font-size:2.2rem;margin-bottom:4px}.auth-form p{color:var(--muted)}.auth-form form{display:grid;gap:16px;margin-top:18px}.auth-form .btn{width:100%}.form-card{padding:22px 24px;border-radius:26px;background:rgba(255,255,255,.92);border:1px solid rgba(20,47,54,.08);box-shadow:var(--shadow-soft)}
.badge-new{background:#e9f6ff;color:#20658b}.badge-processing{background:#fff4dd;color:#8a5a00}.badge-confirmed{background:#e8f7ec;color:#1c7b46}.badge-completed{background:#e6fbf6;color:#0d7568}.badge-cancelled{background:#fff0f0;color:#b13a3a}.badge-default{background:#edf7f8;color:var(--primary)}.badge-reminder-overdue{background:#ffe2df;color:#a93422}.badge-reminder-today{background:#fff4d6;color:#8b6400}.badge-reminder-upcoming{background:#e6f6ff;color:#0d5f86}
.nav-pill{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;border-radius:999px;background:var(--secondary);color:#fff;font-size:12px;font-weight:800;margin-left:auto;box-shadow:0 8px 18px rgba(255,131,85,.24)}
@media (max-width:1180px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-hero,.admin-grid-hero,.admin-panels{grid-template-columns:1fr}}
@media (max-width:940px){.auth-card{grid-template-columns:1fr}.auth-showcase{padding:30px}.admin-shell{grid-template-columns:1fr}.admin-side{position:relative;height:auto}.admin-main{padding:22px 16px 34px}.status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.admin-topbar{padding:20px}.admin-topbar-actions,.admin-hero-actions,.actions{width:100%}.admin-topbar-actions .btn,.admin-hero-actions .btn,.actions .btn{flex:1 1 auto}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-hero-stats,.admin-preview,.admin-mini-stats,.admin-main .form-grid{grid-template-columns:1fr}}
@media (max-width:560px){.kpis,.status-grid{grid-template-columns:1fr}.auth-form,.auth-showcase{padding:28px 22px}.table-wrap th,.table-wrap td{padding:14px 12px}}


/* brand/logo controls */
.brand-mark.has-logo,.admin-brand .brand-mark.has-logo,.auth-brand-mark.has-logo{background:rgba(255,255,255,.14);padding:0;overflow:hidden}
.brand-logo-image{width:100%;height:100%;object-fit:contain;display:block;background:#fff}
.auth-brand-mark{margin-bottom:18px;width:78px;height:78px;border-radius:24px;display:grid;place-items:center;background:rgba(255,255,255,.14);box-shadow:0 18px 32px rgba(0,0,0,.18)}
.auth-brand-mark .brand-logo-image{border-radius:20px;padding:10px}
.brand-preview-surface{min-height:180px;border-radius:20px;border:1px dashed rgba(20,50,58,.16);display:grid;place-items:center;background:linear-gradient(180deg,#fff,#f6fafb);overflow:hidden}
.brand-preview-surface img{max-width:100%;max-height:150px;object-fit:contain;padding:18px}
.brand-fallback-preview{display:grid;place-items:center;width:88px;height:88px;border-radius:26px;background:var(--gradient-ocean);color:#fff;font:800 2rem/1 "Plus Jakarta Sans",sans-serif;box-shadow:var(--shadow-soft)}
.logo-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-stack{display:grid;gap:22px}
.settings-card{padding:26px}
.settings-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px}
.settings-head h2{margin:0 0 6px}
.settings-grid{display:grid;gap:18px}
.settings-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}
.field-wrap{display:grid;gap:8px}
.field-span-2{grid-column:1/-1}
.settings-actions{display:flex;justify-content:flex-end}
.inline-check{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--fg)}
.inline-check input{width:auto;padding:0}
@media (max-width:860px){.settings-grid.two-col,.logo-preview-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}}


/* === UI/UX refresh: responsive, dynamic, professional typography === */
:root{
  --radius:20px;
  --shadow-soft:0 10px 24px rgba(15,46,53,.07);
  --shadow-card:0 18px 38px rgba(15,46,53,.12);
  --shadow-glow:0 16px 36px rgba(19,132,145,.22);
}
html{font-size:16px}
body{
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:15.5px;
  line-height:1.68;
  letter-spacing:-.01em;
  background:
    radial-gradient(900px 360px at 10% -5%, rgba(57,194,206,.08), transparent 60%),
    radial-gradient(900px 400px at 100% 0%, rgba(255,131,85,.06), transparent 54%),
    var(--background);
}
h1,h2,h3,h4,.brand-copy strong,.package-card h3,.admin-topbar h1,.hero-copy h1,.subhero h1,.package-hero h1{
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  letter-spacing:-.03em;
}
p,li,input,textarea,select,button,table,th,td{font-size:.965rem}
.hero-copy h1{font-size:clamp(2.55rem,6vw,4.55rem)}
.section-center h2,.section-row h2,.package-main h2,.about-split h2,.subhero h1,.cta-banner h2,.package-hero h1{font-size:clamp(1.82rem,3.2vw,2.8rem)}
.subhero h1{font-size:clamp(2rem,4vw,3rem)}
.package-card h3{font-size:1.2rem}
.site-header{
  transition:background .28s ease, box-shadow .28s ease, border-color .28s ease, transform .28s ease;
}
body.is-scrolled .site-header{
  background:rgba(250,246,238,.95);
  box-shadow:0 14px 28px rgba(15,46,53,.08);
  border-bottom-color:rgba(20,47,54,.12);
}
body.is-scrolled .nav-wrap{padding:10px 0}
.nav-wrap{transition:padding .28s ease}
.brand-mark{width:40px;height:40px;box-shadow:0 8px 18px rgba(19,132,145,.18)}
.brand-copy strong{font-size:1rem}
.brand-copy small{font-size:.58rem;letter-spacing:.13em}
.nav-link{font-size:.91rem}
.nav-cta .btn{padding:11px 16px}
.hero-section,.subhero,.package-hero{isolation:isolate}
.hero-image,.subhero img,.package-hero img{
  will-change:transform;
  transition:transform .35s ease;
}
.hero-overlay,.subhero-overlay.dark,.package-hero-overlay{
  background:linear-gradient(180deg, rgba(11,29,35,.30), rgba(11,29,35,.56) 55%, rgba(11,29,35,.72));
}
.subhero.subhero-shared{min-height:320px;display:flex;align-items:center}
.subhero.subhero-shared .container{position:relative;z-index:2}
.card-soft,.package-card,.benefit-card,.step-card,.testimonial-card-light,.preview-box,.admin-stat-card,.status-card,.admin-list-item,.table-wrap,.auth-card,.settings-card,.side-card,.map-card,.price-box{
  backdrop-filter:saturate(125%) blur(2px);
}
.card-soft:hover,.benefit-card:hover,.step-card:hover,.testimonial-card-light:hover,.side-card:hover,.map-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-card);
}
.package-card,.benefit-card,.step-card,.testimonial-card-light,.side-card,.map-card,.card-soft,.preview-box,.admin-stat-card,.status-card,.admin-list-item{transition:transform .28s ease, box-shadow .28s ease, background .28s ease, border-color .28s ease}
.info-strip{
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(20,47,54,.08);
}
.footer-socials-icons{display:flex;gap:12px;margin-top:20px}
.footer-socials-icons a{
  width:42px;height:42px;padding:0;border-radius:999px;display:grid;place-items:center;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1)
}
.footer-socials-icons a svg{width:18px;height:18px;display:block}
.footer-socials-icons a:hover{transform:translateY(-2px);background:rgba(255,255,255,.14)}
.footer-socials-icons a.wa{background:var(--whatsapp);border-color:transparent}
.footer-socials a{transition:transform .25s ease, background .25s ease}
.footer-copy{max-width:420px}
.floating-whatsapp{
  width:56px;height:56px;font-size:1.45rem;
  box-shadow:0 14px 28px rgba(37,211,102,.28);
}
.floating-whatsapp:hover{transform:translateY(-3px) scale(1.05)}
[data-reveal]{opacity:0;transform:translateY(22px) scale(.985);transition:opacity .65s ease, transform .65s ease;transition-delay:var(--reveal-delay,0ms)}
[data-reveal].in-view{opacity:1;transform:translateY(0) scale(1)}
.admin-body{
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:15px;
  background:linear-gradient(180deg,#f6faf9 0%, #f4efe5 100%);
}
.admin-side{background:linear-gradient(180deg,#0f3138 0%, #174851 100%)}
.admin-side a{font-size:.92rem}
.admin-side a:hover,.admin-side a.is-active{transform:translateX(3px)}
.admin-topbar{
  border-radius:24px;
  background:rgba(255,255,255,.82);
  box-shadow:0 18px 38px rgba(15,46,53,.08);
}
.admin-topbar h1{font-size:clamp(1.6rem,3vw,2.3rem)}
.admin-topbar p{font-size:.95rem}
.admin-kicker{font-size:.76rem;letter-spacing:.14em}
.table-wrap{border:1px solid rgba(20,47,54,.06)}
.table-wrap table{min-width:720px}
.table-wrap tbody tr:hover{background:rgba(19,132,145,.045)}
th{font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
td{font-size:.92rem}
input,textarea,select{
  border-radius:14px;
  border:1px solid #d7e1e3;
  padding:13px 14px;
  background:#fff;
  transition:border-color .24s ease, box-shadow .24s ease, transform .24s ease;
}
input:focus,textarea:focus,select:focus{
  outline:none;
  border-color:rgba(19,132,145,.45);
  box-shadow:0 0 0 4px rgba(19,132,145,.10);
}
.btn{font-size:.93rem}
.btn-primary,.btn-hero{box-shadow:0 12px 24px rgba(255,131,85,.2)}
.btn-whatsapp{box-shadow:0 10px 22px rgba(37,211,102,.22)}
.auth-card{max-width:1080px}
.auth-showcase h2{font-size:clamp(1.75rem,3vw,2.4rem)}
.auth-form h1{font-size:1.7rem}
.status-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.status-card,.admin-stat-card{border-radius:18px}
.preview-box img,.card-image{border-radius:16px}
.contact-layout,.package-layout,.footer-grid{gap:28px}
.footer-grid{grid-template-columns:1.55fr 1fr 1fr 1.1fr}
@media (max-width:1180px){
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr}
  .footer-grid > :first-child{grid-column:1 / -1}
}
@media (max-width:1024px){
  .category-icon-grid{grid-template-columns:repeat(4,1fr)}
  .three-up{grid-template-columns:repeat(2,minmax(0,1fr))}
  .status-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .package-layout{grid-template-columns:1fr}
  .package-sidebar{order:-1}
}
@media (max-width:860px){
  body{font-size:15px}
  .nav-desktop,.nav-cta{display:none}
  .nav-toggle{display:block}
  .subhero.subhero-shared{min-height:280px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .admin-shell{grid-template-columns:1fr}
  .admin-side{position:relative;height:auto}
  .admin-main{padding:20px 14px 32px}
}
@media (max-width:640px){
  .container{width:min(100% - 22px, 1240px)}
  .hero-content{padding:90px 0 120px}
  .hero-copy h1{font-size:clamp(2.15rem,9.4vw,3.2rem)}
  .subhero h1,.package-hero h1{font-size:clamp(1.85rem,8vw,2.5rem)}
  .category-icon-grid,.three-up,.two-up,.footer-grid,.status-grid{grid-template-columns:1fr}
  .footer-grid > :first-child{grid-column:auto}
  .section-block{padding:68px 0}
  .subhero.subhero-shared{min-height:240px;padding:68px 0}
  .floating-whatsapp{bottom:82px;right:14px}
  .table-wrap table{min-width:640px}
  .auth-card{border-radius:22px}
}

/* admin premium stage 3 */
body.modal-open, body.drawer-open{overflow:hidden}
body.admin-body{
  --admin-bg:#f4f7f8;
  --admin-surface:rgba(255,255,255,.82);
  --admin-card:#ffffff;
  --admin-text:#183238;
  --admin-muted:#658085;
  --admin-border:rgba(20,47,54,.10);
  --admin-soft:rgba(19,132,145,.06);
  background:radial-gradient(circle at top right, rgba(57,194,206,.12), transparent 28%), radial-gradient(circle at top left, rgba(255,131,85,.08), transparent 22%), var(--admin-bg)!important;
  color:var(--admin-text);
}
body.admin-body.admin-dark{
  --admin-bg:#0e1520;
  --admin-surface:rgba(17,24,39,.84);
  --admin-card:#121c29;
  --admin-text:#edf3f6;
  --admin-muted:#91a5b2;
  --admin-border:rgba(148,163,184,.14);
  --admin-soft:rgba(56,189,248,.08);
  background:radial-gradient(circle at top right, rgba(20,184,166,.12), transparent 22%), radial-gradient(circle at top left, rgba(251,146,60,.08), transparent 20%), var(--admin-bg)!important;
}
body.admin-body .admin-main{color:var(--admin-text)}
body.admin-body .admin-topbar,
body.admin-body .card,
body.admin-body .card-soft,
body.admin-body .kpi,
body.admin-body .status-card,
body.admin-body .admin-list-item,
body.admin-body .table-wrap,
body.admin-body .preview-box,
body.admin-body .settings-card,
body.admin-body .side-card,
body.admin-body .map-card,
body.admin-body .price-box,
body.admin-body .filters-card{background:var(--admin-card)!important;color:var(--admin-text)!important;border:1px solid var(--admin-border)!important;box-shadow:0 22px 48px rgba(15,23,42,.08)}
body.admin-body.admin-dark .admin-topbar,
body.admin-body.admin-dark .card,
body.admin-body.admin-dark .card-soft,
body.admin-body.admin-dark .kpi,
body.admin-body.admin-dark .status-card,
body.admin-body.admin-dark .admin-list-item,
body.admin-body.admin-dark .table-wrap,
body.admin-body.admin-dark .preview-box,
body.admin-body.admin-dark .settings-card,
body.admin-body.admin-dark .side-card,
body.admin-body.admin-dark .map-card,
body.admin-body.admin-dark .price-box,
body.admin-body.admin-dark .filters-card{box-shadow:0 20px 44px rgba(2,6,23,.42)}
body.admin-body .muted, body.admin-body .help, body.admin-body .admin-topbar p, body.admin-body .admin-list-item span, body.admin-body small{color:var(--admin-muted)!important}
body.admin-body input, body.admin-body textarea, body.admin-body select{background:rgba(255,255,255,.92);border:1px solid var(--admin-border);color:var(--admin-text)}
body.admin-body.admin-dark input, body.admin-body.admin-dark textarea, body.admin-body.admin-dark select{background:#0f1724;border-color:rgba(148,163,184,.18);color:var(--admin-text)}
body.admin-body .table-wrap th{background:rgba(19,132,145,.06)!important}
body.admin-body.admin-dark .table-wrap th{background:#152031!important;color:#c5d6de}
body.admin-body.admin-dark .table-wrap tbody tr:hover{background:rgba(56,189,248,.06)}
body.admin-body.admin-dark .table-wrap td{border-bottom-color:rgba(148,163,184,.12)}
body.admin-body.admin-dark .alert-warning{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.22);color:#f6d28b}
.theme-toggle-btn{min-width:136px}

.admin-live-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:22px}
.live-chart-card{min-height:100%}
.chart-card-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}
.chart-card-head h3{margin:6px 0 0;font-size:1.18rem}
.chart-kicker{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);display:flex;align-items:center;gap:8px}
.live-dot{width:10px;height:10px;border-radius:999px;background:#22c55e;display:inline-block;box-shadow:0 0 0 0 rgba(34,197,94,.55);animation:livePulse 1.8s infinite}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.45)}70%{box-shadow:0 0 0 12px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.chart-bars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;align-items:end;min-height:220px;margin-top:18px}
.chart-bar-item{text-align:center}
.chart-bar-track{height:150px;border-radius:18px;background:linear-gradient(180deg, rgba(19,132,145,.10), rgba(19,132,145,.03));display:flex;align-items:flex-end;padding:8px;overflow:hidden}
.chart-bar-fill{width:100%;border-radius:14px 14px 10px 10px;background:var(--gradient-ocean);box-shadow:0 12px 22px rgba(19,132,145,.24);transition:height .45s ease}
.chart-bar-item strong{display:block;margin-top:10px;font-size:1.1rem}
.chart-bar-item span{display:block;font-size:.8rem;color:var(--admin-muted)}
.line-chart-wrap{width:100%;min-height:220px}
.line-chart-wrap svg{width:100%;height:220px;display:block;overflow:visible}
.trend-guides line{stroke:rgba(100,116,139,.18);stroke-dasharray:5 6}
.trend-line{fill:none;stroke:#0ea5b7;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.trend-area{fill:url(#none)}
.line-chart-wrap svg .trend-area{fill:rgba(14,165,183,.12)}
.trend-points circle{fill:#fff;stroke:#0ea5b7;stroke-width:3}
.trend-points text{font-size:12px;fill:var(--admin-muted);text-anchor:middle}
.chart-label-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:8px;font-size:.82rem;color:var(--admin-muted)}
.content-mix{display:grid;gap:12px;margin-top:18px}
.mix-row{display:grid;gap:7px}
.mix-row-head{display:flex;justify-content:space-between;gap:12px;font-size:.92rem}
.mix-row-head strong{font-size:.98rem}
.mix-row-bar{height:12px;border-radius:999px;background:rgba(19,132,145,.08);overflow:hidden}
.mix-row-bar i{display:block;height:100%;border-radius:999px;background:var(--gradient-sunset)}
.spaced-top{margin-top:18px}
.premium-status-grid{margin-bottom:18px}

.row-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.inline-delete-form{display:inline-flex;align-items:center;margin:0}
.link-button{appearance:none;background:none;border:0;padding:0;margin:0;font:inherit;font-weight:800;color:var(--primary);cursor:pointer}
.danger-link{color:#dc2626}
body.admin-body.admin-dark .danger-link{color:#f87171}

.confirm-modal{position:fixed;inset:0;z-index:100;display:none}
.confirm-modal.is-open{display:block}
.confirm-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.52);backdrop-filter:blur(6px)}
.confirm-modal-dialog{position:relative;z-index:1;width:min(460px,calc(100% - 32px));margin:10vh auto 0;background:var(--admin-card);color:var(--admin-text);border:1px solid var(--admin-border);border-radius:28px;padding:26px;box-shadow:0 30px 60px rgba(2,6,23,.36);text-align:center}
.confirm-modal-icon{width:58px;height:58px;border-radius:999px;margin:0 auto 12px;display:grid;place-items:center;background:linear-gradient(135deg,#ff8355,#ffd15b);color:#fff;font-size:1.3rem;font-weight:800}
.confirm-modal-dialog h3{margin-bottom:8px}
.confirm-modal-dialog p{color:var(--admin-muted);margin-bottom:18px}
.confirm-modal-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}

.mobile-filter-trigger{display:none}
.drawer-backdrop{display:none}
.drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px}
.drawer-close{display:none;border:0;background:rgba(19,132,145,.08);width:40px;height:40px;border-radius:12px;font-size:1rem;cursor:pointer;color:var(--admin-text)}
.chips-scroll{overflow:auto;white-space:nowrap;padding-bottom:2px}
.chips-scroll > *{display:inline-flex}

@media (max-width:1180px){.admin-live-grid{grid-template-columns:1fr}}
@media (max-width:860px){
  .mobile-filter-trigger{display:inline-flex}
  .drawer-backdrop{position:fixed;inset:0;z-index:89;background:rgba(2,6,23,.44);backdrop-filter:blur(4px)}
  .filters-card{position:fixed;left:12px;right:12px;bottom:12px;z-index:90;max-height:86vh;overflow:auto;transform:translateY(120%);transition:transform .28s ease}
  .filters-card.is-open{transform:translateY(0)}
  body.drawer-open .drawer-backdrop{display:block}
  .drawer-close{display:inline-grid;place-items:center}
}
@media (max-width:640px){
  .chart-bars{grid-template-columns:repeat(2,minmax(0,1fr))}
  .chart-label-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .confirm-modal-actions{flex-direction:column}
  .confirm-modal-actions .btn{width:100%}
}

body.admin-body .admin-side{background:linear-gradient(180deg,#0f3138 0%, #174851 100%)}
body.admin-body.admin-dark .admin-side{background:linear-gradient(180deg,#0b1220 0%, #101a2a 100%);border-right-color:rgba(148,163,184,.12);box-shadow:inset -1px 0 0 rgba(255,255,255,.03), 18px 0 34px rgba(2,6,23,.24)}
body.admin-body.admin-dark .admin-side a{color:rgba(237,243,246,.82)}
body.admin-body.admin-dark .admin-side a:hover, body.admin-body.admin-dark .admin-side a.is-active{background:rgba(255,255,255,.08);color:#fff}
body.admin-body.admin-dark .nav-pill{background:#fb7185;color:#fff}
body.admin-body.admin-dark .chart-bar-track{background:linear-gradient(180deg, rgba(14,165,183,.14), rgba(14,165,183,.04))}
body.admin-body.admin-dark .mix-row-bar{background:rgba(148,163,184,.12)}
body.admin-body.admin-dark .drawer-close{background:rgba(255,255,255,.08);color:#fff}

/* panel admin dan dukungan bilingual */
.lang-switch{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:999px;background:rgba(12,39,46,.08);border:1px solid rgba(20,50,58,.08)}
.lang-switch a{display:inline-flex;align-items:center;justify-content:center;min-width:40px;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:800;color:var(--muted)}
.lang-switch a.is-active{background:#fff;color:var(--fg);box-shadow:0 8px 18px rgba(7,34,40,.10)}
.lang-switch.mobile{margin-bottom:10px;justify-content:flex-start}
.admin-topbar-main{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap}
.admin-topbar-leading{display:flex;align-items:flex-start;gap:14px}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;border:1px solid rgba(20,50,58,.12);background:#fff;color:var(--fg);cursor:pointer;box-shadow:var(--shadow)}
.sidebar-toggle-btn{flex:0 0 42px}
.admin-sidebar-collapsed .admin-side{width:94px;padding-left:14px;padding-right:14px}
.admin-sidebar-collapsed .admin-side .admin-brand div,
.admin-sidebar-collapsed .admin-side .admin-side-label,
.admin-sidebar-collapsed .admin-side .admin-side-footer,
.admin-sidebar-collapsed .admin-side a:not(.is-active) .nav-pill{display:none}
.admin-sidebar-collapsed .admin-side a{font-size:0;display:flex;align-items:center;justify-content:center;padding:14px}
.admin-sidebar-collapsed .admin-side a.is-active{font-size:0}
.admin-sidebar-collapsed .admin-side a::before{font-size:14px;font-weight:800;color:inherit}
.admin-sidebar-collapsed .admin-side a[href*='index.php']::before{content:'DB'}
.admin-sidebar-collapsed .admin-side a[href*='bookings.php']::before{content:'BK'}
.admin-sidebar-collapsed .admin-side a[href*='categories.php']::before{content:'CT'}
.admin-sidebar-collapsed .admin-side a[href*='packages.php']::before{content:'PK'}
.admin-sidebar-collapsed .admin-side a[href*='testimonials.php']::before{content:'TS'}
.admin-sidebar-collapsed .admin-side a[href*='faqs.php']::before{content:'FQ'}
.admin-sidebar-collapsed .admin-side a[href*='settings.php']::before{content:'ST'}
.admin-sidebar-collapsed .admin-main{margin-left:0}
@media (min-width:981px){.admin-shell{grid-template-columns:260px 1fr}.admin-sidebar-collapsed .admin-shell{grid-template-columns:94px 1fr}}
.revenue-panel .line-chart-wrap.compact{margin-top:16px}
.revenue-summary-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:12px}
.revenue-summary-box{padding:16px 18px;border-radius:18px;background:linear-gradient(180deg,rgba(16,130,125,.10),rgba(16,130,125,.04));border:1px solid rgba(16,130,125,.18)}
.revenue-summary-box span{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.revenue-summary-box strong{display:block;font:700 28px/1.02 "Fraunces",serif;color:var(--fg)}
.revenue-card-highlight{background:linear-gradient(135deg,rgba(11,142,155,.12),rgba(255,208,102,.14));border:1px solid rgba(11,142,155,.16)}
.revenue-trend-chart .trend-area{fill:rgba(255,133,87,.16)}
.revenue-trend-chart .trend-line{stroke:#ff8557}
.revenue-trend-chart .trend-points circle{fill:#ff8557}
.revenue-trend-chart .trend-points text{fill:#ff8557}
.toast-stack{position:fixed;top:20px;right:20px;z-index:200;display:grid;gap:12px;width:min(360px,calc(100vw - 32px));pointer-events:none}
.toast{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 14px 14px 16px;border-radius:18px;background:rgba(17,27,31,.94);color:#fff;box-shadow:0 18px 34px rgba(5,15,18,.24);transform:translateY(-8px);opacity:0;transition:all .22s ease;pointer-events:auto}
.toast.is-visible{transform:translateY(0);opacity:1}
.toast-success{background:linear-gradient(135deg,#0d8e7e,#1fad60)}
.toast-warning{background:linear-gradient(135deg,#b77a00,#ff9f1c)}
.toast-body{display:grid;gap:4px}.toast-body strong{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.85}.toast-body span{font-size:14px;line-height:1.45}
.toast-close{border:0;background:transparent;color:inherit;font-size:22px;line-height:1;cursor:pointer;opacity:.75}
.settings-grid-bilingual .field-wrap{background:rgba(255,255,255,.5);padding:16px;border-radius:18px;border:1px solid rgba(20,50,58,.06)}
.field-lang-tag{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:22px;padding:0 8px;border-radius:999px;margin-left:8px;background:rgba(11,142,155,.12);color:var(--primary);font-size:11px;font-weight:800;text-transform:uppercase}.field-lang-tag.en{background:rgba(255,133,87,.14);color:#b25a2c}
.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.admin-dark .toast{background:rgba(16,21,24,.96)}
.admin-dark .icon-btn{background:#162126;border-color:rgba(255,255,255,.08);color:#f2f5f6}
.admin-dark .lang-switch{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.admin-dark .lang-switch a.is-active{background:#13272d;color:#fff}
@media (max-width:980px){.revenue-summary-row{grid-template-columns:1fr}.lang-switch{order:-1}.nav-cta{gap:8px;flex-wrap:wrap}.admin-sidebar-collapsed .admin-side{width:auto;padding-left:24px;padding-right:24px}.admin-sidebar-collapsed .admin-side .admin-brand div,.admin-sidebar-collapsed .admin-side .admin-side-label,.admin-sidebar-collapsed .admin-side .admin-side-footer{display:block}.admin-sidebar-collapsed .admin-side a,.admin-sidebar-collapsed .admin-side a.is-active{font-size:14px}.admin-sidebar-collapsed .admin-side a::before{content:none}}
@media (max-width:760px){.toast-stack{left:16px;right:16px;top:auto;bottom:18px;width:auto}.form-grid.two{grid-template-columns:1fr}}

/* Bali Adventure Hub public interface refresh */
:root{
  --bah-teal:#087b83;
  --bah-teal-dark:#0b3b44;
  --bah-orange:#ff7900;
  --bah-green:#25d366;
  --bah-blue:#1685d9;
  --bah-purple:#8156ff;
  --bah-ink:#0f2e35;
  --bah-muted:#718289;
  --bah-line:#e6ecef;
  --bah-bg:#f7faf9;
  --bah-shadow:0 18px 40px rgba(13,45,54,.12);
  --bah-card-shadow:0 14px 32px rgba(13,45,54,.10);
}
body:not(.admin-body){
  background:var(--bah-bg);
  color:var(--bah-ink);
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  line-height:1.6;
}
body:not(.admin-body) .container{width:min(1176px,calc(100% - 76px));}
body:not(.admin-body) h1,
body:not(.admin-body) h2,
body:not(.admin-body) h3,
body:not(.admin-body) h4{font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:-.045em;font-weight:800;}
body:not(.admin-body) .site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:#fff;
  border-bottom:1px solid rgba(15,46,53,.09);
  box-shadow:0 1px 0 rgba(15,46,53,.02);
  backdrop-filter:none;
}
body:not(.admin-body).is-scrolled .site-header{background:#fff;box-shadow:0 14px 32px rgba(15,46,53,.08);border-bottom-color:rgba(15,46,53,.10)}
body:not(.admin-body) .nav-wrap{min-height:92px;padding:0;gap:22px;}
body:not(.admin-body).is-scrolled .nav-wrap{padding:0;min-height:78px;}
body:not(.admin-body) .brand{gap:12px;flex:0 0 auto;}
body:not(.admin-body) .brand-mark{
  width:54px;
  height:54px;
  border-radius:999px;
  background:#fff;
  color:#0f2e35;
  box-shadow:none;
  overflow:hidden;
  border:0;
  font-size:1.25rem;
}
body:not(.admin-body) .brand-mark.has-logo{background:#fff;box-shadow:none;}
body:not(.admin-body) .brand-logo-image{width:100%;height:100%;object-fit:cover;border-radius:999px;}
body:not(.admin-body) .brand-copy strong{font-size:1.62rem;line-height:1;font-weight:800;color:#153943;letter-spacing:-.055em;white-space:nowrap;}
body:not(.admin-body) .site-header .brand-copy small{display:none;}
body:not(.admin-body) .nav-desktop{gap:28px;margin-left:auto;margin-right:auto;}
body:not(.admin-body) .nav-link{
  color:#24353d;
  font-size:.94rem;
  font-weight:700;
  padding:34px 0 28px;
  line-height:1;
}
body:not(.admin-body) .nav-link:after{height:3px;background:var(--bah-teal);bottom:22px;border-radius:999px;}
body:not(.admin-body) .nav-link.is-active{color:var(--bah-teal);}
body:not(.admin-body) .nav-dropdown-menu{top:calc(100% - 8px);border-radius:18px;border-color:rgba(15,46,53,.10);box-shadow:0 22px 44px rgba(15,46,53,.14);}
body:not(.admin-body) .nav-cta{gap:10px;flex:0 0 auto;}
body:not(.admin-body) .nav-cta .btn{height:44px;border-radius:8px;padding:0 16px;font-size:.9rem;font-weight:800;box-shadow:none;}
body:not(.admin-body) .nav-cta .btn svg{width:18px;height:18px;flex:0 0 18px;}
body:not(.admin-body) .btn-login-admin{background:#fff;color:#263c45;border:1px solid #dfe7ea;box-shadow:0 8px 16px rgba(14,44,54,.06)!important;}
body:not(.admin-body) .btn-login-admin:hover{background:#fbfdfd;border-color:#cbd8dc;}
body:not(.admin-body) .nav-cta .btn-whatsapp{background:#20bf63;color:#fff;border-radius:8px;min-width:118px;}
body:not(.admin-body) .nav-cta .btn-hero{background:#ff7900;color:#fff;border-radius:8px;min-width:99px;}
body:not(.admin-body) .lang-switch{display:flex;align-items:center;gap:0;margin:0 8px;font-weight:800;color:#8a969b;}
body:not(.admin-body) .lang-switch a{padding:2px 8px;font-size:.88rem;line-height:1;color:#89969c;}
body:not(.admin-body) .lang-switch a + a{border-left:1px solid #d8e1e3;}
body:not(.admin-body) .lang-switch a.is-active{color:var(--bah-teal);}
body:not(.admin-body) .nav-toggle{width:46px;height:46px;border-radius:12px;border:1px solid #dfe7ea;background:#fff;box-shadow:0 8px 18px rgba(15,46,53,.08);}

body:not(.admin-body) .hero-section.hero-reference{
  min-height:calc(100vh - 92px);
  overflow:hidden;
  background:#0e4c59;
}
body:not(.admin-body) .hero-section.hero-reference .hero-image{filter:saturate(1.08) contrast(1.02);transform-origin:center;}
body:not(.admin-body) .hero-section.hero-reference .hero-overlay{
  background:
    linear-gradient(90deg, rgba(7,42,52,.82) 0%, rgba(7,59,70,.58) 34%, rgba(7,42,52,.22) 62%, rgba(7,42,52,.05) 100%),
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.06) 58%, rgba(0,0,0,.20) 100%);
}
body:not(.admin-body) .hero-section.hero-reference:after{display:none;}
body:not(.admin-body) .hero-content{
  position:relative;
  min-height:calc(100vh - 92px);
  padding:0 0 112px;
  display:flex;
  align-items:center;
}
body:not(.admin-body) .hero-copy{max-width:720px;padding-top:58px;}
body:not(.admin-body) .hero-social{display:inline-flex;align-items:center;gap:13px;color:rgba(255,255,255,.92);font-size:1rem;font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,.25);}
body:not(.admin-body) .avatar-stack{display:flex;align-items:center;}
body:not(.admin-body) .traveler-avatar{width:38px;height:38px;border-radius:999px;border:3px solid rgba(255,255,255,.86);margin-left:-8px;background:#ddd;box-shadow:0 4px 12px rgba(0,0,0,.22);}
body:not(.admin-body) .traveler-avatar:first-child{margin-left:0;}
body:not(.admin-body) .traveler-a{background:radial-gradient(circle at 46% 34%,#f3d0bd 0 18%,#1b2731 19% 35%,#e9eef0 36% 70%,#9ba8ad 71%);}
body:not(.admin-body) .traveler-b{background:radial-gradient(circle at 50% 34%,#d6b098 0 18%,#69402e 19% 34%,#5eb3c0 35% 72%,#e7f5f6 73%);}
body:not(.admin-body) .traveler-c{background:radial-gradient(circle at 50% 33%,#9f6d4f 0 18%,#241b18 19% 34%,#f1a85a 35% 72%,#fff 73%);}
body:not(.admin-body) .traveler-d{background:radial-gradient(circle at 50% 33%,#e0b296 0 18%,#1c1c1f 19% 34%,#f6f4ee 35% 72%,#a8b5b7 73%);}
body:not(.admin-body) .hero-star{color:#ffba19;font-size:1.28rem;text-shadow:none;margin-left:2px;}
body:not(.admin-body) .hero-copy h1{font-size:clamp(3rem,6.1vw,4.7rem);line-height:1.02;letter-spacing:-.065em;font-weight:800;margin:32px 0 20px;color:#fff;max-width:710px;text-shadow:0 3px 18px rgba(0,0,0,.22);}
body:not(.admin-body) .hero-copy p{max-width:660px;color:rgba(255,255,255,.94);font-size:clamp(1.06rem,1.75vw,1.24rem);font-weight:500;line-height:1.55;text-shadow:0 2px 12px rgba(0,0,0,.22);margin-bottom:0;}
body:not(.admin-body) .hero-actions{display:flex;flex-wrap:wrap;gap:24px 18px;margin-top:28px;max-width:560px;}
body:not(.admin-body) .hero-actions .btn{min-height:67px;border-radius:10px;font-size:1.05rem;font-weight:800;padding:0 28px;box-shadow:0 16px 28px rgba(0,0,0,.16);}
body:not(.admin-body) .hero-actions .btn-hero{background:#ff7900;color:#fff;min-width:258px;}
body:not(.admin-body) .hero-actions .btn-whatsapp{background:#25d366;color:#fff;min-width:226px;}
body:not(.admin-body) .hero-actions .btn-outline-light{background:rgba(7,42,52,.22);border:2px solid rgba(255,255,255,.62);color:#fff;min-width:228px;box-shadow:none;backdrop-filter:blur(2px);}
body:not(.admin-body) .hero-actions .btn-explore{flex:0 0 228px;}
body:not(.admin-body) .btn-icon{display:inline-grid;place-items:center;width:22px;height:22px;font-size:1.05rem;line-height:1;}

body:not(.admin-body) .home-category-overlap{margin-top:-92px;position:relative;z-index:5;}
body:not(.admin-body) .category-icon-grid.card-soft{background:#fff;border:1px solid rgba(15,46,53,.08);border-radius:18px;box-shadow:0 18px 44px rgba(15,46,53,.16);display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;padding:22px 16px;overflow:hidden;}
body:not(.admin-body) .category-icon-card{gap:7px;min-height:138px;padding:8px 15px;border-radius:0;position:relative;color:#202e35;align-items:center;justify-content:center;text-align:center;}
body:not(.admin-body) .category-icon-card:not(:last-child){border-right:1px solid #e7eef1;}
body:not(.admin-body) .category-icon-card:hover{background:#f8fbfb;transform:translateY(-3px);}
body:not(.admin-body) .category-icon-circle{width:74px;height:74px;background:#f3f7f8;box-shadow:0 12px 26px rgba(15,46,53,.10);color:var(--bah-teal);font-size:0;margin-bottom:9px;border-radius:22px;overflow:hidden;display:grid;place-items:center;border:1px solid rgba(15,46,53,.06);position:relative;}
body:not(.admin-body) .category-icon-circle img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .28s ease;}
body:not(.admin-body) .category-icon-card:hover .category-icon-circle img{transform:scale(1.07);}
body:not(.admin-body) .category-icon-name{font-size:1rem;font-weight:800;line-height:1.16;color:#202e35;}
body:not(.admin-body) .category-icon-short{display:block;font-size:.82rem;color:#7b8b91;line-height:1.24;font-weight:500;max-width:132px;margin:0 auto;}

body:not(.admin-body) .section-block{padding:88px 0;}
body:not(.admin-body) .section-label{color:var(--bah-teal);letter-spacing:.13em;font-size:.78rem;font-weight:900;}
body:not(.admin-body) .section-center h2,
body:not(.admin-body) .section-row h2,
body:not(.admin-body) .package-main h2,
body:not(.admin-body) .about-split h2,
body:not(.admin-body) .cta-banner h2{font-size:clamp(2rem,3.6vw,3.1rem);}
body:not(.admin-body) .section-copy{color:var(--bah-muted);font-size:1.03rem;}
body:not(.admin-body) .card-soft,
body:not(.admin-body) .package-card,
body:not(.admin-body) .benefit-card,
body:not(.admin-body) .step-card,
body:not(.admin-body) .testimonial-card-light,
body:not(.admin-body) .side-card,
body:not(.admin-body) .booking-note-card,
body:not(.admin-body) .price-box,
body:not(.admin-body) .map-card,
body:not(.admin-body) .booking-form{background:#fff;border:1px solid rgba(15,46,53,.08);box-shadow:var(--bah-card-shadow);}
body:not(.admin-body) .package-card{border-radius:22px;overflow:hidden;}
body:not(.admin-body) .package-card h3{font-size:1.28rem;letter-spacing:-.035em;}
body:not(.admin-body) .package-card-media{aspect-ratio:1.18/1;}
body:not(.admin-body) .package-price-bubble strong{color:var(--bah-teal);}
body:not(.admin-body) .badge-accent{background:#fff4d1;color:#815d00;}
body:not(.admin-body) .benefit-card,
body:not(.admin-body) .step-card{border-radius:22px;}
body:not(.admin-body) .section-muted{background:linear-gradient(180deg,#eef8f8,#f7faf9);}
body:not(.admin-body) .section-dark{background:#0d333c;color:#fff;}
body:not(.admin-body) .testimonial-card-dark{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:22px;box-shadow:none;}
body:not(.admin-body) .cta-banner{border-radius:24px;background:linear-gradient(135deg,#087b83,#0d4954);box-shadow:0 22px 50px rgba(7,61,72,.24);}
body:not(.admin-body) .cta-banner .btn-hero{background:#ff7900;}
body:not(.admin-body) .cta-banner .btn-whatsapp{background:#25d366;}

body:not(.admin-body) .subhero,
body:not(.admin-body) .package-hero{background:#0d4c59;color:#fff;}
body:not(.admin-body) .subhero{min-height:390px;padding:112px 0;display:flex;align-items:center;}
body:not(.admin-body) .subhero .container,
body:not(.admin-body) .package-hero .container{position:relative;z-index:2;}
body:not(.admin-body) .subhero-overlay.dark,
body:not(.admin-body) .package-hero-overlay{background:linear-gradient(90deg, rgba(7,42,52,.84), rgba(7,59,70,.55) 45%, rgba(7,42,52,.20));}
body:not(.admin-body) .subhero h1,
body:not(.admin-body) .package-hero h1{font-size:clamp(2.4rem,4.8vw,4.2rem);line-height:1.05;color:#fff;text-shadow:0 4px 16px rgba(0,0,0,.24);}
body:not(.admin-body) .subhero p,
body:not(.admin-body) .package-hero p{font-size:1.08rem;color:rgba(255,255,255,.92);}
body:not(.admin-body) .package-hero .container{padding:105px 0 112px;}
body:not(.admin-body) .price-box{border-radius:22px;}
body:not(.admin-body) .price-display{color:var(--bah-teal);}
body:not(.admin-body) .booking-form{border-radius:24px;padding:30px;}
body:not(.admin-body) input,
body:not(.admin-body) textarea,
body:not(.admin-body) select{border-radius:12px;border-color:#dce6e9;}
body:not(.admin-body) .site-footer{margin-top:0;background:#0d333c;color:#fff;padding-top:72px;}
body:not(.admin-body) .site-footer .brand-mark{width:48px;height:48px;}
body:not(.admin-body) .site-footer .brand-copy small{display:block;color:rgba(255,255,255,.56);font-size:.65rem;}
body:not(.admin-body) .footer-bottom{border-top-color:rgba(255,255,255,.10);}
body:not(.admin-body) .floating-whatsapp{right:24px;bottom:24px;background:#25d366;width:58px;height:58px;box-shadow:0 18px 34px rgba(37,211,102,.32);}

@media (max-width:1180px){
  body:not(.admin-body) .container{width:min(100% - 44px,1176px);}
  body:not(.admin-body) .brand-copy strong{font-size:1.32rem;}
  body:not(.admin-body) .nav-desktop{gap:18px;}
  body:not(.admin-body) .nav-cta .btn-login-admin{display:none;}
  body:not(.admin-body) .hero-copy h1{font-size:clamp(2.8rem,6.4vw,4.3rem);}
}
@media (max-width:1024px){
  body:not(.admin-body) .category-icon-grid.card-soft{grid-template-columns:repeat(4,1fr);}
  body:not(.admin-body) .category-icon-card:nth-child(4n){border-right:0;}
  body:not(.admin-body) .category-icon-card{border-bottom:1px solid #e7eef1;}
  body:not(.admin-body) .category-icon-card:nth-last-child(-n+3){border-bottom:0;}
}
@media (max-width:860px){
  body:not(.admin-body) .nav-desktop,
  body:not(.admin-body) .nav-cta{display:none;}
  body:not(.admin-body) .nav-toggle{display:grid;place-items:center;}
  body:not(.admin-body) .nav-wrap{min-height:76px;}
  body:not(.admin-body) .brand-mark{width:48px;height:48px;}
  body:not(.admin-body) .brand-copy strong{font-size:1.18rem;}
  body:not(.admin-body) .nav-mobile{background:#fff;box-shadow:0 18px 28px rgba(15,46,53,.08);}
  body:not(.admin-body) .hero-section.hero-reference,
  body:not(.admin-body) .hero-content{min-height:calc(100vh - 76px);}
  body:not(.admin-body) .hero-copy{padding-top:20px;}
  body:not(.admin-body) .home-category-overlap{margin-top:-70px;}
}
@media (max-width:640px){
  body:not(.admin-body) .container{width:min(100% - 24px,1176px);}
  body:not(.admin-body) .hero-content{padding-bottom:96px;align-items:flex-end;}
  body:not(.admin-body) .hero-copy h1{font-size:clamp(2.2rem,11vw,3.15rem);margin-top:22px;}
  body:not(.admin-body) .hero-social{font-size:.9rem;gap:9px;}
  body:not(.admin-body) .traveler-avatar{width:31px;height:31px;border-width:2px;margin-left:-7px;}
  body:not(.admin-body) .hero-actions{gap:12px;max-width:none;}
  body:not(.admin-body) .hero-actions .btn{width:100%;min-height:58px;font-size:.98rem;}
  body:not(.admin-body) .hero-actions .btn-explore{flex-basis:auto;}
  body:not(.admin-body) .category-icon-grid.card-soft{grid-template-columns:repeat(2,1fr);padding:12px 10px;}
  body:not(.admin-body) .category-icon-card{min-height:112px;border-bottom:1px solid #e7eef1!important;}
  body:not(.admin-body) .category-icon-card:nth-child(2n){border-right:0;}
  body:not(.admin-body) .category-icon-card:nth-last-child(-n+1){border-bottom:0!important;}
  body:not(.admin-body) .section-block{padding:68px 0;}
  body:not(.admin-body) .subhero{min-height:310px;padding:84px 0;}
}

/* Final consistency pass: public interface + complete admin CRUD polish */
body:not(.admin-body){background:#fff;color:#142f36;font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;}
body:not(.admin-body) .site-header{height:92px;background:#fff;display:flex;align-items:center;}
body:not(.admin-body) .site-header .container{width:min(1200px,calc(100% - 48px));}
body:not(.admin-body) .nav-wrap{min-height:92px;}
body:not(.admin-body) .brand-mark{width:56px;height:56px;box-shadow:none;background:#fff;}
body:not(.admin-body) .brand-copy strong{font-size:1.58rem;font-weight:800;color:#14343d;letter-spacing:-.055em;}
body:not(.admin-body) .nav-link{padding:36px 0 30px;font-weight:700;color:#24343c;}
body:not(.admin-body) .nav-link:after{background:#087b83;height:3px;bottom:21px;}
body:not(.admin-body) .hero-section.hero-reference{min-height:calc(100vh - 92px);}
body:not(.admin-body) .hero-section.hero-reference .hero-overlay{background:linear-gradient(90deg,rgba(8,39,50,.83) 0%,rgba(8,58,70,.60) 32%,rgba(8,58,70,.20) 65%,rgba(8,58,70,.03) 100%),linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.18));}
body:not(.admin-body) .hero-content{min-height:calc(100vh - 92px);padding:0 0 112px;align-items:center;}
body:not(.admin-body) .hero-copy{max-width:690px;padding-top:38px;}
body:not(.admin-body) .hero-copy h1{font-size:clamp(3.1rem,6vw,4.95rem);line-height:1.03;font-weight:800;letter-spacing:-.07em;margin:32px 0 20px;}
body:not(.admin-body) .hero-copy p{max-width:650px;font-size:clamp(1.05rem,1.65vw,1.22rem);line-height:1.58;font-weight:500;}
body:not(.admin-body) .hero-actions .btn{border-radius:10px;min-height:66px;}
body:not(.admin-body) .home-category-overlap{margin-top:-92px;}
body:not(.admin-body) .category-icon-grid.card-soft{max-width:1176px;margin:0 auto;border-radius:16px;padding:24px 18px;box-shadow:0 18px 42px rgba(15,46,53,.15);}
body:not(.admin-body) .category-icon-card{min-height:116px;}
body:not(.admin-body) .category-icon-name{font-size:1rem;color:#202f36;}
body:not(.admin-body) .category-icon-short{font-size:.82rem;color:#75858c;}
body:not(.admin-body) .subhero,body:not(.admin-body) .package-hero{background:#0c4d59;}
body:not(.admin-body) .package-card,body:not(.admin-body) .benefit-card,body:not(.admin-body) .step-card,body:not(.admin-body) .testimonial-card-light,body:not(.admin-body) .booking-form,body:not(.admin-body) .price-box{border-radius:22px;background:#fff;border:1px solid rgba(15,46,53,.08);box-shadow:0 14px 32px rgba(13,45,54,.10);}
body:not(.admin-body) .btn-hero,.btn-primary{background:#ff7900;color:#fff;}
body:not(.admin-body) .btn-whatsapp{background:#25d366;color:#fff;}

.btn-danger{background:#ef4444;color:#fff;box-shadow:0 12px 22px rgba(239,68,68,.18)}
.admin-form-stack{display:grid;gap:16px}.admin-form-stack .form-grid{margin-bottom:0}.row-actions.vertical{display:grid;gap:8px;align-items:start}.row-actions.vertical a{display:inline-block}.followup-list{display:grid;gap:14px;margin-top:18px}.followup-item{padding:16px;border:1px solid #e5eef0;border-radius:18px;background:#fff}.followup-item.is-open{border-color:#f3c65d;background:#fffaf0}.brand-preview-surface{min-height:132px;display:grid;place-items:center;background:linear-gradient(135deg,#f7fbfb,#eef6f6);border:1px dashed #ccdce0;border-radius:18px;padding:18px}.brand-preview-surface img{max-width:100%;max-height:110px;object-fit:contain}.favicon-preview-surface{min-height:112px}.favicon-preview-surface img{width:64px;height:64px;border-radius:16px;object-fit:cover}.brand-fallback-preview{width:74px;height:74px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,#087b83,#23b0b8);color:#fff;font-weight:900;font-size:1.8rem}.logo-preview-grid{align-items:stretch}.inline-check{display:inline-flex;gap:8px;align-items:center;font-weight:700}.field-lang-tag{display:inline-flex;align-items:center;margin-left:6px;padding:2px 7px;border-radius:999px;background:#e9f7f7;color:#087b83;font-size:.72rem;font-weight:900}.field-lang-tag.en{background:#fff1df;color:#c45a00}.field-span-2{grid-column:1/-1}.settings-grid-bilingual textarea{min-height:112px}.admin-side a.is-active{background:rgba(255,255,255,.12);color:#fff}.admin-brand .brand-logo-image,.auth-brand-mark .brand-logo-image{width:100%;height:100%;object-fit:cover}.admin-brand .brand-mark.has-logo{background:#fff;border-radius:16px}.auth-brand-mark{width:64px!important;height:64px!important;border-radius:20px!important;margin-bottom:14px}.auth-brand-mark.has-logo{background:#fff!important}
@media (max-width:860px){body:not(.admin-body) .site-header{height:76px}body:not(.admin-body) .nav-wrap{min-height:76px}body:not(.admin-body) .hero-section.hero-reference,body:not(.admin-body) .hero-content{min-height:calc(100vh - 76px)}.admin-preview{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr}.actions{flex-wrap:wrap}}

/* === Interactive public experience and smarter admin additions === */
.scroll-progress{
  position:fixed;
  top:0;
  left:0;
  height:4px;
  width:var(--scroll-progress,0%);
  background:linear-gradient(90deg,var(--primary,#ff7a00),var(--accent,#00b3b3));
  z-index:1200;
  pointer-events:none;
  box-shadow:0 4px 18px rgba(0,0,0,.14);
}

.live-stats-grid,
.package-signal-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.live-stat-card,
.package-signal-card{
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;
  padding:22px;
  box-shadow:0 18px 50px rgba(15,23,42,.08);
  position:relative;
  overflow:hidden;
}
.live-stat-card::before,
.package-signal-card::before{
  content:"";
  position:absolute;
  inset:auto -18% 70% auto;
  width:120px;
  height:120px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(255,122,0,.18), rgba(255,122,0,0));
}
.live-stat-card strong,
.package-signal-card strong{
  display:block;
  font-size:2rem;
  line-height:1;
  margin-bottom:8px;
}
.live-stat-card span,
.package-signal-card span{
  display:block;
  font-weight:700;
  margin-bottom:8px;
}
.live-stat-card small,
.package-signal-card small{
  display:block;
  color:rgba(15,23,42,.66);
  line-height:1.6;
}

.smart-planner-shell{position:relative;}
.smart-planner-grid{
  display:grid;
  grid-template-columns:1.18fr .82fr;
  gap:22px;
  align-items:start;
}
.planner-chat,
.planner-side-card,
.smart-help-card{
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:24px;
  box-shadow:0 20px 50px rgba(15,23,42,.08);
}
.planner-chat{padding:24px;}
.planner-chat-head{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:18px;
}
.planner-chat-head strong{font-size:1rem;}
.planner-chat-head small{color:rgba(15,23,42,.58);}
.planner-live-dot,
.live-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#10b981;
  box-shadow:0 0 0 8px rgba(16,185,129,.12);
  display:inline-block;
}
.planner-chat-body{display:grid; gap:12px; margin-bottom:18px;}
.chat-bubble{
  max-width:85%;
  padding:14px 16px;
  border-radius:18px;
  line-height:1.6;
  font-size:.96rem;
  box-shadow:0 10px 26px rgba(15,23,42,.06);
}
.chat-bubble.incoming{background:#f5f7fb; border-top-left-radius:8px;}
.chat-bubble.outgoing{background:linear-gradient(135deg, rgba(255,122,0,.94), rgba(255,153,59,.92)); color:#fff; justify-self:end; border-top-right-radius:8px;}
.planner-chip-grid,
.smart-help-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.planner-chip,
.smart-help-actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,122,0,.08);
  color:var(--dark,#111827);
  font-weight:700;
  text-decoration:none;
  border:1px solid rgba(255,122,0,.14);
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.planner-chip:hover,
.smart-help-actions a:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(255,122,0,.16); background:rgba(255,122,0,.12);}
.planner-side-card{padding:24px;}
.planner-side-card h3{margin-bottom:16px;}
.planner-product-stack{display:grid; gap:12px;}
.planner-product-card{
  display:grid;
  grid-template-columns:88px 1fr;
  gap:14px;
  align-items:center;
  text-decoration:none;
  color:inherit;
  background:#fffaf5;
  border:1px solid rgba(255,122,0,.1);
  border-radius:18px;
  padding:12px;
}
.planner-product-card img{width:88px;height:72px;object-fit:cover;border-radius:14px;}
.planner-product-card strong{display:block;margin-bottom:4px;}
.planner-product-card span,
.planner-product-card small{display:block;color:rgba(15,23,42,.62);}
.planner-product-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(15,23,42,.08);}

.review-marquee{
  overflow:hidden;
  position:relative;
  mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent);
}
.review-marquee-track{
  display:flex;
  gap:16px;
  width:max-content;
  animation:reviewTicker 45s linear infinite;
}
.review-pill{
  width:320px;
  padding:18px;
  border-radius:20px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 40px rgba(15,23,42,.08);
}
.review-pill-stars{color:#f59e0b;margin-bottom:8px;letter-spacing:1px;}
.review-pill p{color:rgba(15,23,42,.7);line-height:1.6;margin-bottom:14px;}
.review-pill strong{display:block;}
.review-pill span{color:rgba(15,23,42,.56);font-size:.92rem;}
@keyframes reviewTicker{from{transform:translateX(0);}to{transform:translateX(-50%);}}

.smart-help-card{padding:22px;margin-top:18px;}
.smart-help-badge{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(0,179,179,.12);
  color:#0f766e;
  font-size:.82rem;
  font-weight:700;
  margin-bottom:12px;
}
.smart-help-card h3{margin-bottom:10px;}
.smart-help-card p{color:rgba(15,23,42,.66); line-height:1.7; margin-bottom:14px;}
.recommendation-shell{display:grid;gap:26px;}
.recommendation-group{display:grid;gap:16px;}
.recommendation-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.recommendation-head span,
.section-copy.compact{color:rgba(15,23,42,.64);}

.admin-insight-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:22px;
}
.best-package-stack,
.timeline-list,
.review-snippet-list{display:grid;gap:14px;}
.best-package-item,
.timeline-item{
  display:grid;
  grid-template-columns:72px 1fr;
  gap:14px;
  align-items:center;
  color:inherit;
  text-decoration:none;
  padding:12px;
  border-radius:18px;
  background:var(--admin-soft, rgba(15,23,42,.04));
  border:1px solid var(--admin-border, rgba(15,23,42,.08));
}
.best-package-item img{width:72px;height:72px;object-fit:cover;border-radius:16px;}
.best-package-head,
.best-package-meta{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.best-package-meta{font-size:.92rem;color:var(--admin-muted, rgba(15,23,42,.62));margin-top:4px;}
.best-package-bar{height:8px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;margin-top:10px;}
.best-package-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#38bdf8,#6366f1);}
.insight-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.insight-metric-card{
  padding:18px;
  border-radius:20px;
  background:var(--admin-soft, rgba(15,23,42,.04));
  border:1px solid var(--admin-border, rgba(15,23,42,.08));
}
.insight-metric-card span,
.review-snippet-item small,
.timeline-copy span{display:block;color:var(--admin-muted, rgba(15,23,42,.62));}
.insight-metric-card strong{display:block;font-size:1.6rem;margin:6px 0;}
.insight-metric-card small{display:block;color:var(--admin-muted, rgba(15,23,42,.62));line-height:1.6;}
.timeline-item{grid-template-columns:110px 1fr;}
.timeline-date{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(56,189,248,.12);
  color:var(--admin-text, #0f172a);
  font-weight:700;
}
.review-snippet-item{
  padding:14px 16px;
  border-radius:18px;
  background:var(--admin-soft, rgba(15,23,42,.04));
  border:1px solid var(--admin-border, rgba(15,23,42,.08));
}
.review-snippet-item strong{display:block;margin-bottom:6px;}
.review-snippet-item strong span{font-weight:400;color:var(--admin-muted, rgba(15,23,42,.62));}
.review-snippet-item p{margin-top:8px;color:var(--admin-text, #0f172a);line-height:1.6;opacity:.82;}

.smart-assistant-widget{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:1300;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}
.smart-assistant-panel{
  width:min(360px, calc(100vw - 32px));
  background:#ffffff;
  border-radius:22px;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 60px rgba(15,23,42,.18);
  padding:18px;
  display:none;
}
.smart-assistant-widget.is-open .smart-assistant-panel{display:block;animation:assistantFade .25s ease;}
@keyframes assistantFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.smart-assistant-toggle{
  width:62px;height:62px;border-radius:999px;border:0;cursor:pointer;
  background:linear-gradient(135deg,var(--primary,#ff7a00),#ff9f43);
  color:#fff;font-size:1.5rem;box-shadow:0 22px 44px rgba(255,122,0,.32);
}
.smart-assistant-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;}
.smart-assistant-header strong{display:block;font-size:1rem;}
.smart-assistant-header p{margin-top:4px;color:rgba(15,23,42,.66);line-height:1.6;font-size:.95rem;}
.smart-assistant-quick{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0;}
.smart-assistant-quick button{
  border:1px solid rgba(15,23,42,.08);background:#f5f7fb;border-radius:999px;padding:10px 12px;cursor:pointer;font-weight:700;
}
.smart-assistant-quick button:hover{background:#fff0e4;border-color:rgba(255,122,0,.18);}
.smart-assistant-cta{display:flex;gap:10px;flex-wrap:wrap;}
.smart-assistant-cta a{flex:1;min-width:140px;text-align:center;text-decoration:none;}
.smart-assistant-close{background:transparent;border:0;font-size:1.3rem;cursor:pointer;color:rgba(15,23,42,.54);}

@media (max-width: 1100px){
  .live-stats-grid,
  .package-signal-grid,
  .admin-insight-grid,
  .smart-planner-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 760px){
  .live-stats-grid,
  .package-signal-grid,
  .admin-insight-grid,
  .smart-planner-grid,
  .insight-metric-grid{grid-template-columns:1fr;}
  .planner-product-card,
  .best-package-item,
  .timeline-item{grid-template-columns:1fr;}
  .planner-product-card img,
  .best-package-item img{width:100%;height:180px;}
  .review-pill{width:280px;}
  .smart-assistant-widget{right:14px;bottom:14px;}
}

/* === Advanced admin charts + AI recommendation engine === */
.admin-advanced-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}
.advanced-chart-card{min-height:360px;}
.advanced-bars{display:grid;gap:14px;margin-top:16px;}
.advanced-bar-row{display:grid;gap:8px;}
.advanced-bar-head{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;}
.advanced-bar-head span,.advanced-bar-row small{color:var(--admin-muted,rgba(15,23,42,.62));}
.advanced-bar-track{height:12px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;}
.advanced-bar-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0ea5e9,#14b8a6,#f97316);transition:width .5s ease;}
.funnel-chart{display:grid;gap:14px;margin-top:16px;align-items:center;}
.funnel-step{width:var(--funnel-width);min-width:190px;margin-inline:auto;display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:18px;background:linear-gradient(135deg,rgba(14,165,233,.16),rgba(249,115,22,.12));border:1px solid var(--admin-border,rgba(15,23,42,.08));}
.funnel-index{width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:rgba(14,165,233,.16);font-weight:800;}
.funnel-step strong,.funnel-step small{display:block;}
.funnel-step small{color:var(--admin-muted,rgba(15,23,42,.62));}
.heatmap-chart{display:grid;gap:8px;margin-top:16px;}
.heatmap-head,.heatmap-row{display:grid;grid-template-columns:72px repeat(4,1fr);gap:8px;align-items:center;}
.heatmap-head span{font-size:.78rem;font-weight:800;color:var(--admin-muted,rgba(15,23,42,.62));text-align:center;}
.heatmap-row strong{font-size:.86rem;color:var(--admin-muted,rgba(15,23,42,.62));}
.heatmap-cell{height:46px;border-radius:14px;display:grid;place-items:center;font-weight:800;background:rgba(14,165,233,var(--heat));color:var(--admin-text,#0f172a);border:1px solid var(--admin-border,rgba(15,23,42,.08));}
.persona-mix-chart{display:grid;gap:12px;margin-top:16px;}
.persona-row{display:grid;grid-template-columns:1fr auto;gap:8px 14px;padding:12px;border-radius:16px;background:var(--admin-soft,rgba(15,23,42,.04));border:1px solid var(--admin-border,rgba(15,23,42,.08));}
.persona-row small{display:block;color:var(--admin-muted,rgba(15,23,42,.62));line-height:1.45;margin-top:3px;}
.persona-row span{font-weight:900;}
.persona-track{grid-column:1/-1;height:8px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;}
.persona-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#f97316,#14b8a6);}
.leadtime-chart{margin-top:18px;display:grid;gap:9px;}
.leadtime-chart h4{margin:0 0 4px;}
.leadtime-row{display:grid;grid-template-columns:58px 1fr 34px;gap:10px;align-items:center;}
.leadtime-row span,.leadtime-row strong{font-size:.86rem;font-weight:800;color:var(--admin-muted,rgba(15,23,42,.62));}
.leadtime-row div{height:9px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;}
.leadtime-row i{display:block;height:100%;border-radius:999px;background:#6366f1;}

.ai-reco-widget{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:26px;padding:24px;box-shadow:0 20px 55px rgba(15,23,42,.08);}
.ai-reco-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;flex-wrap:wrap;margin-bottom:16px;}
.ai-reco-head h2,.ai-reco-head h3{margin:0 0 8px;}
.ai-reco-reason{color:rgba(15,23,42,.64);line-height:1.65;max-width:760px;}
.ai-reco-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;}
.ai-reco-tabs button{border:1px solid rgba(15,23,42,.08);background:#f7fafb;border-radius:999px;padding:10px 14px;font-weight:800;cursor:pointer;transition:.22s ease;}
.ai-reco-tabs button:hover,.ai-reco-tabs button.is-active{background:linear-gradient(135deg,#ff7a00,#ff9f43);color:#fff;border-color:transparent;box-shadow:0 12px 26px rgba(255,122,0,.2);transform:translateY(-1px);}
.ai-reco-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.ai-reco-card{display:flex;flex-direction:column;min-height:100%;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:22px;overflow:hidden;color:inherit;text-decoration:none;box-shadow:0 16px 36px rgba(15,23,42,.07);transition:transform .25s ease, box-shadow .25s ease;}
.ai-reco-card:hover{transform:translateY(-4px);box-shadow:0 24px 50px rgba(15,23,42,.12);}
.ai-reco-card img{width:100%;height:150px;object-fit:cover;}
.ai-reco-card-body{padding:16px;display:grid;gap:8px;}
.ai-reco-score{display:inline-flex;width:max-content;padding:6px 9px;border-radius:999px;background:rgba(20,184,166,.1);color:#0f766e;font-size:.78rem;font-weight:900;}
.ai-reco-card strong{font-size:1rem;line-height:1.35;}
.ai-reco-card p{margin:0;color:rgba(15,23,42,.62);font-size:.9rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ai-reco-card small{color:rgba(15,23,42,.66);font-weight:800;}
.ai-reco-loading{padding:24px;border-radius:18px;background:#f7fafb;color:rgba(15,23,42,.62);font-weight:800;text-align:center;grid-column:1/-1;}
@media (max-width:1100px){.admin-advanced-grid,.ai-reco-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:760px){.admin-advanced-grid,.ai-reco-grid{grid-template-columns:1fr}.heatmap-head,.heatmap-row{grid-template-columns:58px repeat(4,1fr)}.heatmap-cell{height:38px;font-size:.82rem}.funnel-step{width:100%!important}}

.admin-media-section{margin-top:24px;padding-top:22px;border-top:1px solid var(--admin-border, rgba(15,23,42,.10));display:grid;gap:12px;}
.admin-media-section h2{margin:0;font-size:1.15rem;}
.admin-media-section .help{margin:0;color:var(--admin-muted, rgba(15,23,42,.62));line-height:1.6;}

@media (max-width:1024px){
  body:not(.admin-body) .category-icon-card:nth-child(4n){border-right:0;}
  body:not(.admin-body) .category-icon-card:nth-child(4n+1){border-left:0;}
}
@media (max-width:680px){
  body:not(.admin-body) .category-icon-grid.card-soft{grid-template-columns:repeat(2,1fr);padding:12px;}
  body:not(.admin-body) .category-icon-card{min-height:142px;border-right:0!important;border-bottom:1px solid #e7eef1!important;}
  body:not(.admin-body) .category-icon-card:nth-last-child(-n+1){border-bottom:0!important;}
}

/* Package detail media showcase and admin multi upload */
.package-media-section{display:grid;gap:22px}
.package-media-wall{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:18px;align-items:stretch;margin-bottom:24px}
.package-media-lead,.package-media-thumbs article{position:relative;overflow:hidden;border-radius:26px;background:#0f3b43;box-shadow:var(--shadow-soft)}
.package-media-lead img{width:100%;height:100%;min-height:460px;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.02)}
.package-media-caption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;border-radius:20px;background:linear-gradient(135deg,rgba(10,35,42,.82),rgba(10,35,42,.48));color:#fff;backdrop-filter:blur(10px)}
.package-media-caption span{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:#bff4f2;margin-bottom:4px}
.package-media-caption strong{font-size:1.18rem;line-height:1.35}
.package-media-thumbs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.package-media-thumbs article{min-height:220px}
.package-media-thumbs img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05)}
.package-media-thumbs span{position:absolute;left:12px;right:12px;bottom:12px;padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.9);color:#0f3b43;font-size:.78rem;font-weight:900;text-align:center;box-shadow:0 10px 28px rgba(0,0,0,.12)}
.multi-upload-preview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:12px}
.multi-upload-item{background:#fff;border:1px solid #e4eef0;border-radius:16px;padding:10px;display:grid;gap:8px;box-shadow:0 10px 26px rgba(16,52,58,.06)}
.multi-upload-item img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:#f4f8f9}
.multi-upload-item span{font-size:.74rem;color:var(--muted);font-weight:700;line-height:1.35;word-break:break-word}
@media (max-width:980px){.package-media-wall{grid-template-columns:1fr}.package-media-lead img{min-height:360px}.multi-upload-preview{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.package-media-thumbs{grid-template-columns:1fr}.package-media-lead img{min-height:300px}.multi-upload-preview{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Demo version controls */
.demo-bottom-badge {
  position: fixed;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  z-index: 9999;
  background: #f97316;
  color: #fff;
  font-weight: 800;
  letter-spacing: .02em;
  font-size: 12px;
  padding: 9px 18px;
  border-radius: 999px;
  box-shadow: 0 16px 36px rgba(15,23,42,.22);
  text-align: center;
  white-space: nowrap;
}
.demo-disabled-action,
.demo-disabled-action:hover {
  cursor: not-allowed !important;
  opacity: .64;
}
.demo-view-only,
.demo-view-only:focus {
  cursor: default !important;
  background-color: rgba(148,163,184,.08) !important;
}
.demo-login-card {
  margin-top: 16px;
  border: 1px solid rgba(249,115,22,.28);
  background: rgba(249,115,22,.08);
  border-radius: 22px;
  padding: 16px;
}
.demo-login-card h3 {
  margin: 0 0 12px;
  font-size: 16px;
}
.demo-role-list {
  display: grid;
  gap: 10px;
}
.demo-role-btn {
  width: 100%;
  text-align: left;
  border: 1px solid rgba(15,23,42,.10);
  background: #fff;
  border-radius: 16px;
  padding: 12px 14px;
  display: grid;
  gap: 4px;
  cursor: pointer;
  color: inherit;
}
.demo-role-btn strong { font-size: 14px; }
.demo-role-btn span { font-size: 13px; font-weight: 700; color: #f97316; }
.demo-role-btn small { color: #64748b; }
.demo-role-btn:hover { box-shadow: 0 12px 28px rgba(15,23,42,.10); transform: translateY(-1px); }
@media (max-width: 640px) {
  .demo-bottom-badge { bottom: 10px; font-size: 10px; padding: 8px 12px; max-width: calc(100% - 24px); white-space: normal; }
}