/*
Theme Name: Pari Spa
Theme URI: https://parispa.co.ke
Author: Amara Studio
Description: Dark, elegant spa & wellness theme for Pari Spa (Parklands, Nairobi): hero slider, services carousel, full price menu, packages, testimonials strip and FAQ accordion. Pairs with the Amara Booking plugin for online appointments.
Version: 1.9.6
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: amara
Tags: dark, one-page, salon, spa
*/

  /* ================= AMARA Schon-clone tokens ================= */
  .schon{
    --ink:#121214; --panel:#1A1A1E; --panel2:#232327;
    --cream:#F9F5F1; --cream2:#F1EAE1;
    --orange:#C9A24A; --orange-2:#B3892F; --wine:#7C1D2C; --wine-2:#5F1621;
    --white:#FFFFFF;
    --grey-d:#A6A6AB; --grey-dd:#77777D; --grey-l:#5E5E60;
    --line-d:rgba(255,255,255,.11); --line-l:rgba(18,18,20,.13);
    --shadow:0 26px 60px -28px rgba(0,0,0,.65);
    --serif:Optima,"Iowan Old Style",Georgia,"Times New Roman",serif;
    --sans:"Work Sans","Segoe UI",system-ui,Arial,sans-serif;
    --maxw:1280px; --pad:clamp(20px,4.5vw,40px);
    background:var(--ink); color:var(--grey-d);
    font-family:var(--sans); font-size:16px; line-height:1.75;
    -webkit-font-smoothing:antialiased; overflow-x:hidden;
  }
  .schon *{box-sizing:border-box}
  .schon p{margin:0}
  .schon img,.schon svg{max-width:100%;display:block}
  .schon a{color:inherit;text-decoration:none}
  .schon h1,.schon h2,.schon h3,.schon h4{margin:0;font-family:var(--serif);font-weight:500;line-height:1.16;color:var(--white);text-wrap:balance}
  .schon :focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:2px}
  .schon .wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
  .schon .eyebrow{display:inline-flex;align-items:center;gap:14px;font-family:var(--sans);color:var(--orange);text-transform:uppercase;font-size:15px;font-weight:500;letter-spacing:.08em}
  .schon .eyebrow .ey-line{width:44px;height:1px;background:var(--orange);flex:none}
  .schon .lotus-orn{display:flex;align-items:center;gap:12px;margin-top:10px}
  .schon .lotus-orn .lo-line{flex:none;width:90px;height:1px;background:var(--line-d)}
  .schon .lotus-orn svg{width:40px;height:26px;color:var(--orange);flex:none}
  .schon .btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
    padding:16px 32px;border-radius:56px;border:1px solid transparent;cursor:pointer;transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;white-space:nowrap}
  .schon .btn-orange{background:var(--orange);color:#fff}
  .schon .btn-orange:hover{background:var(--orange-2);transform:translateY(-2px)}
  .schon .btn-outline{background:transparent;color:var(--white);border-color:rgba(255,255,255,.35)}
  .schon .btn-outline:hover{border-color:var(--orange);color:var(--orange)}
  .schon .btn-dark{background:var(--ink);color:#fff}
  .schon .btn-dark:hover{background:#000;transform:translateY(-2px)}
  @media(hover:none){.schon .btn:hover{transform:none}}
  .schon .link-arrow{display:inline-flex;align-items:center;gap:10px;color:var(--white);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
  .schon .link-arrow .la{transition:transform .3s ease}
  .schon .link-arrow:hover{color:var(--orange)}
  .schon .link-arrow:hover .la{transform:translateX(6px)}
  .schon .on-cream .link-arrow{color:var(--ink)}
  .schon .on-cream .link-arrow:hover{color:var(--orange)}

  /* round arrow buttons + dark pill control */
  .schon .rnd{width:52px;height:52px;border-radius:50%;border:0;background:var(--panel2);color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .25s ease}
  .schon .rnd:hover{background:var(--orange)}
  .schon .rnd svg{width:18px;height:18px}
  .schon .pillbar{display:flex;align-items:center;gap:10px;background:var(--ink);border-radius:56px;padding:10px;width:max-content;box-shadow:var(--shadow)}
  .schon .pillbar .pb-thumb{width:46px;height:46px;border-radius:50%;overflow:hidden;flex:none}
  .schon .pillbar .pb-thumb img{width:100%;height:100%;object-fit:cover}
  .schon .pillbar .pb-meta{padding:0 18px 0 4px;line-height:1.3}
  .schon .pillbar .pb-k{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey-dd)}
  .schon .pillbar .pb-v{font-family:var(--serif);font-size:16px;color:#fff}

  /* ================= header ================= */
  .schon .hdr{position:fixed;top:0;left:0;right:0;z-index:80;background:transparent;border-bottom:1px solid transparent;transition:background .35s ease,border-color .3s ease,box-shadow .3s ease}
  .schon .hdr.stuck{background:var(--ink);border-bottom-color:var(--line-d);box-shadow:0 12px 30px -18px rgba(0,0,0,.8)}
  .schon .hdr-in{display:flex;align-items:center;gap:26px;min-height:88px}
  .schon .logo-chip{display:flex;align-items:center;gap:12px;background:var(--white);border-radius:12px;padding:12px 22px 12px 16px;position:relative;box-shadow:0 10px 26px -14px rgba(0,0,0,.6)}
  .schon .logo-chip::after{content:"";position:absolute;right:-4px;top:14%;height:72%;width:4px;background:var(--orange);border-radius:4px}
  .schon .logo-chip svg{width:34px;height:34px;color:var(--ink);flex:none}
  .schon .logo-chip .lc-name{font-family:var(--serif);font-size:24px;letter-spacing:.18em;color:var(--ink);line-height:1}
  .schon .logo-chip .lc-sub{display:block;font-family:var(--sans);font-size:8.5px;letter-spacing:.3em;color:var(--orange);text-transform:uppercase;margin-top:4px}
  .schon .nav{display:flex;gap:30px;margin-left:auto}
  .schon .nav a{font-size:14px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.85);padding:6px 0}
  .schon .nav a:hover{color:var(--orange)}
  .schon .cart{font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--white);white-space:nowrap}
  .schon .cart:hover{color:var(--orange)}
  .schon .hdr-cta{display:flex;align-items:center;gap:14px}
  .schon .hdr .btn{padding:14px 26px}
  .schon .dots-btn{width:48px;height:48px;border-radius:50%;border:0;background:var(--orange);cursor:pointer;display:grid;place-items:center;transition:background .3s ease;flex:none}
  .schon .dots-btn:hover{background:var(--orange-2)}
  .schon .dots-btn svg{width:18px;height:18px;color:#fff}
  .schon .mnav{display:none;flex-direction:column;padding:6px var(--pad) 24px;background:var(--panel);border-bottom:1px solid var(--line-d);position:relative;z-index:81}
  .schon .mnav a{padding:14px 4px;border-bottom:1px solid var(--line-d);color:var(--white);font-size:15px;text-transform:uppercase;letter-spacing:.05em}
  .schon .mnav .btn{margin-top:16px}
  .schon .mnav.open{display:flex}

  /* ================= 1. hero slider ================= */
  .schon .hero{position:relative;min-height:min(92vh,860px);display:flex;align-items:center;overflow:hidden}
  .schon .hero .slide{position:absolute;inset:0;display:flex;align-items:center;opacity:0;transition:opacity .9s ease;pointer-events:none;padding:clamp(120px,13vw,175px) 0 clamp(70px,9vw,120px)}
  .schon .hero .slide.active{opacity:1;pointer-events:auto}
  .schon .hero .slide .wrap{position:relative;z-index:2}
  .schon .hero .slide-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
  .schon .hero .slide-bg img{width:100%;height:100%;object-fit:cover}
  .schon .hero .slide-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,18,20,.92) 0%,rgba(18,18,20,.66) 40%,rgba(18,18,20,.28) 72%,rgba(18,18,20,.5) 100%)}
  .schon .hero .slide.active .slide-bg img{animation:hero-kenburns 8s ease-out both}
  @keyframes hero-kenburns{from{transform:scale(1.14)}to{transform:scale(1)}}
  /* hero copy rises into place on each slide activation (Schon "slideinup"), staggered */
  @keyframes hero-slideup{from{opacity:0;transform:translateY(80px)}to{opacity:1;transform:translateY(0)}}
  .schon .hero .slide.active .eyebrow{animation:hero-slideup 1.2s .2s ease both}
  .schon .hero .slide.active h1{animation:hero-slideup 1.2s .4s ease both}
  .schon .hero .slide.active .lede{animation:hero-slideup 1.2s .5s ease both}
  .schon .hero .slide.active .hero-cta{animation:hero-slideup 1.2s .8s ease both}
  /* hero WebGL displacement transition: canvas + scrim (added by fx.js when GL is available) */
  .schon .hero-gl-canvas{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block}
  .schon .hero.hero-gl .slide-bg{display:none}
  .schon .hero.hero-gl::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(18,18,20,.92) 0%,rgba(18,18,20,.66) 40%,rgba(18,18,20,.28) 72%,rgba(18,18,20,.5) 100%)}
  .schon .hero h1{font-size:clamp(44px,6.8vw,68px);margin:22px 0 0}
  .schon .hero .lede{margin-top:24px;max-width:52ch;font-size:16.5px}
  .schon .hero-cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:38px}
  .schon .hero-foot{position:absolute;left:0;right:0;bottom:0;z-index:5;display:flex;justify-content:flex-end;align-items:center;padding:0 var(--pad)}
  /* vertical social rail on the hero's left edge (Schon "WE SOCIAL" style) */
  .schon .hero-social-rail{position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:14px;padding:22px 12px;background:rgba(18,18,20,.32);backdrop-filter:blur(5px);border:1px solid var(--line-d);border-left:0;border-radius:0 16px 16px 0}
  .schon .hero-social-rail .rail-label{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);letter-spacing:.28em;text-transform:uppercase;font-size:10.5px;font-weight:600;color:var(--grey-d);margin-bottom:4px}
  .schon .hero-social-rail a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;border:1px solid var(--line-d);transition:background .25s ease,border-color .25s ease,transform .25s ease}
  .schon .hero-social-rail a:hover{background:var(--orange);border-color:var(--orange);transform:translateX(2px)}
  .schon .hero-social-rail a svg{width:17px;height:17px}
  /* clear the hero copy from the left social rail (desktop only; rail hidden on mobile) */
  @media(min-width:1121px){ .schon .hero .wrap{padding-left:calc(var(--pad) + 74px)} }
  .schon .hero-socials{display:flex;gap:8px;background:var(--cream);border-radius:20px 20px 0 0;padding:12px 22px}
  .schon .hero-socials a{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--ink);border:1px solid var(--line-l);font-size:12px;font-weight:600;transition:all .25s ease}
  .schon .hero-socials a:hover{background:var(--ink);color:#fff}
  .schon .hero-count{display:flex;align-items:center;gap:18px;background:var(--panel2);border-radius:20px 20px 0 0;padding:10px 24px}
  .schon .hero-count .hc{font-family:var(--serif);font-size:30px;color:#fff}
  .schon .hero-count .hc small{font-size:14px;color:var(--grey-dd)}
  .schon .hero-count .rnd{width:44px;height:44px}
  .schon .hero-arrow{position:absolute;right:26px;bottom:120px;width:2px;height:90px;background:linear-gradient(var(--orange),transparent);z-index:4}
  .schon .wm{position:absolute;z-index:0;font-family:var(--serif);font-size:clamp(110px,19vw,250px);line-height:1;color:rgba(255,255,255,.04);white-space:nowrap;pointer-events:none;user-select:none}
  .schon .hero .wm{right:-2%;bottom:2%}

  /* ================= 2. about ================= */
  .schon .sec{position:relative;padding:clamp(66px,9vw,110px) 0;overflow:hidden}
  .schon .about-grid{position:relative;z-index:1;display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,4.5vw,60px);align-items:start}
  .schon .about-left h2{font-size:clamp(38px,5.4vw,60px);margin-top:18px}
  /* About photos: image scales in as the column reveals (Schon "image scale" entrance) */
  .schon .ph-reveal{overflow:hidden}
  .schon .ph-reveal img{transform:scale(1.28)}
  .schon .reveal.in .ph-reveal img{transform:scale(1)}
  .schon .reveal.in .ph-reveal:hover img{transform:scale(1.06)}
  .schon .about-left .ph-tall{margin-top:30px;border-radius:14px;overflow:hidden;aspect-ratio:3/3.4;box-shadow:var(--shadow)}
  .schon .about-left .ph-tall img,.schon .about-right .ph-wide img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
  .schon .about-left .ph-tall:hover img,.schon .about-right .ph-wide:hover img{transform:scale(1.05)}
  .schon .about-right .ph-wide{border-radius:14px;overflow:hidden;aspect-ratio:16/10.5;box-shadow:var(--shadow)}
  .schon .about-mid{display:flex;align-items:center;gap:26px;margin:26px 0}
  .schon .spin-badge{position:relative;width:150px;height:150px;flex:none}
  .schon .spin-badge .sb-text{position:absolute;inset:0;animation:schon-spin 16s linear infinite}
  .schon .spin-badge .sb-core{position:absolute;inset:30px;border-radius:50%;background:var(--orange);display:grid;place-items:center;font-family:var(--serif);font-size:34px;color:#fff}
  @keyframes schon-spin{to{transform:rotate(360deg)}}
  .schon .about-copy{font-size:15.5px;max-width:52ch}
  .schon .about-stats{display:flex;align-items:center;gap:22px;margin-top:26px;flex-wrap:wrap}
  .schon .rate-pill{display:flex;align-items:center;gap:12px;border:1px solid var(--line-d);border-radius:56px;padding:10px 20px}
  .schon .rate-pill .rp-n{font-family:var(--serif);font-size:24px;color:#fff}
  .schon .rate-pill .stars{color:var(--orange);letter-spacing:2px;font-size:13px}
  .schon .clients{font-size:13px;letter-spacing:.06em;text-transform:uppercase}
  .schon .clients b{display:block;font-family:var(--serif);font-size:24px;color:#fff;font-weight:500;letter-spacing:0;text-transform:none}
  .schon .about-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}

  /* ================= 3. counters ================= */
  .schon .count-row{border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
  .schon .count-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
  .schon .cnt{padding:34px 20px;text-align:center;border-right:1px solid var(--line-d)}
  .schon .cnt:last-child{border-right:0}
  .schon .cnt .n{font-family:var(--serif);font-size:clamp(32px,3.6vw,46px);color:#fff;font-variant-numeric:tabular-nums}
  .schon .cnt .n b{color:var(--orange);font-weight:500}
  .schon .cnt .l{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey-dd);margin-top:6px}

  /* ================= 4. services carousel ================= */
  .schon .svc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:26px;flex-wrap:wrap;margin-bottom:50px}
  .schon .svc-head h2{font-size:clamp(30px,4.2vw,44px);margin-top:14px}
  .schon .svc-head p{max-width:46ch;font-size:15.5px}
  .schon .svc-stage{position:relative;z-index:1;display:grid;grid-template-columns:.9fr 1.2fr .9fr;gap:clamp(20px,3vw,40px);align-items:center}
  .schon .svc-photos{display:grid;gap:18px}
  .schon .svc-photos .sp{border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
  .schon .svc-photos .sp img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3.4;transition:transform .8s ease}
  .schon .svc-photos .sp:hover img{transform:scale(1.06)}
  .schon .svc-circle{width:100%;max-width:430px;aspect-ratio:1;margin:0 auto;border-radius:50%;background:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:11%;gap:10px;position:relative}
  .schon .svc-circle svg{width:46px;height:46px;color:var(--orange)}
  .schon .svc-circle h3{color:var(--ink);font-size:clamp(24px,2.6vw,32px);transition:opacity .3s ease}
  .schon .svc-circle p{color:var(--grey-l);font-size:14px;max-width:30ch}
  .schon .svc-circle .cc-meta{font-family:var(--serif);color:var(--ink);font-size:17px}
  .schon .svc-circle .cc-meta b{color:var(--orange);font-weight:500}
  .schon .svc-circle .btn{margin-top:8px;padding:12px 26px;font-size:12px}
  .schon .svc-circle.fading h3,.schon .svc-circle.fading p,.schon .svc-circle.fading .cc-meta{opacity:.15}
  .schon .svc-list{list-style:none;margin:0;padding:0}
  .schon .svc-list li{border-bottom:1px solid var(--line-d)}
  .schon .svc-list button{width:100%;background:none;border:0;cursor:pointer;display:flex;align-items:baseline;gap:16px;padding:20px 6px;font-family:var(--serif);font-size:clamp(20px,2.2vw,27px);color:var(--grey-dd);transition:color .3s ease,padding-left .3s ease;text-align:left}
  .schon .svc-list button .no{font-family:var(--sans);font-size:13px;letter-spacing:.08em}
  .schon .svc-list li.on button{color:#fff;padding-left:16px}
  .schon .svc-list li.on button .no{color:var(--orange)}
  .schon .svc-list button:hover{color:var(--orange)}
  .schon .svc-book{margin-top:26px}

  /* ================= 5. promo + marquee ================= */
  .schon .promo{background:var(--cream)}
  .schon .promo-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
  .schon .offer{position:relative;border-radius:18px;overflow:hidden;padding:clamp(28px,4vw,48px);min-height:280px;display:flex;flex-direction:column;justify-content:center;gap:10px}
  .schon .offer .of-tag{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
  .schon .offer h3{font-size:clamp(26px,3.2vw,38px)}
  .schon .offer .of-note{font-size:14px}
  .schon .offer .btn{width:max-content;margin-top:12px}
  .schon .offer-a{background:linear-gradient(115deg,#1E1B18 30%,#3A2C1E 100%);color:var(--grey-d)}
  .schon .offer-a .of-tag{color:var(--orange)}
  .schon .offer-a img{position:absolute;right:-4%;bottom:0;width:44%;max-height:100%;object-fit:cover;border-radius:14px 0 0 0;opacity:.92}
  .schon .offer-b{background:var(--orange);color:rgba(255,255,255,.92)}
  .schon .offer-b .of-tag{color:#fff}
  .schon .offer-b h3{color:#fff}
  .schon .marquee{border-top:1px solid var(--line-l);margin-top:46px;padding:20px 0;overflow:hidden}
  .schon .mq-track{display:flex;width:max-content;white-space:nowrap;animation:schon-mq 30s linear infinite}
  .schon .mq-track.rev{animation-direction:reverse}
  .schon .mq-track span{font-family:var(--serif);font-size:clamp(24px,3.4vw,40px);color:var(--ink);padding:0 18px;display:inline-flex;align-items:center;gap:34px}
  .schon .mq-track span i{font-style:normal;color:var(--orange);font-size:.7em}
  .schon .mq-track.ghost span{color:transparent;-webkit-text-stroke:1px rgba(18,18,20,.35)}
  @keyframes schon-mq{to{transform:translateX(-50%)}}

  /* ================= 6. face & body care ================= */
  .schon .fb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line-d)}
  .schon .fb{padding:30px 26px 40px;border-right:1px solid var(--line-d);text-align:center}
  .schon .fb:last-child{border-right:0}
  .schon .fb-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line-d);padding-bottom:18px;margin-bottom:26px}
  .schon .fb-head h3{font-size:clamp(22px,2.4vw,30px);text-align:left}
  .schon .fb-head .heart{color:var(--grey-dd);transition:color .3s ease;cursor:pointer;background:none;border:0}
  .schon .fb-head .heart:hover{color:var(--orange)}
  .schon .fb-head .heart svg{width:20px;height:20px}
  .schon .fb .fb-ph{border-radius:14px;overflow:hidden;aspect-ratio:1/1.1;margin:0 auto;max-width:300px}
  .schon .fb .fb-ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
  .schon .fb:hover .fb-ph img{transform:scale(1.06)}
  .schon .fb .fb-meta{margin-top:18px;font-family:var(--serif);font-size:17px;color:#fff}
  .schon .fb .fb-meta b{color:var(--orange);font-weight:500}
  .schon .browse-all{display:flex;justify-content:center;margin-top:44px}

  /* ================= 7. portfolio carousel ================= */
  .schon .port{background:var(--cream)}
  .schon .port .sec-head-c{text-align:center;margin-bottom:50px}
  .schon .port .sec-head-c h2{color:var(--ink);font-size:clamp(30px,4.4vw,46px);margin-top:14px}
  /* collage carousel (Schon "projectSlide"): each slide = 4 scattered photos
     around a number + title; geometry taken from the Schon demo (card 1308x1027) */
  /* VERTICAL slider (Schon uses swiper-vertical here): the cards stack below
     each other with a 10px gap and the window glides up/down between
     categories at Schon's speed (1.8s) */
  .schon .pcar{position:relative;overflow:hidden;aspect-ratio:1308/1027}
  .schon .pcar-track{display:flex;flex-direction:column;gap:10px;transition:transform 1.8s cubic-bezier(.25,.1,.25,1)}
  .schon .pcard{flex:0 0 auto;width:100%;position:relative;aspect-ratio:1308/1027}
  .schon .pc-img{position:absolute;margin:0;border-radius:16px;overflow:hidden;box-shadow:0 20px 44px -24px rgba(18,18,20,.4)}
  .schon .pc-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
  .schon .pc-img:hover img{transform:scale(1.06)}
  .schon .pc-1{left:0;top:0;width:21.7%;aspect-ratio:284/341}
  .schon .pc-2{left:59.6%;top:0;width:40.4%;aspect-ratio:529/455}
  .schon .pc-3{left:7.6%;top:53%;width:21.7%;aspect-ratio:284/341}
  .schon .pc-4{left:71.4%;top:66.8%;width:21.7%;aspect-ratio:284/341}
  .schon .pc-content{position:absolute;left:12.3%;top:35.7%;max-width:42%}
  .schon .pc-no{font-family:var(--serif);font-size:clamp(17px,1.9vw,25px);color:var(--grey-l)}
  .schon .pc-content h3{color:var(--ink);font-size:clamp(28px,4vw,52px);margin-top:6px}
  .schon .pc-zoom{position:absolute;right:10px;top:10px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(249,245,241,.94);color:var(--ink);display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .25s ease,background .25s ease}
  .schon .pc-zoom svg{width:18px;height:18px}
  .schon .pc-zoom:hover{background:var(--wine);color:#fff}
  .schon .pc-img:hover .pc-zoom,.schon .pc-zoom:focus-visible{opacity:1}
  @media(hover:none){.schon .pc-zoom{opacity:1}}
  /* centered dark pill control floating over the collage (Schon-style) */
  .schon .pcar-pill{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:6}
  .schon .pcar-pill .pb-thumb{width:76px;height:50px;border-radius:12px}
  .schon .pcar-pill .pb-v{white-space:nowrap}
  /* Mobile (<=700px): the wide desktop collage (aspect 1308/1027 + absolutely
     positioned scattered photos) crushes to a ~260px-tall card on phones. Reflow
     each category into a 2-column photo grid with the title on top and drop the
     carousel: all four cards stack and the floating pill control is hidden. This
     mirrors how Schon reflows its projectSlide into a tall 2-col card on mobile.
     The carousel JS re-measures card height on resize, so transform:none!important
     simply freezes the track here (inline transform has no !important, so it loses). */
  @media(max-width:700px){
    .schon .pcar{aspect-ratio:auto;height:auto;overflow:visible}
    .schon .pcar-track{transform:none!important;gap:34px}
    .schon .pcard{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
    .schon .pc-img,.schon .pc-1,.schon .pc-2,.schon .pc-3,.schon .pc-4{position:relative;left:auto;top:auto;width:auto;aspect-ratio:4/5}
    .schon .pc-2,.schon .pc-4{margin-top:26px}      /* subtle Schon-style stagger on the right column */
    .schon .pc-content{position:static;left:auto;top:auto;max-width:none;grid-column:1 / -1;order:-1;margin-bottom:2px}
    .schon .pc-content h3{font-size:clamp(24px,7vw,34px)}
    .schon .pcar-pill{display:none}
  }

  /* ================= 8. statement / video ================= */
  .schon .stmt{position:relative;min-height:clamp(560px,64vw,720px);display:flex;align-items:flex-start;overflow:hidden}
  .schon .stmt .stmt-ripples{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center}
  .schon .stmt::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(18,18,20,.42),rgba(18,18,20,.34) 42%,rgba(18,18,20,.72) 92%)}
  .schon .stmt .wrap{position:relative;z-index:2;pointer-events:none;padding-top:clamp(48px,7vw,84px);width:100%;text-align:center}
  .schon .stmt .face-ico{width:56px;height:56px;color:var(--orange);margin:0 auto 18px}
  .schon .stmt h2{font-size:clamp(34px,5.4vw,62px)}
  .schon .stmt h2 em{font-style:normal;color:var(--orange)}
  /* the play button IS one more ball: big frosted circle that bobs up and
     down (Schon's jumpAni: 0 -> -30px at 40% -> 0) */
  .schon .stmt .play{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);z-index:5;width:clamp(180px,19vw,275px);height:clamp(180px,19vw,275px);border-radius:50%;border:0;background:rgba(255,255,255,.24);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 26px 60px -22px rgba(0,0,0,.55);animation:play-jump 3.2s ease-in-out infinite}
  .schon .stmt .play svg{width:clamp(44px,5vw,62px);height:clamp(44px,5vw,62px);margin-left:6px}
  @keyframes play-jump{0%,100%{transform:translate(-50%,-50%)}40%{transform:translate(-50%,calc(-50% - 30px))}}
  /* physics mode: the play joins the Matter.js sim as one more (bigger) ball;
     the bob animation must be OFF (it animates transform and would override
     the JS-driven position), and transition:none for the same reason as .oc */
  .schon .stmt .play.physics-ball{left:0;top:0;transform:translate(-9999px,-9999px);animation:none;transition:none!important;will-change:transform;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;z-index:6}
  /* offer "pack" circles that drop into the frame */
  .schon .stmt .offer-circles{position:absolute;left:0;right:0;bottom:clamp(16px,2.6vw,32px);z-index:4;display:flex;justify-content:center;flex-wrap:wrap;gap:clamp(10px,1.8vw,24px);padding:0 var(--pad);pointer-events:none}
  .schon .stmt .oc{flex:0 0 auto;width:clamp(170px,18vw,255px);height:clamp(170px,18vw,255px);min-width:0;box-sizing:border-box;border-radius:50%;display:grid;place-items:center;text-align:center;padding:26px;overflow:hidden;box-shadow:0 22px 46px -18px rgba(0,0,0,.6)}
  .schon .stmt .oc span{font-size:clamp(11px,1vw,14px);line-height:1.32;text-transform:uppercase;letter-spacing:.03em}
  .schon .stmt .oc b{display:block;font-family:var(--serif);text-transform:none;letter-spacing:0;font-size:clamp(18px,1.9vw,25px);margin-bottom:6px}
  .schon .stmt .oc-a{background:var(--cream);color:var(--ink)}
  .schon .stmt .oc-b{background:var(--wine);color:#fff}
  .schon .stmt .oc-c{background:var(--orange);color:#3a2a00}
  .schon .stmt .oc-d{background:#EAD9C6;color:var(--ink)}
  .schon .stmt .offer-circles.reveal .oc{opacity:0;transform:translateY(-150px)}
  .schon .stmt .offer-circles.reveal.in .oc{opacity:1;transform:translateY(0);transition:opacity .5s ease,transform .95s cubic-bezier(.3,1.35,.5,1)}
  .schon .stmt .offer-circles.reveal.in .oc-a{transition-delay:.05s}
  .schon .stmt .offer-circles.reveal.in .oc-b{transition-delay:.18s}
  .schon .stmt .offer-circles.reveal.in .oc-c{transition-delay:.31s}
  .schon .stmt .offer-circles.reveal.in .oc-d{transition-delay:.44s}
  /* physics mode (Matter.js): balls become absolutely-positioned + draggable */
  .schon .stmt .offer-circles.physics-on{position:absolute;inset:0;bottom:0;display:block;padding:0;overflow:hidden;pointer-events:none;z-index:6}
  /* transition:none is CRITICAL here: the .reveal.in rule above adds a bouncy
     transform transition that would otherwise smooth every physics frame ->
     balls lag ~1s behind the engine and dragging feels dead/frozen */
  .schon .stmt .offer-circles.physics-on .oc{position:absolute;top:0;left:0;margin:0;opacity:1;transform:translate(-9999px,-9999px);transition:none!important;will-change:transform;pointer-events:auto;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 24px 44px -18px rgba(0,0,0,.7)}
  @media(max-width:700px){
    /* On phones the packages become small GLASS MARBLES ("canicas"). Two layouts:
       - default (physics off / prefers-reduced-motion): a tidy static 2x2 stack;
       - .stmt.physics-live (Matter.js on, class added by fx.js): the marbles are
         absolute bodies that fall + pile in the base-height frame, so we keep the
         frame tall and just shrink the balls + play.
       The glass look (radial sheen + inset rims) lives on ::after so the
       physics-on .oc box-shadow (outer drop) never clobbers it, and both modes
       show ALL FOUR packages. */
    .schon .stmt h2{font-size:clamp(22px,6.5vw,30px);line-height:1.24}
    .schon .stmt .play svg{width:26px;height:26px}
    /* frosted glass play button + glossy marble sheen (shared by both modes) */
    .schon .stmt .play{animation:none;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.5),rgba(255,255,255,.1) 48%);box-shadow:inset -5px -7px 12px rgba(0,0,0,.3),inset 4px 5px 10px rgba(255,255,255,.35),0 16px 30px -12px rgba(0,0,0,.55)}
    .schon .stmt .oc::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.6),rgba(255,255,255,0) 46%);box-shadow:inset -6px -9px 15px rgba(0,0,0,.32),inset 5px 6px 12px rgba(255,255,255,.24)}
    .schon .stmt .oc>span{position:relative;z-index:1}
    .schon .stmt .oc-c,.schon .stmt .oc-d{display:grid}

    /* -- fallback (physics off): tidy vertical stack, headline -> play -> 2x2 -- */
    .schon .stmt:not(.physics-live){min-height:auto;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:clamp(46px,11vw,66px) 0 clamp(30px,7vw,42px)}
    .schon .stmt:not(.physics-live) .wrap{position:relative;padding-top:0}
    .schon .stmt:not(.physics-live) .play{position:static;transform:none;margin:clamp(30px,8vw,44px) 0 clamp(22px,6vw,32px);width:78px;height:78px}
    .schon .stmt:not(.physics-live) .offer-circles{position:static;transform:none;left:auto;right:auto;bottom:auto;width:212px;max-width:calc(100% - 40px);margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;padding:0}
    .schon .stmt:not(.physics-live) .oc{position:relative;flex:0 0 auto;width:90px;height:90px;padding:9px}
    .schon .stmt:not(.physics-live) .oc b{font-size:11px;margin-bottom:1px}
    .schon .stmt:not(.physics-live) .oc span{font-size:9px;line-height:1.22}

    /* -- physics on: small marbles that fall + pile in the fixed-height frame -- */
    .schon .stmt.physics-live{min-height:clamp(520px,140vw,640px)}
    .schon .stmt.physics-live .play{width:78px;height:78px}
    .schon .stmt.physics-live .offer-circles{width:auto;max-width:none;margin:0}
    .schon .stmt.physics-live .oc{width:78px;height:78px;padding:7px}
    .schon .stmt.physics-live .oc b{font-size:10px;margin-bottom:1px}
    .schon .stmt.physics-live .oc span{font-size:8px;line-height:1.18}
  }

  /* ================= 9. gallery ================= */
  .schon .gal-head{display:flex;align-items:flex-end;justify-content:space-between;gap:26px;flex-wrap:wrap;margin-bottom:46px}
  .schon .gal-head h2{font-size:clamp(30px,4.2vw,44px);margin-top:14px}
  .schon .gal-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;gap:16px}
  .schon .gtile{position:relative;border-radius:14px;overflow:hidden}
  .schon .gtile img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
  .schon .gtile:hover img{transform:scale(1.07)}
  .schon .gtile .glabel{position:absolute;left:12px;bottom:12px;background:var(--cream);color:var(--ink);border-radius:56px;padding:7px 16px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
  .schon .g-a{grid-column:span 2;grid-row:span 2}
  .schon .g-c{grid-row:span 2}

  /* ================= 10. testimonials ================= */
  .schon .test{background:linear-gradient(180deg,var(--cream) 0%,var(--cream) 42%,var(--ink) 42%)}
  .schon .test .sec-head-c{text-align:center;margin-bottom:46px}
  .schon .test .sec-head-c h2{color:var(--ink);font-size:clamp(30px,4.4vw,46px);margin-top:14px}
  .schon .t-strip{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 6px 16px;scrollbar-width:none}
  .schon .t-strip::-webkit-scrollbar{display:none}
  .schon .t-card{flex:0 0 min(400px,84vw);scroll-snap-align:start;background:#fff;border-radius:18px;padding:30px 30px 26px;position:relative;overflow:hidden;box-shadow:0 20px 44px -26px rgba(18,18,20,.35)}
  .schon .t-card .stars{color:var(--orange);letter-spacing:3px;font-size:15px;margin-bottom:14px}
  .schon .t-card h3{color:var(--ink);font-size:21px;margin-bottom:12px}
  .schon .t-card blockquote{margin:0;color:var(--grey-l);font-size:14.5px;line-height:1.7}
  .schon .t-card .t-who{display:flex;align-items:center;gap:12px;margin-top:20px}
  .schon .t-card .t-who img{width:44px;height:44px;border-radius:10px;object-fit:cover}
  .schon .t-card .t-who .tn{font-family:var(--serif);font-size:17px;color:var(--ink)}
  .schon .t-card .t-who .tr{font-size:12px;color:var(--grey-l)}
  .schon .t-card .t-leaf{position:absolute;right:6px;bottom:-6px;width:110px;color:var(--orange);opacity:.25}
  .schon .t-foot{display:flex;align-items:center;gap:22px;margin-top:34px}
  .schon .t-bar{flex:1;height:2px;background:rgba(255,255,255,.18);border-radius:2px;overflow:hidden}
  .schon .t-bar .t-fill{height:100%;width:25%;background:var(--orange);border-radius:2px;transition:width .3s ease}
  .schon .t-nav{display:flex;gap:10px}

  /* ================= 11. team ================= */
  .schon .team-head{display:flex;align-items:flex-end;justify-content:space-between;gap:26px;flex-wrap:wrap;margin-bottom:46px}
  .schon .team-head h2{font-size:clamp(30px,4.2vw,44px);margin-top:14px}
  .schon .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .schon .tm{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:3/3.7;background:var(--cream2)}
  .schon .tm img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
  .schon .tm:hover img{transform:scale(1.05)}
  .schon .tm .tm-info{position:absolute;left:12px;right:12px;bottom:12px;background:rgba(18,18,20,.78);backdrop-filter:blur(6px);border-radius:12px;padding:12px 16px;transform:translateY(8px);opacity:0;transition:all .35s ease}
  .schon .tm:hover .tm-info,.schon .tm:focus-within .tm-info{transform:none;opacity:1}
  .schon .tm .tm-info .tn{font-family:var(--serif);font-size:18px;color:#fff}
  .schon .tm .tm-info .tr{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange)}
  @media(hover:none){.schon .tm .tm-info{transform:none;opacity:1}}

  /* ================= 12. appointment (cta + booking) ================= */
  .schon .appt-band{text-align:center;max-width:820px;margin:0 auto clamp(44px,6vw,64px)}
  .schon .appt-band h2{font-size:clamp(32px,4.8vw,52px)}
  .schon .appt-band p{margin:18px auto 0;max-width:56ch;font-size:16px}
  .schon .book-wm{left:-1%;bottom:0}
  .schon .booking{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr .9fr;border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
  .schon .bk-form{background:var(--cream);padding:clamp(24px,3.4vw,42px)}
  .schon .bk-form h3{color:var(--ink);font-size:26px;margin-bottom:6px}
  .schon .bk-form .bk-sub{color:var(--grey-l);font-size:13.5px;margin-bottom:24px}
  .schon .fld{margin-bottom:18px}
  .schon .fld label{display:block;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);margin-bottom:8px}
  .schon .fld .hint{display:block;margin-top:6px;font-size:12px;color:var(--grey-l);text-transform:none;letter-spacing:0}
  .schon .row-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .schon .booking select,.schon .booking input,.schon .booking textarea{
    width:100%;font-family:var(--sans);font-size:15px;color:var(--ink);background:#fff;
    border:1px solid #E3DBCF;border-radius:12px;padding:13px 15px;transition:border-color .25s ease,box-shadow .25s ease}
  .schon .booking select:hover,.schon .booking input:hover,.schon .booking textarea:hover{border-color:var(--orange)}
  .schon .booking select:focus,.schon .booking input:focus,.schon .booking textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,117,43,.18)}
  .schon .booking select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--orange) 50%),linear-gradient(135deg,var(--orange) 50%,transparent 50%);background-position:calc(100% - 20px) center,calc(100% - 14px) center;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:40px}
  .schon .booking textarea{resize:vertical;min-height:64px}
  .schon .booking input::placeholder,.schon .booking textarea::placeholder{color:#A79C8C}
  .schon .chips{display:flex;flex-wrap:wrap;gap:10px}
  .schon .chip{font-family:var(--sans);font-size:14px;color:var(--ink);background:#fff;border:1px solid #E3DBCF;border-radius:56px;padding:10px 18px;cursor:pointer;transition:all .22s ease;font-variant-numeric:tabular-nums}
  .schon .chip:hover{border-color:var(--orange);color:var(--orange)}
  .schon .chip[aria-pressed="true"]{background:var(--orange);color:#fff;border-color:var(--orange);font-weight:600}
  .schon .bk-form .btn-orange{width:100%;margin-top:8px;padding:17px}
  .schon .form-note{font-size:12.5px;color:var(--grey-l);margin-top:14px;text-align:center}
  .schon .form-note b{color:var(--ink);font-weight:600}
  .schon .bk-sum{background:var(--ink);padding:clamp(24px,3.4vw,42px);border-left:1px solid var(--line-d)}
  .schon .bk-sum h3{font-size:24px}
  .schon .sum-list{list-style:none;padding:0;margin:20px 0 0}
  .schon .sum-list li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line-d);font-size:14.5px}
  .schon .sum-list .k{color:var(--grey-d)}
  .schon .sum-list .v{color:var(--white);font-weight:500;text-align:right}
  .schon .sum-list .v.empty{color:var(--grey-dd);font-weight:400;font-style:italic}
  .schon .sum-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:22px}
  .schon .sum-total .k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey-d)}
  .schon .sum-total .v{font-family:var(--serif);font-size:36px;color:var(--orange)}
  .schon .trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px}
  .schon .trust span{display:inline-flex;gap:8px;align-items:center;font-size:12.5px;color:var(--grey-d)}
  .schon .trust svg{width:16px;height:16px;color:var(--orange)}
  .schon .booking.done .bk-form,.schon .booking.done .bk-sum{display:none}
  .schon .success{display:none;grid-column:1/-1;background:var(--cream);padding:clamp(34px,5vw,60px);text-align:center}
  .schon .booking.done .success{display:block}
  .schon .success .tick{width:76px;height:76px;border-radius:50%;margin:0 auto 20px;display:grid;place-items:center;background:var(--orange);color:#fff}
  .schon .success .tick svg{width:36px;height:36px}
  .schon .success h3{color:var(--ink);font-size:clamp(26px,3.2vw,36px)}
  .schon .success p{color:var(--grey-l);margin:14px auto 0;max-width:46ch}
  .schon .success .recap{margin:24px auto 0;max-width:430px;text-align:left;background:#fff;border:1px solid #E3DBCF;border-radius:14px;padding:18px 22px}
  .schon .success .recap div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;font-size:14.5px;color:var(--ink)}
  .schon .success .recap .k{color:var(--grey-l)}
  .schon .success .btn{margin-top:24px}

  /* ================= 13. faq ================= */
  .schon .faq{background:var(--cream)}
  .schon .faq-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,70px);align-items:start}
  .schon .faq-left h2{color:var(--ink);font-size:clamp(30px,4.2vw,44px);margin-top:14px}
  .schon .faq-left p{margin-top:18px;max-width:38ch;font-size:15.5px}
  .schon .faq-left .btn{margin-top:26px}
  .schon .acc{border-bottom:1px solid var(--line-l)}
  .schon .acc button{width:100%;background:none;border:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 4px;font-family:var(--serif);font-size:clamp(18px,2vw,22px);color:var(--ink);text-align:left}
  .schon .acc button .ai{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line-l);display:grid;place-items:center;transition:all .3s ease}
  .schon .acc button .ai svg{width:14px;height:14px;transition:transform .3s ease}
  .schon .acc.open button .ai{background:var(--orange);border-color:var(--orange);color:#fff}
  .schon .acc.open button .ai svg{transform:rotate(45deg)}
  .schon .acc .acc-body{max-height:0;overflow:hidden;transition:max-height .4s ease}
  .schon .acc .acc-body p{padding:0 44px 22px 4px;font-size:14.5px;color:var(--grey-l)}

  /* ================= 14. blog ================= */
  .schon .blog-head{display:flex;align-items:flex-end;justify-content:space-between;gap:26px;flex-wrap:wrap;margin-bottom:46px}
  .schon .blog-head h2{font-size:clamp(30px,4.2vw,44px);margin-top:14px}
  .schon .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .schon .post{background:var(--panel);border:1px solid var(--line-d);border-radius:16px;overflow:hidden;transition:transform .3s ease,border-color .3s ease}
  .schon .post:hover{transform:translateY(-6px);border-color:rgba(255,117,43,.4)}
  .schon .post .po-ph{aspect-ratio:16/10;overflow:hidden}
  .schon .post .po-ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
  .schon .post:hover .po-ph img{transform:scale(1.06)}
  .schon .post .po-body{padding:22px 24px 26px}
  .schon .post .po-meta{display:flex;gap:14px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-dd);margin-bottom:10px}
  .schon .post .po-meta b{color:var(--orange);font-weight:600}
  .schon .post h3{font-size:21px;line-height:1.3}
  .schon .post .po-date{font-size:12.5px;color:var(--grey-dd);margin-top:8px}
  .schon .post p.ex{font-size:14px;margin-top:12px}
  .schon .post .link-arrow{margin-top:16px;font-size:12px}

  /* ================= 15. footer ================= */
  .schon .footer{border-top:1px solid var(--line-d);padding:clamp(56px,7vw,86px) 0 32px}
  .schon .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:38px}
  .schon .footer .logo-chip{width:max-content;margin-bottom:20px}
  .schon .foot-about{font-size:14.5px;max-width:32ch}
  .schon .foot-col h4{font-family:var(--sans);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey-dd);font-weight:600;margin-bottom:16px}
  .schon .foot-col a,.schon .foot-col p{display:block;color:var(--grey-d);font-size:14.5px;padding:5px 0}
  .schon .foot-col a:hover{color:var(--orange)}
  .schon .hours li{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;padding:5px 0;border-bottom:1px dashed var(--line-d)}
  .schon .hours{list-style:none;margin:0;padding:0}
  .schon .hours .d{color:var(--grey-dd)}
  .schon .insta{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
  .schon .insta a{border-radius:10px;overflow:hidden;aspect-ratio:1}
  .schon .insta img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .schon .insta a:hover img{transform:scale(1.08)}
  .schon .news{display:flex;gap:8px;margin-top:14px}
  .schon .news input{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line-d);border-radius:56px;padding:12px 18px;color:var(--white);font-size:14px}
  .schon .news input:focus{outline:none;border-color:var(--orange)}
  .schon .news button{flex:none;border:0;border-radius:56px;padding:0 20px;background:var(--orange);color:#fff;font-weight:600;cursor:pointer;font-size:13px}
  .schon .foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:46px;padding-top:22px;border-top:1px solid var(--line-d);color:var(--grey-dd);font-size:13px}
  .schon .foot-bottom .socials{display:flex;gap:20px}
  .schon .foot-bottom a:hover{color:var(--orange)}

  /* reveal */
  .schon .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
  .schon .reveal.in{opacity:1;transform:none}
  .schon .reveal.d1{transition-delay:.12s}
  .schon .reveal.d2{transition-delay:.24s}
  .schon .reveal.d3{transition-delay:.36s}

  /* ================= responsive ================= */
  @media(max-width:1120px){
    .schon .nav,.schon .cart{display:none}
    .schon .hdr .btn{display:none}
    .schon .about-grid{grid-template-columns:1fr}
    .schon .svc-stage{grid-template-columns:1fr;justify-items:center}
    .schon .svc-photos{grid-template-columns:1fr 1fr;width:100%}
    .schon .svc-list{width:100%;max-width:560px}
    .schon .promo-grid{grid-template-columns:1fr}
    .schon .fb-grid{grid-template-columns:1fr}
    .schon .fb{border-right:0;border-bottom:1px solid var(--line-d)}
    .schon .gal-grid{grid-template-columns:repeat(2,1fr)}
    .schon .g-a{grid-column:span 2}
    .schon .team-grid{grid-template-columns:repeat(2,1fr)}
    .schon .booking{grid-template-columns:1fr}
    .schon .bk-sum{border-left:0;border-top:1px solid var(--line-d)}
    .schon .faq-grid{grid-template-columns:1fr}
    .schon .blog-grid{grid-template-columns:1fr}
    .schon .foot-grid{grid-template-columns:1fr 1fr}
    .schon .count-grid{grid-template-columns:1fr 1fr}
    .schon .cnt:nth-child(2){border-right:0}
    .schon .cnt{border-bottom:1px solid var(--line-d)}
    .schon .cnt:nth-child(3),.schon .cnt:nth-child(4){border-bottom:0}
    .schon .hero-social-rail{display:none}
  }
  @media(max-width:700px){
    .schon .row-2{grid-template-columns:1fr}
    .schon .team-grid{grid-template-columns:1fr}
    .schon .foot-grid{grid-template-columns:1fr}
    .schon .gal-grid{grid-template-columns:1fr;grid-auto-rows:190px}
    .schon .g-a{grid-column:span 1;grid-row:span 1}
    .schon .g-c{grid-row:span 1}
    .schon .svc-photos{grid-template-columns:1fr}
    .schon .offer-a img{display:none}
    .schon .logo-chip{padding:10px 16px 10px 12px}
    .schon .logo-chip .lc-name{font-size:19px}
    .schon .spin-badge{width:120px;height:120px}
    .schon .spin-badge .sb-core{inset:24px;font-size:28px}
  }
  @media(prefers-reduced-motion:reduce){
    .schon *,.schon *::before,.schon *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
    .schon .reveal{opacity:1!important;transform:none!important}
    .schon .mq-track{animation:none!important}
    .schon .spin-badge .sb-text{animation:none!important}
  }

/* offset anchor jumps so section headings clear the fixed header */
html{scroll-padding-top:96px}

/* WordPress nav menu output (li wrappers) */
.schon .nav ul,.schon .mnav ul{display:contents}
.schon .nav li,.schon .mnav li{list-style:none;margin:0;padding:0}
.schon .nav li a{font-size:14px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.85);padding:6px 0;display:inline-block}
.schon .nav li a:hover,.schon .nav li.current-menu-item a{color:var(--orange)}
.schon .mnav li a{display:block;padding:14px 4px;border-bottom:1px solid var(--line-d);color:var(--white);font-size:15px;text-transform:uppercase;letter-spacing:.05em}
/* WordPress content basics */
.schon .entry a{color:var(--orange)}
.schon .entry p{margin:0 0 1.2em}
.schon img.alignleft{float:left;margin:0 20px 12px 0}
.schon img.alignright{float:right;margin:0 0 12px 20px}

  /* ================= Pari Spa: price menu ================= */
  .schon .price-menu{background:var(--cream);color:var(--grey-l)}
  .schon .packages{background:var(--cream);color:var(--grey-l)}
  .schon .price-menu .sec-head-c,.schon .packages .sec-head-c{text-align:center;max-width:760px;margin:0 auto 48px}
  .schon .price-menu .sec-head-c h2,.schon .packages .sec-head-c h2{color:var(--ink);font-size:clamp(30px,4.4vw,46px);margin-top:14px}
  .schon .pm-note{color:var(--grey-l);font-size:15px;margin-top:16px}
  /* accordion: each category folds open/closed so the long menu stays compact */
  .schon .pm-accordion{max-width:860px;margin:0 auto;border-top:1px solid var(--line-l)}
  .schon .pm-cat{border-bottom:1px solid var(--line-l)}
  .schon .pm-sum{display:flex;align-items:baseline;gap:16px;padding:20px 4px;cursor:pointer;list-style:none}
  .schon .pm-sum::-webkit-details-marker{display:none}
  .schon .pm-cat-name{flex:1;font-family:var(--serif);color:var(--ink);font-size:clamp(20px,2.4vw,26px);line-height:1.15}
  .schon .pm-from{flex:none;color:var(--grey-l);font-size:12.5px;text-transform:uppercase;letter-spacing:.08em}
  .schon .pm-chev{flex:none;display:inline-flex;color:var(--wine);transition:transform .25s ease}
  .schon .pm-cat[open] .pm-chev{transform:rotate(180deg)}
  .schon .pm-sum:hover .pm-cat-name{color:var(--wine)}
  .schon .pm-body{padding:0 4px 22px;overflow-x:auto}
  .schon .pm-cat ul{list-style:none;margin:0;padding:0}
  .schon .pm-row,.schon .pm-cat li{align-items:baseline;padding:11px 0;border-top:1px solid var(--line-l)}
  .schon .pm-cat li{display:flex;gap:14px}
  .schon .pm-row{display:grid;grid-template-columns:minmax(0,1fr) repeat(var(--pm-cols,1),var(--pm-colw,100px));gap:12px 20px}
  .schon .pm-colhead{border-top:0;padding-bottom:8px}
  .schon .pm-s{flex:1;color:var(--ink);font-size:15.5px;font-weight:500}
  .schon .pm-col{justify-self:center;color:var(--grey-l);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
  .schon .pm-p{flex:none;font-family:var(--serif);color:var(--orange);font-size:18px;font-variant-numeric:tabular-nums}
  .schon .pm-row .pm-p{justify-self:end}
  .schon .pm-p.pm-none{color:var(--grey-l);opacity:.4}
  .schon .pm-row-solo{display:flex;gap:14px}
  .schon .pm-row-solo .pm-s{flex:1}
  .schon .pm-solo-d{flex:none;color:var(--grey-l);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
  .schon .pm-legal{margin:40px auto 0;text-align:center;color:var(--grey-l);font-size:13px;max-width:760px}

  /* ================= Pari Spa: packages ================= */
  .schon .plans{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:stretch}
  .schon .plan{position:relative;background:#fff;border:1px solid #E9E1D6;border-radius:18px;padding:32px 26px;display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease}
  .schon .plan:hover{transform:translateY(-6px);box-shadow:0 26px 50px -26px rgba(18,18,20,.3)}
  .schon .plan h3{color:var(--ink);font-size:24px}
  .schon .pkg-dur{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);margin-top:8px}
  .schon .pkg-desc{color:var(--grey-l);font-size:14px;margin-top:16px}
  .schon .pkg-price{font-family:var(--serif);color:var(--ink);font-size:30px;margin:20px 0 24px;line-height:1.1}
  .schon .pkg-price span{display:block;font-family:var(--sans);font-size:12px;color:var(--grey-l);letter-spacing:.04em;margin-top:4px}
  .schon .plan .btn{margin-top:auto;justify-content:center}
  .schon .plan.feat{background:var(--orange);border-color:var(--orange)}
  .schon .plan.feat h3,.schon .plan.feat .pkg-price{color:#fff}
  .schon .plan.feat .pkg-dur{color:#fff}
  .schon .plan.feat .pkg-desc,.schon .plan.feat .pkg-price span{color:rgba(255,255,255,.92)}
  .schon .pkg-tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;border-radius:56px;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:6px 16px;white-space:nowrap}

  @media(max-width:1024px){ .schon .plans{grid-template-columns:repeat(2,1fr)} }
  @media(max-width:700px){
    .schon .plans{grid-template-columns:1fr}
    .schon .pm-row{--pm-colw:76px;gap:10px 12px}
    .schon .pm-row .pm-p{font-size:16px}
    .schon .pm-col{font-size:11px}
    .schon .pm-sum{gap:10px}
    .schon .pm-cat li{font-size:15px}
  }

  /* ================= custom logo (replaces the wordmark chip when a logo is set) ================= */
  .schon .logo-chip--img{padding:8px 18px}
  .schon .logo-chip--img .custom-logo-link{display:block;line-height:0}
  .schon .logo-chip--img .custom-logo{max-height:52px;width:auto;display:block}
  @media(max-width:700px){ .schon .logo-chip--img .custom-logo{max-height:40px} }

  /* ================= Brand re-skin: burgundy fills (gold accent via --orange) ================= */
  .schon .btn-orange{background:var(--wine)}
  .schon .btn-orange:hover{background:var(--wine-2)}
  .schon .dots-btn{background:var(--wine)}
  .schon .dots-btn:hover{background:var(--wine-2)}
  .schon .rnd:hover{background:var(--wine)}
  .schon .offer-b{background:var(--wine)}
  .schon .plan.feat{background:var(--wine);border-color:var(--wine)}
  .schon .on-cream .eyebrow{color:var(--wine)}
  .schon .pm-p{color:var(--wine)}
  /* booking form (theme-side leftovers): burgundy fills + gold focus glow */
  .schon .chip[aria-pressed="true"]{background:var(--wine);border-color:var(--wine)}
  .schon .success .tick{background:var(--wine)}
  .schon .booking select:focus,.schon .booking input:focus,.schon .booking textarea:focus{box-shadow:0 0 0 3px rgba(201,162,74,.25)}

  /* =====================================================================
   * Schon FX layer (fx.js) - all progressively enhanced; base page works
   * without any of it.
   * ===================================================================== */

  /* --- 1. custom cursor (activated only when fx.js adds .fx-cursor) --- */
  .schon .cursor-outer,.schon .cursor-inner{position:fixed;top:0;left:0;border-radius:50%;pointer-events:none;z-index:100001;transform:translate(-50%,-50%);will-change:transform;opacity:0;transition:opacity .3s ease,width .3s ease,height .3s ease,background .3s ease,border-color .3s ease}
  .schon.fx-cursor .cursor-outer,.schon.fx-cursor .cursor-inner{opacity:1}
  .schon .cursor-outer{width:42px;height:42px;border:1.5px solid var(--orange)}
  .schon .cursor-inner{width:7px;height:7px;background:var(--orange)}
  .schon .cursor-outer.hovering{width:64px;height:64px;background:rgba(201,162,74,.14)}
  .schon.fx-cursor,.schon.fx-cursor a,.schon.fx-cursor button,.schon.fx-cursor [data-hover]{cursor:none}
  @media(pointer:coarse){.schon .cursor-outer,.schon .cursor-inner{display:none!important}}

  /* --- 2. parallax hint (GSAP sets the transform; just promote to a layer) --- */
  .schon [data-parallax]{will-change:transform}

  /* --- 3. ripple water banner (jQuery Ripples draws a canvas over the bg) --- */
  .schon .ripple-banner{position:relative;min-height:clamp(420px,54vw,540px);display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background-color:#2a1116;background-size:cover;background-position:center}
  .schon .ripple-banner canvas{position:absolute;inset:0}
  .schon .ripple-banner::after{content:"";position:absolute;inset:0;background:rgba(18,18,20,.5);z-index:1}
  .schon .ripple-banner .rb-inner{position:relative;z-index:2;max-width:640px;padding:60px 22px}
  .schon .ripple-banner .eyebrow{justify-content:center}
  .schon .ripple-banner h2{color:#fff;font-size:clamp(32px,5vw,54px);margin-top:14px}
  .schon .ripple-banner h2 em{color:var(--orange);font-style:italic}
  .schon .ripple-banner p{margin:16px auto 26px;max-width:48ch;color:rgba(255,255,255,.86)}

  /* --- 7. services: cross-fading circle stack --- */
  .schon .svc-circles{position:relative;width:100%;max-width:430px;aspect-ratio:1;margin:0 auto}
  .schon .svc-circles .svc-circle{position:absolute;inset:0;width:auto;max-width:none;margin:0;aspect-ratio:auto;opacity:0;transform:scale(.96);pointer-events:none;transition:opacity .45s ease-in-out,transform .45s ease-in-out}
  .schon .svc-circles .svc-circle.on{opacity:1;transform:scale(1);pointer-events:auto}

  /* --- 4/5/6. gallery: filters + masonry + WebGL distortion + lightbox --- */
  .schon .gal-filters{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:38px}
  .schon .gal-filters button{background:transparent;border:1px solid rgba(255,255,255,.18);color:var(--grey-d);border-radius:56px;padding:11px 24px;font-family:var(--sans);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:background .25s ease,border-color .25s ease,color .25s ease}
  .schon .gal-filters button:hover{border-color:var(--orange);color:var(--orange)}
  .schon .gal-filters button.on{background:var(--wine);border-color:var(--wine);color:#fff}
  .schon .gal-masonry{columns:3;column-gap:18px}
  .schon .g-item{break-inside:avoid;margin:0 0 18px;border-radius:16px;overflow:hidden;position:relative;opacity:1;transform:scale(1);transition:opacity .4s ease,transform .4s ease;border:1px solid rgba(201,162,74,.2);cursor:pointer}
  .schon .g-item.hide{display:none}
  .schon .g-item.enter{opacity:0;transform:scale(.96)}
  .schon .gl-image{position:relative;line-height:0}
  .schon .gl-image img{width:100%;height:auto;display:block;transition:transform .7s ease,opacity .3s ease}
  .schon .g-item:hover .gl-image img{transform:scale(1.05)}
  .schon .gl-image canvas{position:absolute;inset:0;width:100%;height:100%}
  .schon .g-item .glabel{position:absolute;left:12px;bottom:12px;z-index:3;background:var(--cream);color:var(--ink);border-radius:56px;padding:7px 15px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;pointer-events:none}
  .schon .g-item .zoom{position:absolute;inset:0;z-index:2;background:none;border:0;padding:0;margin:0;cursor:pointer}
  .schon .lb{position:fixed;inset:0;z-index:100000;background:rgba(10,8,9,.94);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}
  .schon .lb.open{display:flex;opacity:1}
  .schon .lb img{max-width:88vw;max-height:86vh;border-radius:10px;box-shadow:0 30px 80px -20px #000}
  .schon .lb .lb-btn{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#fff;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:20px;cursor:pointer;transition:background .25s ease}
  .schon .lb .lb-btn:hover{background:var(--wine)}
  .schon .lb .lb-prev{left:24px;top:50%;transform:translateY(-50%)}
  .schon .lb .lb-next{right:24px;top:50%;transform:translateY(-50%)}
  .schon .lb .lb-close{top:22px;right:24px;width:46px;height:46px}
  .schon .lb .lb-count{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:var(--grey-d);font-size:13px;letter-spacing:.14em}
  @media(max-width:900px){.schon .gal-masonry{columns:2}}
  @media(max-width:560px){.schon .gal-masonry{columns:1}}

  /* --- 8. statement play -> video lightbox --- */
  .schon .vlb{position:fixed;inset:0;z-index:100000;background:rgba(10,8,9,.94);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}
  .schon .vlb.open{display:flex;opacity:1}
  .schon .vlb-video{max-width:90vw;max-height:84vh;border-radius:10px;background:#000;box-shadow:0 30px 80px -20px #000}
  .schon .vlb-close{position:absolute;top:22px;right:24px;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:20px;cursor:pointer;display:grid;place-items:center;transition:background .25s ease}
  .schon .vlb-close:hover{background:var(--wine)}

  /* --- reduced-motion / no-hover safety for the FX layer --- */
  @media(prefers-reduced-motion:reduce){
    .schon .g-item.enter{opacity:1;transform:none}
    .schon .ripple-banner canvas{display:none}
  }
  @media(hover:none){
    .schon .g-item:hover .gl-image img{transform:none}
  }