/* ============================================================
     TOKENS - palette sampled directly from the Kamari Namuah sign
     ============================================================ */
  :root{
    --blue:#2350A5;          /* royal blue of the physical sign */
    --blue-deep:#16336E;
    --blue-ink:#1B3F84;
    --blue-wash:#F1F4FB;
    --red:#ED052D;           /* logo red - fills, dots, marks */
    --red-ink:#C90425;       /* darker red for small text (contrast) */
    --ink:#0E1117;
    --ink-2:#3A3F4A;
    --muted:#6B7280;
    --paper:#FFFFFF;
    --paper-2:#F7F6F2;       /* off-white */
    --line:#E4E5EA;
    --line-2:#EFEFF2;
    --radius-s:8px;
    --radius-m:14px;
    --radius-l:22px;
    --font-display:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --ease:cubic-bezier(.16,.8,.24,1);
    color-scheme: light;
  }

  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
  body{
    margin:0;background:var(--paper);color:var(--ink);
    font-family:var(--font-body);font-size:16px;line-height:1.62;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}
  h1,h2,h3,h4{font-family:var(--font-display);margin:0;color:var(--ink);text-wrap:balance;}
  p{margin:0;}
  ul{margin:0;padding:0;}
  ::selection{background:var(--blue);color:#fff;}
  :focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:4px;}

  .wrap{max-width:1200px;margin:0 auto;padding-inline:clamp(20px,5vw,52px);}
  section{position:relative;scroll-margin-top:96px;}
  .pad{padding-block:clamp(3.6rem,7vw,6.5rem);}

  /* ---- shared type ---- */
  .label{
    font-family:var(--font-body);font-weight:700;font-size:.72rem;
    letter-spacing:.14em;text-transform:uppercase;color:var(--red-ink);
    display:inline-flex;align-items:center;gap:.65em;
  }
  .label-mark{width:20px;height:17px;flex:none;color:var(--red);}
  .label.on-blue{color:#fff;opacity:.92;}
  .label.on-blue .label-mark{color:var(--red);}

  .h2{font-size:clamp(2rem,2.6vw + 1.1rem,3.4rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin-top:1rem;}
  .lede{color:var(--ink-2);font-size:clamp(1rem,.35vw + .95rem,1.12rem);margin-top:1.1rem;max-width:52ch;}
  .head{max-width:640px;margin-bottom:clamp(2.4rem,4.5vw,3.6rem);}

  /* ---- buttons ---- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.55em;
    font-family:var(--font-body);font-weight:700;font-size:.97rem;
    padding:.92em 1.65em;border-radius:var(--radius-s);border:1.5px solid transparent;
    cursor:pointer;text-decoration:none;white-space:nowrap;
    transition:transform .2s var(--ease), background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
  }
  .btn svg{flex:none;transition:transform .2s ease;}
  .btn:hover{transform:translateY(-2px);}
  .btn:active{transform:translateY(0) scale(.985);}
  .btn-primary{background:var(--blue);color:#fff;}
  .btn-primary:hover{background:var(--blue-ink);box-shadow:0 12px 24px -14px rgba(35,80,165,.85);}
  .btn-ghost{background:transparent;color:var(--ink);border-color:var(--line);}
  .btn-ghost:hover{border-color:var(--ink);}
  .btn-white{background:#fff;color:var(--blue-deep);}
  .btn-white:hover{background:#F2F5FC;}
  .btn-outline-white{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
  .btn-outline-white:hover{border-color:#fff;background:rgba(255,255,255,.08);}
  .btn-block{width:100%;}
  .btn[disabled]{opacity:.5;cursor:not-allowed;}

  /* ============================================================
     NAV
     ============================================================ */
  header{
    position:sticky;top:0;z-index:80;background:var(--paper);
    border-bottom:1px solid transparent;
    transition:border-color .3s ease, box-shadow .3s ease;
  }
  header.is-scrolled{border-bottom-color:var(--line);box-shadow:0 8px 24px -20px rgba(14,17,23,.5);}
  .nav{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;padding-block:.85rem;transition:padding .3s ease;}
  header.is-scrolled .nav{padding-block:.6rem;}
  .brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;}
  .brand img{width:40px;height:40px;border-radius:50%;flex:none;}
  .brand b{font-family:var(--font-display);font-weight:800;font-size:1.02rem;line-height:1.1;letter-spacing:-.01em;display:block;}
  .brand small{display:block;font-family:var(--font-body);font-weight:600;font-size:.6rem;letter-spacing:.15em;color:var(--muted);text-transform:uppercase;margin-top:.15rem;}
  .nav-links{display:flex;align-items:center;gap:2rem;}
  .nav-links a{font-size:.91rem;font-weight:600;text-decoration:none;color:var(--ink-2);position:relative;padding-block:.2rem;transition:color .18s ease;}
  .nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--blue);transition:width .28s var(--ease);}
  .nav-links a:hover{color:var(--ink);}
  .nav-links a:hover::after{width:100%;}
  .nav-right{display:flex;align-items:center;gap:.7rem;}
  .nav-toggle{display:none;background:none;border:1.5px solid var(--line);border-radius:var(--radius-s);width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);}
  .mobile-menu{
    display:none;overflow:hidden;max-height:0;border-top:1px solid transparent;
    transition:max-height .42s var(--ease), border-color .3s ease;
  }
  .mobile-menu.open{max-height:420px;border-top-color:var(--line);}
  .mobile-inner{display:flex;flex-direction:column;gap:.2rem;padding-block:1rem 1.4rem;}
  .mobile-inner a{
    text-decoration:none;font-family:var(--font-display);font-weight:700;font-size:1.32rem;
    padding-block:.6rem;border-bottom:1px solid var(--line-2);
    opacity:0;transform:translateY(10px);transition:opacity .4s ease, transform .4s var(--ease);
  }
  .mobile-menu.open .mobile-inner a{opacity:1;transform:none;}
  .mobile-inner .btn{margin-top:1.1rem;}

  /* ============================================================
     HERO
     ============================================================ */
  .hero{padding-block:clamp(1.4rem,3.4vh,3rem) clamp(2.4rem,5vh,4.4rem);position:relative;}
  .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:clamp(2rem,4vw,3.6rem);align-items:center;}
  .hero h1{
    font-size:clamp(2.6rem,3.7vw + .9rem,4.6rem);font-weight:800;
    letter-spacing:-.035em;line-height:1.02;margin-top:1.1rem;
  }
  .hero h1 .ln{display:block;}
  .hero h1 .ln-quiet{color:var(--ink);}
  /* rotating word - absolutely positioned so the layout never shifts */
  /* the box is taller than a normal line so the descender of "penginapan" has
     room; the symmetric negative margins pull it back to exactly one line of
     flow, and matching the word's line-height to the box height keeps every
     baseline on the same rhythm */
  .rot{display:block;position:relative;height:1.34em;overflow:hidden;margin-block:-.16em;}
  .rot-word{
    position:absolute;left:0;top:0;white-space:nowrap;color:var(--blue);line-height:1.34;
    transform:translateY(105%);opacity:0;
    transition:transform .72s var(--ease), opacity .5s ease;
  }
  .rot-word.is-in{transform:translateY(0);opacity:1;}
  .rot-word.is-out{transform:translateY(-105%);opacity:0;}
  .hero-sub{color:var(--ink-2);font-size:clamp(1.02rem,.4vw + .95rem,1.16rem);margin-top:1.2rem;max-width:44ch;}
  .hero-cta{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:1.6rem;}
  .hero-trust{
    margin-top:1.2rem;font-size:.87rem;color:var(--muted);font-weight:500;
    display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  }
  .hero-trust b{color:var(--ink);font-weight:700;}
  .hero-trust .sep{width:4px;height:4px;border-radius:50%;background:var(--line);flex:none;}

  /* hero visual */
  .hero-visual{position:relative;width:100%;max-width:460px;justify-self:end;}
  .hero-photo{
    position:relative;border-radius:var(--radius-l);overflow:hidden;background:var(--blue);
    /* fixed height keeps the whole hero inside the first screen; the width
       follows the column so there is no dead space beside the copy */
    width:100%;height:min(600px,62vh);
  }
  .hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block;}
  .hero-tag{
    position:absolute;z-index:2;left:-14px;bottom:26px;background:var(--paper);
    border:1px solid var(--line);border-radius:var(--radius-m);
    padding:.85rem 1.15rem;box-shadow:0 20px 40px -26px rgba(14,17,23,.5);
    opacity:0;transform:translateY(14px);transition:opacity .6s ease .35s, transform .6s var(--ease) .35s;
  }
  .hero-photo.in + .hero-tag{opacity:1;transform:none;}
  .hero-tag b{display:block;font-family:var(--font-display);font-weight:800;font-size:.92rem;letter-spacing:-.01em;}
  .hero-tag span{display:block;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:.2rem;}


  /* ============================================================
     TRUST STATS
     ============================================================ */
  .stats{border-block:1px solid var(--line);background:var(--paper-2);}
  .stats-grid{display:grid;grid-template-columns:repeat(3,1fr);}
  .stat{padding:clamp(1.6rem,3vw,2.4rem) clamp(1rem,2.5vw,2rem);}
  .stat + .stat{border-left:1px solid var(--line);}
  .stat .n{font-family:var(--font-display);font-weight:800;font-size:clamp(1.9rem,2.4vw + .9rem,2.9rem);line-height:1;letter-spacing:-.03em;color:var(--blue);}
  .stat .l{font-size:.78rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-top:.6rem;}

  /* ============================================================
     LAYANAN
     ============================================================ */
  .svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;}
  .svc-lead{
    grid-column:span 2;grid-row:span 2;background:var(--blue);color:#fff;
    border-radius:var(--radius-l);padding:clamp(1.8rem,3.2vw,2.8rem);
    display:flex;flex-direction:column;position:relative;overflow:hidden;
    transition:transform .35s var(--ease);
  }
  /* soft light fall, deliberately edgeless - not a decorative blob */
  .svc-lead::after{
    content:"";position:absolute;right:-15%;bottom:-25%;width:70%;height:70%;pointer-events:none;
    background:radial-gradient(closest-side, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 100%);
  }
  .svc-lead:hover{transform:translateY(-5px);}
  .svc-lead .ic{width:56px;height:56px;border-radius:var(--radius-m);background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;color:#fff;}
  .svc-lead h3{color:#fff;font-size:clamp(1.5rem,1.4vw + 1.05rem,2.05rem);font-weight:800;letter-spacing:-.02em;margin-top:1.5rem;line-height:1.15;}
  .svc-lead p{color:rgba(255,255,255,.84);font-size:1rem;margin-top:.9rem;max-width:34ch;}
  .svc-lead .go{
    margin-top:auto;padding-top:1.8rem;display:inline-flex;align-items:center;gap:.5em;
    font-weight:700;font-size:.94rem;color:#fff;text-decoration:none;
  }
  .svc-lead .go .ar{transition:transform .28s var(--ease);}
  .svc-lead:hover .go .ar{transform:translateX(5px);}
  .svc-lead .pill{
    position:absolute;top:clamp(1.8rem,3.2vw,2.8rem);right:clamp(1.8rem,3.2vw,2.8rem);
    font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    background:rgba(255,255,255,.18);padding:.4em .8em;border-radius:999px;
  }
  .svc{
    background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-m);
    padding:1.5rem 1.4rem;display:flex;flex-direction:column;gap:.7rem;text-decoration:none;
    transition:transform .32s var(--ease), border-color .28s ease, box-shadow .32s ease;
  }
  .svc:hover{transform:translateY(-5px);border-color:var(--blue);box-shadow:0 18px 34px -26px rgba(14,17,23,.45);}
  .svc .ic{width:42px;height:42px;border-radius:10px;background:var(--blue-wash);color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none;transition:transform .3s var(--ease);}
  .svc:hover .ic{transform:translateY(-2px);}
  .svc h4{font-size:1.03rem;font-weight:700;letter-spacing:-.01em;}
  .svc p{color:var(--muted);font-size:.88rem;line-height:1.55;}
  .svc .ar{margin-top:auto;color:var(--blue);transition:transform .28s var(--ease);align-self:flex-start;}
  .svc:hover .ar{transform:translateX(5px);}

  /* ============================================================
     KENAPA - asymmetric
     ============================================================ */
  .why{background:var(--paper-2);border-block:1px solid var(--line);}
  .why-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;}
  .why-sticky{position:sticky;top:120px;}
  .why-list{border-top:1px solid var(--line);}
  .why-item{
    display:grid;grid-template-columns:auto 1fr;gap:1.4rem;align-items:start;
    padding:1.7rem .4rem 1.7rem 1.2rem;border-bottom:1px solid var(--line);
    position:relative;cursor:default;transition:padding-left .35s var(--ease);
  }
  .why-item::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--blue);
    transform:scaleY(0);transform-origin:top;transition:transform .45s var(--ease);
  }
  .why-item:hover{padding-left:1.7rem;}
  .why-item:hover::before{transform:scaleY(1);}
  .why-item .n{font-family:var(--font-display);font-weight:800;font-size:.9rem;color:var(--red-ink);padding-top:.28rem;}
  .why-item h3{font-size:1.18rem;font-weight:700;letter-spacing:-.01em;transition:color .25s ease;}
  .why-item:hover h3{color:var(--blue);}
  .why-item p{color:var(--muted);font-size:.94rem;margin-top:.4rem;max-width:46ch;}

  /* ============================================================
     TENTANG
     ============================================================ */
  .about-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;}
  .about-copy p{color:var(--ink-2);font-size:1.02rem;max-width:52ch;}
  .about-copy p + p{margin-top:1rem;}
  .bignum{
    border:1px solid var(--line);border-radius:var(--radius-l);padding:clamp(1.6rem,3vw,2.2rem);
    background:var(--paper);margin-bottom:1.8rem;
  }
  .bignum .v{font-family:var(--font-display);font-weight:800;font-size:clamp(3rem,5vw + 1rem,5rem);line-height:.95;letter-spacing:-.045em;color:var(--blue);}
  .bignum .k{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:.8rem;}
  .bignum .d{color:var(--ink-2);font-size:.94rem;margin-top:.9rem;padding-top:.9rem;border-top:1px solid var(--line-2);max-width:38ch;}
  .princ{display:flex;flex-direction:column;}
  .princ-item{display:grid;grid-template-columns:auto 1fr;gap:1.2rem;padding-block:1.25rem;border-top:1px solid var(--line);}
  .princ-item .n{font-family:var(--font-display);font-weight:800;font-size:.85rem;color:var(--red-ink);padding-top:.2rem;}
  .princ-item h4{font-size:1.02rem;font-weight:700;}
  .princ-item p{color:var(--muted);font-size:.9rem;margin-top:.3rem;max-width:44ch;}

  /* ============================================================
     JENIS PROPERTI
     ============================================================ */
  .ptypes{background:var(--ink);color:#fff;}
  .ptypes .h2{color:#fff;}
  .ptypes .lede{color:rgba(255,255,255,.66);}
  .ptype-list{display:flex;flex-wrap:wrap;gap:.6rem 2.4rem;margin-top:.6rem;}
  .ptype{
    position:relative;font-family:var(--font-display);font-weight:700;
    font-size:clamp(1.28rem,1.5vw + .85rem,2.05rem);letter-spacing:-.02em;
    color:rgba(255,255,255,.55);padding-block:.35rem;text-decoration:none;
    transition:color .3s ease;
  }
  .ptype::after{content:"";position:absolute;left:0;bottom:.15rem;width:0;height:2px;background:var(--red);transition:width .35s var(--ease);}
  .ptype:hover{color:#fff;}
  .ptype:hover::after{width:100%;}
  .ptypes-foot{margin-top:2.6rem;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;}
  .ptypes-foot p{color:rgba(255,255,255,.6);font-size:.92rem;max-width:38ch;}

  /* ============================================================
     PEKERJAAN - portfolio
     ============================================================ */
  .pf-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,2vw,1.5rem);}
  .pf-item{
    position:relative;display:block;aspect-ratio:4/3;border-radius:var(--radius-l);overflow:hidden;
    background:var(--paper-2);border:1px solid var(--line);text-decoration:none;
    transition:transform .38s var(--ease), box-shadow .38s ease;
  }
  .pf-item:hover{transform:translateY(-6px);box-shadow:0 26px 48px -30px rgba(14,17,23,.5);}
  .pf-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);}
  .pf-item:hover img{transform:scale(1.06);}
  .pf-ph{
    position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:.7rem;text-align:center;padding:1.4rem;
    background:
      repeating-linear-gradient(135deg,#F3F2EE 0 12px,#F7F6F2 12px 24px);
  }
  .pf-ph .ic{width:44px;height:44px;border-radius:12px;background:var(--paper);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);}
  .pf-ph b{font-size:.9rem;font-weight:700;color:var(--ink-2);}
  .pf-ph code{font-size:.72rem;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:.2em .5em;}
  .pf-meta{
    position:absolute;left:0;right:0;bottom:0;padding:1.3rem 1.4rem;color:#fff;
    background:linear-gradient(to top, rgba(14,17,23,.86) 0%, rgba(14,17,23,.5) 55%, rgba(14,17,23,0) 100%);
    opacity:0;transform:translateY(10px);transition:opacity .35s ease, transform .35s var(--ease);
  }
  .pf-item:hover .pf-meta{opacity:1;transform:none;}
  .pf-meta .cat{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);}
  .pf-meta b{display:block;font-family:var(--font-display);font-size:1.06rem;font-weight:700;margin-top:.25rem;}
  .pf-meta .go{display:inline-flex;align-items:center;gap:.4em;font-size:.82rem;font-weight:600;margin-top:.55rem;color:#fff;}
  .pf-foot{display:flex;justify-content:center;margin-top:2.4rem;}

  /* ============================================================
     TESTIMONI
     ============================================================ */
  .testi{background:var(--paper-2);border-block:1px solid var(--line);}
  .testi-head{max-width:620px;margin:0 auto clamp(2.4rem,4.5vw,3.4rem);text-align:center;}
  .testi-head .label{justify-content:center;}
  .testi-head .lede{margin-inline:auto;}
  .tcols{
    display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;height:min(640px,80vh);overflow:hidden;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 13%,#000 87%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0,#000 13%,#000 87%,transparent 100%);
  }
  .tcol{overflow:hidden;}
  .tcol-track{display:flex;flex-direction:column;gap:1.2rem;animation:tscroll var(--dur,16s) linear infinite;will-change:transform;}
  @keyframes tscroll{from{transform:translateY(0);}to{transform:translateY(var(--shift,-50%));}}
  .tcols:hover .tcol-track{animation-play-state:paused;}
  .tcard{
    background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-l);
    padding:1.6rem 1.5rem;transition:transform .3s var(--ease), box-shadow .3s ease, border-color .3s ease;
  }
  .tcard:hover{transform:translateY(-4px);border-color:#D8DAE1;box-shadow:0 18px 36px -28px rgba(14,17,23,.5);}
  .tcard p{color:var(--ink-2);font-size:.95rem;line-height:1.65;}
  .tcard .who{display:flex;align-items:center;gap:.75rem;margin-top:1.2rem;padding-top:1.1rem;border-top:1px solid var(--line-2);}
  .tcard .av{
    width:40px;height:40px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
    background:var(--blue-wash);color:var(--blue);font-family:var(--font-display);font-weight:800;font-size:.85rem;
  }
  .tcard .who b{display:block;font-size:.92rem;font-weight:700;}
  .tcard .who span{display:block;font-size:.78rem;color:var(--muted);}

  /* ============================================================
     CARA KERJA
     ============================================================ */
  .steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
  .steps::before{content:"";position:absolute;top:27px;left:12.5%;right:12.5%;height:2px;background:var(--line);}
  .steps::after{
    content:"";position:absolute;top:27px;left:12.5%;width:0;height:2px;
    background:var(--blue);transition:width 1.5s var(--ease);
  }
  .steps.is-visible::after{width:75%;}
  .step{position:relative;text-align:center;padding-inline:.9rem;}
  .step .n{
    width:54px;height:54px;border-radius:50%;background:var(--paper);border:2px solid var(--line);
    color:var(--muted);display:flex;align-items:center;justify-content:center;
    font-family:var(--font-display);font-weight:800;font-size:.92rem;
    margin:0 auto 1.2rem;position:relative;z-index:1;
    transition:background .45s ease, border-color .45s ease, color .45s ease;
  }
  .step.is-visible .n{background:var(--blue);border-color:var(--blue);color:#fff;}
  .step h4{font-size:1.02rem;font-weight:700;}
  .step p{color:var(--muted);font-size:.88rem;margin-top:.45rem;}

  /* ============================================================
     FAQ
     ============================================================ */
  .faq-list{border-top:1px solid var(--line);}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-q{
    width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
    padding:1.35rem .2rem;background:none;border:none;color:var(--ink);cursor:pointer;
    font-family:var(--font-display);font-weight:700;font-size:1.04rem;text-align:left;letter-spacing:-.01em;
    transition:color .2s ease;
  }
  .faq-q:hover{color:var(--blue);}
  .faq-ic{flex:none;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);transition:transform .35s var(--ease), background .3s ease, border-color .3s ease, color .3s ease;}
  .faq-item.open .faq-ic{transform:rotate(180deg);background:var(--blue);border-color:var(--blue);color:#fff;}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease);}
  .faq-a p{color:var(--ink-2);font-size:.96rem;padding:0 .2rem 1.5rem;max-width:66ch;}
  .faq-item.open .faq-a{max-height:320px;}

  /* ============================================================
     BOOKING
     ============================================================ */
  .book-cta{
    background:var(--blue-wash);border:1px solid #DCE4F5;border-radius:var(--radius-l);
    padding:clamp(1.8rem,4vw,3rem);display:grid;grid-template-columns:1.15fr .85fr;
    gap:clamp(1.5rem,3vw,2.6rem);align-items:center;
  }
  .book-cta h2{font-size:clamp(1.6rem,1.7vw + 1.05rem,2.3rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;}
  .book-cta p{color:var(--ink-2);margin-top:.85rem;max-width:44ch;}
  .book-cta .acts{display:flex;flex-direction:column;gap:.7rem;}
  .book-cta .note{font-size:.83rem;color:var(--muted);text-align:center;}

  .book-toggle{display:flex;justify-content:center;margin-top:2.6rem;}
  .book-toggle button{
    background:none;border:none;cursor:pointer;font-family:var(--font-body);font-weight:600;
    font-size:.92rem;color:var(--ink-2);display:inline-flex;align-items:center;gap:.5em;
    padding:.6em 1em;border-radius:var(--radius-s);transition:color .2s ease, background .2s ease;
  }
  .book-toggle button:hover{color:var(--ink);background:var(--paper-2);}
  .book-toggle .car{transition:transform .3s var(--ease);}
  .book-toggle button[aria-expanded="true"] .car{transform:rotate(180deg);}

  .book-panel{max-height:0;overflow:hidden;transition:max-height .55s var(--ease);}
  .book-panel.open{max-height:1200px;}
  .book-inner{
    margin-top:1.6rem;border:1px solid var(--line);border-radius:var(--radius-l);
    background:var(--paper);padding:clamp(1.6rem,3vw,2.4rem);max-width:760px;margin-inline:auto;
  }
  .f-group{margin-bottom:1.15rem;}
  .f-group label{display:block;font-size:.82rem;font-weight:700;margin-bottom:.45rem;}
  .f-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
  input[type=text],input[type=tel],input[type=date],input[type=time],input[type=number],textarea{
    width:100%;font-family:var(--font-body);font-size:.95rem;padding:.72em .9em;
    border-radius:var(--radius-s);border:1.5px solid var(--line);background:var(--paper);color:var(--ink);
    transition:border-color .2s ease;
  }
  input:focus,textarea:focus{border-color:var(--blue);outline:none;}
  textarea{resize:vertical;min-height:76px;}
  .pills{display:flex;flex-wrap:wrap;gap:.5rem;}
  .pills input{position:absolute;opacity:0;pointer-events:none;}
  .pills label{
    display:inline-flex;align-items:center;padding:.55em 1em;border-radius:999px;
    border:1.5px solid var(--line);font-size:.85rem;font-weight:600;cursor:pointer;color:var(--ink-2);
    margin:0;transition:all .18s ease;
  }
  .pills label:hover{border-color:var(--blue);}
  .pills input:checked + label{background:var(--blue);border-color:var(--blue);color:#fff;}
  .pills input:focus-visible + label{outline:3px solid var(--blue);outline-offset:3px;}

  .wa-prev{
    background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius-m);padding:1rem 1.1rem;
    font-size:.85rem;white-space:pre-wrap;color:var(--ink-2);max-height:170px;overflow-y:auto;
    margin-bottom:1.1rem;line-height:1.6;
  }
  .form-msg{font-size:.83rem;color:var(--red-ink);margin-top:.5rem;display:none;}
  .form-msg.show{display:block;}

  /* ============================================================
     FINAL CTA
     ============================================================ */
  .final{background:var(--blue);color:#fff;position:relative;overflow:hidden;}
  .final::before{
    content:"";position:absolute;inset:-30%;pointer-events:none;
    background:radial-gradient(38% 42% at 30% 35%, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 70%);
    animation:drift 34s ease-in-out infinite alternate;
  }
  @keyframes drift{from{transform:translate3d(-4%,-2%,0);}to{transform:translate3d(6%,4%,0);}}
  .final-inner{position:relative;text-align:center;max-width:640px;margin:0 auto;}
  .final h2{color:#fff;font-size:clamp(2.1rem,2.9vw + 1.1rem,3.6rem);font-weight:800;letter-spacing:-.03em;line-height:1.08;margin-top:1rem;}
  .final p{color:rgba(255,255,255,.8);margin-top:1.1rem;font-size:1.05rem;}
  .final .acts{display:flex;flex-wrap:wrap;justify-content:center;gap:.85rem;margin-top:2.1rem;}

  /* ============================================================
     FOOTER
     ============================================================ */
  footer{background:var(--ink);color:#B7BCC6;}
  .foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2.4rem;padding-block:clamp(2.8rem,5vw,4rem);}
  .foot-brand{display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;}
  .foot-brand img{width:42px;height:42px;border-radius:50%;}
  .foot-brand strong{font-family:var(--font-display);font-size:1.05rem;color:#fff;letter-spacing:-.01em;}
  .foot-brand span{display:block;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:#6F7684;margin-top:.15rem;}
  .foot-col h5{font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:#767D8B;margin-bottom:1rem;font-family:var(--font-body);font-weight:700;}
  .foot-col a,.foot-col p{display:block;color:#B7BCC6;text-decoration:none;font-size:.9rem;margin-bottom:.6rem;transition:color .18s ease;}
  .foot-col a:hover{color:#fff;}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.09);padding:1.25rem 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;font-size:.8rem;color:#767D8B;}

  /* ============================================================
     FLOATING WA
     ============================================================ */
  .fab{
    position:fixed;right:1.2rem;bottom:1.2rem;z-index:90;width:56px;height:56px;border-radius:50%;
    background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;
    box-shadow:0 14px 30px -10px rgba(0,0,0,.35);text-decoration:none;
    opacity:0;transform:translateY(14px) scale(.9);
    transition:opacity .5s ease, transform .28s var(--ease), box-shadow .25s ease;
  }
  .fab.in{opacity:1;transform:none;}
  .fab.in:hover{transform:scale(1.07);}
  .fab svg{width:28px;height:28px;}
  .fab .tip{
    position:absolute;right:calc(100% + .65rem);top:50%;transform:translateY(-50%) translateX(6px);
    background:var(--ink);color:#fff;font-weight:600;font-size:.78rem;padding:.45rem .8rem;border-radius:var(--radius-s);
    white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease, transform .2s ease;
  }
  .fab:hover .tip{opacity:1;transform:translateY(-50%) translateX(0);}

  /* ============================================================
     MOTION SYSTEM
     ============================================================ */
  .rev{opacity:0;transform:translateY(22px);transition:opacity .75s var(--ease), transform .75s var(--ease);}
  .rev.is-visible{opacity:1;transform:none;}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
  .rn{display:inline-flex;align-items:baseline;white-space:nowrap;font-variant-numeric:tabular-nums;}
  .rn-d{position:relative;display:inline-block;overflow:hidden;height:1em;width:.62em;vertical-align:baseline;}
  .rn-d .st{position:absolute;left:0;top:0;display:flex;flex-direction:column;transform:translateY(0);transition:transform 1.15s cubic-bezier(.16,.86,.22,1);will-change:transform;}
  .rn-d .st span{height:1em;line-height:1em;display:block;text-align:center;}

  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    .rev{opacity:1 !important;transform:none !important;transition:none !important;}
    .rot-word{transition:none !important;}
    .rn-d .st{transition:none !important;}
    .hero-photo{clip-path:none !important;transition:none !important;}
    .hero-photo img{transform:none !important;transition:none !important;}
    .hero-tag{opacity:1 !important;transform:none !important;}
    .tcol-track{animation:none !important;}
    .tcols{height:auto;-webkit-mask-image:none;mask-image:none;}
    .final::before{animation:none !important;}
    .fab{opacity:1;transform:none;transition:none;}
    .steps::after{transition:none !important;}
  }

  /* ============================================================
     RESPONSIVE
     ============================================================ */
  @media (max-width:1024px){
    .hero-grid{grid-template-columns:1fr;gap:2.6rem;}
    .hero-visual{max-width:460px;justify-self:start;}
    .hero-photo{height:auto;aspect-ratio:4/3;}
    .hero-photo img{object-position:center 40%;}
    .why-grid,.about-grid{grid-template-columns:1fr;}
    .why-sticky{position:static;}
    .book-cta{grid-template-columns:1fr;}
    .tcols{grid-template-columns:repeat(2,1fr);}
    .tcol:nth-child(3){display:none;}
  }
  @media (max-width:900px){
    .nav-links{display:none;}
    .nav-toggle{display:flex;}
    .mobile-menu{display:block;}
    .nav-right .btn-primary{display:none;}
    .svc-grid{grid-template-columns:repeat(2,1fr);}
    .svc-lead{grid-column:span 2;grid-row:span 1;}
    .steps{grid-template-columns:repeat(2,1fr);gap:2.2rem 0;}
    .steps::before,.steps::after{display:none;}
    .foot-grid{grid-template-columns:1fr 1fr;}
  }
  @media (max-width:640px){
    .stats-grid{grid-template-columns:1fr;}
    .stat + .stat{border-left:none;border-top:1px solid var(--line);}
    .svc-grid{grid-template-columns:1fr;}
    .svc-lead{grid-column:span 1;}
    .pf-grid{grid-template-columns:1fr;}
    .tcols{grid-template-columns:1fr;height:min(560px,74vh);}
    .tcol:nth-child(2),.tcol:nth-child(3){display:none;}
    .steps{grid-template-columns:1fr;gap:1.8rem;}
    .f-row{grid-template-columns:1fr;}
    .foot-grid{grid-template-columns:1fr;gap:1.8rem;}
    .hero-visual{display:flex;flex-direction:column;align-items:flex-start;}
    .hero-tag{position:static;margin-top:.85rem;}
    .hero-photo{width:100%;}
    .pf-meta{opacity:1;transform:none;}
  }
  @media (max-width:420px){
    .hero h1{font-size:2.35rem;}
  }