/* Next Step Renovate — design system + site styles (see DESIGN.md) */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/fraunces.woff2) format('woff2-variations'),url(fonts/fraunces.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jakarta-400.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jakarta-500.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/jakarta-600.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/jakarta-700.woff2) format('woff2')}
:root{
  --c-charcoal:#101111;--c-gold:#A6824A;--c-cream:#E6E2DA;--c-emerald:#154230;--c-burgundy:#5D1E21;
  --c-ivory:#F2EFE9;--c-gold-deep:#7A5C2C;--c-gold-hi:#B8955A;
  --c-ink:#101111;--c-ink-2:#4A4945;--c-ink-3:#5E5C57;--c-line:#D3CDC1;
  --c-cream-muted:#B9B4AA;--c-char-2:#1A1B1B;--c-char-3:#2A2B2B;
  --c-emerald-2:#1E5A42;--c-burgundy-2:#74282C;--c-error-dark:#E9A79F;
  --f-display:'Fraunces',Georgia,'Times New Roman',serif;
  --f-text:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--sp-8:64px;--sp-9:96px;--sp-10:128px;
  --r-sm:12px;--r-md:20px;--r-lg:28px;--r-xl:40px;--r-pill:999px;--r-arch:999px 999px 28px 28px;
  --sh-1:0 1px 2px rgba(16,17,17,.06),0 10px 30px -12px rgba(16,17,17,.18);
  --sh-2:0 30px 60px -24px rgba(16,17,17,.45);
  --dur-fast:180ms;--dur:320ms;--dur-slow:800ms;--ease-out:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --sec:128px;--wrap:1280px;
}
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .22s ease both}
::view-transition-new(root){animation:vtIn .45s var(--ease-out) both}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--c-cream);-webkit-text-size-adjust:100%;scroll-padding-top:110px}
body{margin:0;background:var(--c-cream);color:var(--c-ink);font-family:var(--f-text);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
body.is-locked{overflow:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--c-gold);outline-offset:3px;border-radius:6px}
::selection{background:var(--c-gold);color:var(--c-charcoal)}
.skip{position:fixed;left:16px;top:-80px;z-index:300;padding:12px 18px;border-radius:var(--r-pill);background:var(--c-gold);color:var(--c-charcoal);font-weight:600;text-decoration:none}
.skip:focus{top:16px}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(20px,4vw,48px)}
.ico{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- type ---------- */
.display,.h1,.h2,.h3{text-wrap:balance;font-feature-settings:"kern","liga","lnum";font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 144;color:inherit;margin:0;letter-spacing:-.015em}
.display{font-size:clamp(46px,6.6vw,96px);line-height:.98;font-weight:360}
.h1{font-size:clamp(44px,5.6vw,84px);line-height:1;font-weight:380}
.h2{font-size:clamp(34px,4vw,56px);line-height:1.06;font-weight:420}
.h3{font-size:26px;line-height:1.2;font-weight:480;letter-spacing:-.005em;font-variation-settings:"SOFT" 50,"opsz" 48}
.lead{text-wrap:pretty;margin:0;font-size:19px;line-height:1.6;color:var(--c-ink-2);max-width:46ch}
.on-dark .lead,.on-jewel .lead{color:var(--c-cream-muted)}
.hero .lead,.page-hero .lead{color:rgba(230,226,218,.84)}
.on-jewel .lead{color:rgba(230,226,218,.86)}
.body{text-wrap:pretty;margin:0;font-size:16px;line-height:1.7;color:var(--c-ink-2);max-width:60ch}
.on-dark .body{color:var(--c-cream-muted)}
.on-jewel .body{color:rgba(230,226,218,.86)}
.cap{margin:12px 0 0;font-size:13px;color:var(--c-ink-3)}
.on-dark .cap{color:var(--c-cream-muted)}
.word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.word>span{display:inline-block}
.js .hero .word>span,.js .page-hero .word>span{transform:translateY(105%);animation:rise 1s var(--ease-out) forwards}

/* tag pill */
.tag{display:inline-flex;align-items:center;gap:10px;min-height:36px;padding:0 16px 0 12px;border-radius:var(--r-pill);font-size:13px;font-weight:600;letter-spacing:.02em}
.tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c-gold);box-shadow:0 0 0 4px rgba(166,130,74,.22)}
.on-dark .tag{background:var(--c-char-3);color:var(--c-cream)}
.tag-light{background:var(--c-ivory);color:var(--c-ink);border:1px solid var(--c-line)}
.tag-light::before{background:var(--c-gold-deep);box-shadow:0 0 0 4px rgba(122,92,44,.15)}

/* surfaces */
.on-dark{background:var(--c-charcoal);color:var(--c-cream)}
.on-emerald{background:var(--c-emerald);color:var(--c-cream)}
.on-burgundy{background:var(--c-burgundy);color:var(--c-cream)}
.on-ivory{background:var(--c-ivory)}
.panel{border-radius:var(--r-xl);margin-inline:12px;overflow:hidden}
.sec{padding-block:var(--sec)}
.sec-sm{padding-block:var(--sp-9)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:56px;flex-wrap:wrap}
.sec-head .lead{margin-top:16px}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:0 10px 0 26px;border-radius:var(--r-pill);border:1px solid transparent;font-family:var(--f-text);font-size:15px;font-weight:600;letter-spacing:.01em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color var(--dur-fast) ease,color var(--dur-fast) ease,border-color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-out),box-shadow var(--dur) ease}
.btn:active{transform:scale(.97)}
.btn .arrow{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;transition:transform var(--dur) var(--ease-out),background-color var(--dur-fast) ease}
.btn .arrow .ico{width:18px;height:18px;stroke-width:2}
.btn:hover .arrow{transform:translateX(3px) rotate(-45deg)}
.btn>.ico{width:20px;height:20px}
.btn-gold{background:var(--c-gold);color:var(--c-charcoal)}
.btn-gold .arrow{background:var(--c-charcoal);color:var(--c-gold)}
.btn-gold:hover{background:var(--c-gold-hi);box-shadow:0 12px 30px -12px rgba(166,130,74,.7)}
.btn-dark{background:var(--c-charcoal);color:var(--c-cream)}
.btn-dark .arrow{background:var(--c-gold);color:var(--c-charcoal)}
.btn-dark:hover{background:#222323}
.btn-line{background:transparent;border-color:currentColor;padding:0 26px}
.on-dark .btn-line,.on-jewel .btn-line{color:var(--c-cream);border-color:rgba(230,226,218,.45)}
.on-dark .btn-line:hover,.on-jewel .btn-line:hover{background:var(--c-cream);color:var(--c-charcoal);border-color:var(--c-cream)}
.btn-line:hover{background:var(--c-charcoal);color:var(--c-cream);border-color:var(--c-charcoal)}
.btn-plain{padding:0 26px}
.btn-sm{min-height:44px;font-size:14px;padding:0 6px 0 18px}
.btn-sm .arrow{width:32px;height:32px}
.btn-sm.btn-line,.btn-sm.btn-plain{padding:0 18px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.link{position:relative;display:inline-flex;align-items:center;gap:8px;padding:6px 0;font-weight:600;font-size:15px;text-decoration:none;color:inherit}
.link::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1.5px;background:var(--c-gold-deep);transform-origin:left;transition:transform var(--dur) var(--ease-out)}
.on-dark .link::after,.on-jewel .link::after{background:var(--c-gold)}
.link:hover::after{transform:scaleX(.35)}
.link .ico{width:18px;height:18px;transition:transform var(--dur) var(--ease-out)}
.link:hover .ico{transform:translateX(4px)}

/* ---------- nav ---------- */
.nav{position:fixed;top:12px;left:0;right:0;z-index:50;pointer-events:none;transition:transform var(--dur) var(--ease-out)}
.nav.is-hidden{transform:translateY(-120%)}
.nav-bar{pointer-events:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;height:68px;margin-inline:auto;width:min(var(--wrap),calc(100% - 24px));padding:0 10px 0 22px;border-radius:var(--r-pill);background:rgba(16,17,17,.94);border:1px solid var(--c-char-3);color:var(--c-cream);transition:height var(--dur) var(--ease-out),box-shadow var(--dur) ease}
.nav.is-scrolled .nav-bar{height:60px;box-shadow:0 18px 40px -18px rgba(0,0,0,.55)}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--c-cream);flex:none}
.brand img{display:block;height:50px;width:auto}
.nav.is-scrolled .brand img{height:46px}
.brand-big img{height:96px}
.brand-big{margin-bottom:6px}
.brand-text{display:flex;flex-direction:column;gap:4px}
.brand-word{font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 48;font-weight:500;font-size:21px;line-height:1}
.brand-sub{font-size:9.5px;font-weight:600;line-height:1;letter-spacing:.38em;text-transform:uppercase;color:var(--c-cream-muted)}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-links a{position:relative;display:inline-flex;align-items:center;height:42px;padding:0 16px;border-radius:var(--r-pill);font-size:14px;font-weight:500;color:var(--c-cream-muted);text-decoration:none;transition:color var(--dur-fast) ease,background-color var(--dur-fast) ease}
.nav-links a:hover{color:var(--c-cream);background:var(--c-char-3)}
.nav-links a[aria-current="page"]{color:var(--c-cream)}
.nav-links a[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:4px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--c-gold)}
.nav-cta{display:flex;align-items:center;gap:8px;flex:none}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:50%;border:1px solid var(--c-char-3);background:transparent;color:var(--c-cream);text-decoration:none;cursor:pointer;transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-out)}
.icon-btn:hover{border-color:var(--c-gold);color:var(--c-gold)}
.icon-btn:active{transform:scale(.94)}
.icon-btn .ico{width:20px;height:20px}
.icon-btn.light{border-color:var(--c-line);color:var(--c-ink)}
.icon-btn.light:hover{border-color:var(--c-gold-deep);color:var(--c-gold-deep)}
.burger{display:none}

/* mobile menu */
.mmenu{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;padding:12px 20px 28px;background:var(--c-charcoal);color:var(--c-cream);overflow-y:auto;animation:fadeIn .25s ease both}
.mmenu-top{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 4px 0 10px}
.mmenu-links{display:flex;flex-direction:column;gap:2px;margin-top:28px}
.mmenu-links a{display:flex;align-items:center;justify-content:space-between;padding:14px 10px;border-radius:var(--r-md);font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 96;font-size:36px;font-weight:400;line-height:1.1;color:var(--c-cream);text-decoration:none;animation:fadeUp .5s var(--ease-out) both}
.mmenu-links a .ico{color:var(--c-gold);opacity:.7}
.mmenu-links a[aria-current="page"]{background:var(--c-char-3)}
.mmenu-links a:nth-child(2){animation-delay:.04s}.mmenu-links a:nth-child(3){animation-delay:.08s}.mmenu-links a:nth-child(4){animation-delay:.12s}.mmenu-links a:nth-child(5){animation-delay:.16s}.mmenu-links a:nth-child(6){animation-delay:.2s}
.mmenu-foot{display:flex;flex-direction:column;gap:12px;margin-top:auto;padding-top:28px}
.mmenu-foot .btn{width:100%}

/* ---------- page hero (inner pages) ---------- */
.page-hero{position:relative;border-radius:0 0 var(--r-xl) var(--r-xl);padding:160px 0 88px;overflow:hidden}
.page-hero .h1{margin-top:22px;max-width:14ch}
.page-hero .lead{margin-top:24px}
.page-hero .chips{margin-top:36px}
.crumbs{display:flex;align-items:center;gap:8px;margin:0;padding:0;list-style:none;font-size:13px;color:var(--c-cream-muted)}
.crumbs a{display:inline-flex;align-items:center;min-height:32px;color:var(--c-cream-muted);text-decoration:none}
.crumbs a:hover{color:var(--c-gold)}
.crumbs li+li::before{content:"";display:inline-block;width:5px;height:5px;margin-right:8px;border-radius:50%;background:var(--c-gold);vertical-align:middle}
.page-hero>.wrap,.hero>.wrap{position:relative;z-index:2}
.page-hero .deco{position:absolute;z-index:1;right:-40px;top:96px;width:340px;height:340px;color:rgba(166,130,74,.16);pointer-events:none}
.page-hero .deco .ico{width:100%;height:100%;stroke-width:.35}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r-pill);border:1px solid var(--c-line);background:var(--c-ivory);color:var(--c-ink);font-size:14px;font-weight:500;text-decoration:none;cursor:pointer;transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-out)}
.chip:hover{border-color:var(--c-gold-deep);transform:translateY(-2px)}
.chip .ico{width:18px;height:18px;color:var(--c-gold-deep)}
.on-dark .chip{background:var(--c-char-2);border-color:var(--c-char-3);color:var(--c-cream)}
.on-dark .chip .ico{color:var(--c-gold)}
.on-dark .chip:hover{border-color:var(--c-gold)}
.chip[aria-pressed="true"]{background:var(--c-charcoal);border-color:var(--c-charcoal);color:var(--c-cream)}
.chip[aria-pressed="true"] .ico{color:var(--c-gold)}
.chip.static{cursor:default}
.chip.static:hover{transform:none;border-color:var(--c-line)}
.on-dark .chip.static:hover{border-color:var(--c-char-3)}

/* ---------- home hero ---------- */
.hero{position:relative;border-radius:0 0 var(--r-xl) var(--r-xl);padding:150px 0 96px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:64px;align-items:center}
.hero .display{margin-top:26px}
.hero .lead{margin-top:28px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
.hero-facts{display:flex;flex-wrap:wrap;gap:10px;margin:48px 0 0;padding:0;list-style:none}
.hero-media{position:relative;justify-self:end;width:min(100%,520px)}
.arch{position:relative;border-radius:var(--r-arch);overflow:hidden;background:var(--c-char-2);aspect-ratio:4/5}
.arch img{width:100%;height:100%;object-fit:cover}
.hero .arch{box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.js .hero .arch{animation:archIn 1.4s var(--ease-out) .15s both}
.js .hero .arch img{animation:settle 2.4s var(--ease-out) .15s both}
.hero-card{text-decoration:none;position:absolute;left:-56px;bottom:40px;display:flex;align-items:center;gap:14px;padding:12px 18px 12px 12px;border-radius:var(--r-lg);background:var(--c-cream);color:var(--c-ink);box-shadow:var(--sh-2);max-width:300px}
.js .hero-card{animation:fadeUp .9s var(--ease-out) 1.1s both}
.hero-card img{width:56px;height:56px;border-radius:14px;object-fit:cover}
.hero-card b{display:block;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:500;font-size:17px;line-height:1.2}
.hero-card span{display:block;font-size:12.5px;color:var(--c-ink-3)}
.badge{position:absolute;right:-34px;top:-28px;width:132px;height:132px;border-radius:50%;background:var(--c-gold);color:var(--c-charcoal);display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-2)}
.js .badge{animation:popIn .8s var(--ease-out) 1.3s both}
.badge svg.ring{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);animation:spin 26s linear infinite}
.badge svg.ring text{font-family:var(--f-text);font-size:8.4px;font-weight:700;letter-spacing:.16em;fill:var(--c-charcoal)}
.badge .ico{width:34px;height:34px;stroke-width:1.8}
.js .hero .tag,.js .hero .lead,.js .hero-ctas,.js .hero-facts{animation:fadeUp .9s var(--ease-out) both}
.js .hero .tag{animation-delay:.1s}.js .hero .lead{animation-delay:.75s}.js .hero-ctas{animation-delay:.9s}.js .hero-facts{animation-delay:1.05s}

/* ---------- marquee ---------- */
.marquee{position:relative;overflow:hidden;padding:56px 0 8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-track{display:flex;gap:18px;width:max-content;animation:marquee 60s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee figure{margin:0;width:220px;flex:none}
.marquee img{width:220px;height:280px;object-fit:cover;border-radius:var(--r-md)}
.marquee figure:nth-child(even) img{height:240px;margin-top:40px;border-radius:var(--r-arch)}

/* ---------- statement ---------- */
.statement{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:64px;align-items:end}
.statement .big{margin:0;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 96;font-weight:380;font-size:clamp(30px,3.4vw,48px);line-height:1.2;letter-spacing:-.01em;color:var(--c-ink)}
.statement .side p{margin:0 0 20px;font-size:16px;line-height:1.7;color:var(--c-ink-2)}

/* ---------- bento services ---------- */
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:250px;gap:16px;grid-template-areas:"bath bath kit kit" "bath bath full base" "add comm tile tile"}
.tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:26px;border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:var(--c-cream);background:var(--c-charcoal);isolation:isolate;transition:transform var(--dur) var(--ease-out),box-shadow var(--dur) ease}
.tile:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.tile img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.tile:hover img{transform:scale(1.05)}
.tile.photo{padding:16px}
.tile.photo .t-top{padding:4px 4px 0}
.tile.photo .t-body{padding:18px 20px;border-radius:var(--r-md);background:rgba(16,17,17,.84)}
.tile .t-top{display:flex;justify-content:space-between;align-items:flex-start}
.tile .t-icon{width:40px;height:40px;color:var(--c-gold)}
.tile h3{margin:0;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 48;font-weight:450;font-size:28px;line-height:1.1}
.tile p{margin:8px 0 0;font-size:14px;line-height:1.5;color:rgba(230,226,218,.86);max-width:32ch}
.tile .go{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:rgba(230,226,218,.14);color:var(--c-cream);transition:transform var(--dur) var(--ease-out),background-color var(--dur-fast) ease}
.tile .go .ico{width:18px;height:18px;stroke-width:2}
.tile:hover .go{transform:rotate(-45deg);background:var(--c-gold);color:var(--c-charcoal)}
.tile.photo .go{background:rgba(16,17,17,.5)}
.tile.emerald{background:var(--c-emerald)}
.tile.burgundy{background:var(--c-burgundy)}
.tile.charcoal{background:var(--c-charcoal)}
.tile.ivory{background:var(--c-ivory);color:var(--c-ink);border:1px solid var(--c-line)}
.tile.ivory p{color:var(--c-ink-2)}
.tile.ivory .t-icon{color:var(--c-gold-deep)}
.tile.ivory .go{background:var(--c-cream);color:var(--c-ink)}
.a-bath{grid-area:bath}.a-kit{grid-area:kit}.a-full{grid-area:full}.a-base{grid-area:base}.a-add{grid-area:add}.a-comm{grid-area:comm}.a-tile{grid-area:tile}
.a-bath h3{font-size:40px}

/* ---------- project cards ---------- */
.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pcard{display:block;width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer}
.pcard .pimg{position:relative;display:block;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;background:var(--c-char-2)}
.pcard .pimg img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.pcard:hover .pimg img{transform:scale(1.05)}
.pcard .peek{position:absolute;right:16px;bottom:16px;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:var(--r-pill);background:var(--c-cream);color:var(--c-ink);font-size:13px;font-weight:600;opacity:0;transform:translateY(10px);transition:opacity var(--dur) ease,transform var(--dur) var(--ease-out)}
.pcard:hover .peek,.pcard:focus-visible .peek{opacity:1;transform:none}
.pcard .peek .ico{width:16px;height:16px}
.pcard .ptitle{display:block;margin-top:18px;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:23px;line-height:1.2}
.pcard .pmeta{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.pill-meta{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:var(--r-pill);font-size:12.5px;font-weight:600;background:var(--c-ivory);color:var(--c-ink-2);border:1px solid var(--c-line)}
.on-dark .pill-meta{background:var(--c-char-2);border-color:var(--c-char-3);color:var(--c-cream-muted)}
.cards3 .pcard:nth-child(2){margin-top:64px}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 24px;margin-top:40px}
.gallery .pcard.is-hidden{display:none}
.gallery .pcard:nth-child(3n+2){margin-top:40px}
.gallery.is-filtered .pcard:nth-child(3n+2){margin-top:0}
.empty{margin:40px 0 0;color:var(--c-ink-3)}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}

/* ---------- before / after ---------- */
.ba{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:center}
.ba-frame{position:relative;aspect-ratio:4/5;max-height:760px;border-radius:var(--r-lg);overflow:hidden;background:var(--c-char-2);-webkit-user-select:none;user-select:none;touch-action:pan-y;cursor:ew-resize;--pos:50%;box-shadow:var(--sh-1)}
.ba-frame:focus-within{outline:2px solid var(--c-gold);outline-offset:4px}
.ba-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.ba-frame .ba-before{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba-frame.is-nudging .ba-before,.ba-frame.is-nudging .ba-line,.ba-frame.is-nudging .ba-handle{transition:clip-path .9s var(--ease-io),left .9s var(--ease-io)}
.ba-line{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:var(--c-cream);pointer-events:none}
.ba-handle{position:absolute;top:50%;left:var(--pos);display:flex;align-items:center;justify-content:center;gap:2px;width:64px;height:44px;margin:-22px 0 0 -32px;border-radius:var(--r-pill);background:var(--c-cream);color:var(--c-charcoal);box-shadow:0 8px 24px rgba(0,0,0,.35);pointer-events:none}
.ba-handle .ico{width:18px;height:18px;stroke-width:2}
.ba-tag{position:absolute;top:18px;padding:7px 14px;border-radius:var(--r-pill);font-size:12px;font-weight:700;letter-spacing:.06em;pointer-events:none}
.ba-tag-l{left:18px;background:var(--c-burgundy);color:var(--c-cream)}
.ba-tag-r{right:18px;background:var(--c-emerald);color:var(--c-cream)}
.ba-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.ba-copy .h2{margin-top:18px}
.ba-copy .body{margin-top:18px}
.ba-hint{display:inline-flex;align-items:center;gap:10px;margin-top:28px;font-size:14px;font-weight:600;color:var(--c-ink-2)}
.ba-hint .ico{width:20px;height:20px;color:var(--c-gold-deep);animation:nudge 2.4s var(--ease-io) infinite}
.ba-list{display:flex;flex-direction:column;gap:120px}
.ba-list .ba:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.ba-list .ba:nth-child(even) .ba-frame{order:2}
.num{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--c-gold-deep);font-family:var(--f-display);font-size:18px;font-weight:500;color:var(--c-gold-deep)}
.on-dark .num,.on-jewel .num{border-color:var(--c-gold);color:var(--c-gold)}

/* ---------- process ---------- */
.process-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:72px 0 0;padding:0;list-style:none}
.steps::before{content:"";position:absolute;top:28px;left:28px;right:28px;height:1px;background:rgba(230,226,218,.25)}
.steps::after{content:"";position:absolute;top:28px;left:28px;right:28px;height:1px;background:var(--c-gold);transform-origin:left;transform:scaleX(0);transition:transform 1.6s var(--ease-io) .2s}
.steps.is-in::after{transform:scaleX(1)}
.step{position:relative}
.step-dot{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--c-emerald);border:1px solid var(--c-gold);color:var(--c-gold);font-family:var(--f-display);font-size:20px;font-weight:500}
.step h3{margin:24px 0 10px;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:26px;line-height:1.2}
.step p{margin:0;font-size:15px;line-height:1.65;color:rgba(230,226,218,.86);max-width:28ch}
.process-photo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:48px;align-items:center}

/* ---------- instagram band ---------- */
.ig{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:56px;align-items:center}
.ig-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ig-grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r-md);transition:transform var(--dur) var(--ease-out)}
.ig-grid a:hover img{transform:scale(1.04) rotate(-1deg)}
.ig-grid a:nth-child(2) img,.ig-grid a:nth-child(4) img{border-radius:var(--r-arch)}

/* ---------- cta band ---------- */
.cta{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:56px;align-items:center;padding:88px clamp(24px,5vw,72px)}
.cta .h2{font-size:clamp(40px,5vw,72px);font-weight:380}
.cta .lead{margin-top:20px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.cta .arch{max-width:360px;justify-self:end;width:100%;aspect-ratio:3/4}

/* ---------- services page ---------- */
.svc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center;padding-block:72px;scroll-margin-top:100px}
.svc+.svc{border-top:1px solid var(--c-line)}
.svc.flip .svc-media{order:2}
.svc-media .arch,.svc-media .rframe{max-width:500px}
.rframe{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;background:var(--c-char-2)}
.rframe img{width:100%;height:100%;object-fit:cover}
.svc-panel{position:relative;max-width:500px;aspect-ratio:5/4;border-radius:var(--r-lg);padding:40px;display:flex;flex-direction:column;justify-content:space-between;color:var(--c-cream);overflow:hidden}
.svc-panel .big-ico{width:96px;height:96px;color:var(--c-gold);stroke-width:1}
.svc-panel .ghost{position:absolute;right:-40px;bottom:-40px;width:260px;height:260px;color:rgba(230,226,218,.07);stroke-width:.6}
.svc-panel p{position:relative;margin:0;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 48;font-size:26px;line-height:1.25;max-width:18ch}
.svc-copy .num{margin-bottom:22px}
.svc-copy .lead{margin-top:18px}
.incl{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 0;padding:0;list-style:none}
.incl li{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px 0 12px;border-radius:var(--r-pill);background:var(--c-ivory);border:1px solid var(--c-line);font-size:14px;font-weight:500}
.incl li .ico{width:18px;height:18px;color:var(--c-emerald);stroke-width:2}
.svc-copy .btn{margin-top:32px}

/* ---------- about ---------- */
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:72px;align-items:center}
.placeholder{display:flex;align-items:center;justify-content:center;text-align:center;padding:28px;border:1.5px dashed var(--c-line);border-radius:var(--r-lg);color:var(--c-ink-3);font-size:14px;line-height:1.6;background:rgba(242,239,233,.6)}
.story .placeholder.photo{border-radius:var(--r-arch);aspect-ratio:4/5;max-width:440px}
.story .placeholder.text{margin-top:28px;justify-content:flex-start;text-align:left}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.fact{padding:32px;border-radius:var(--r-lg);min-height:260px;display:flex;flex-direction:column;justify-content:space-between;transition:transform var(--dur) var(--ease-out)}
.fact:hover{transform:translateY(-4px)}
.fact .ico{width:36px;height:36px;color:var(--c-gold)}
.fact h3{margin:32px 0 8px;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:26px}
.fact p{margin:0;font-size:15px;line-height:1.6;color:rgba(230,226,218,.86)}
.fact a{color:var(--c-cream);font-weight:600}
.areas{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:64px;align-items:start}
.city-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--c-line)}
.city-list li{display:flex;align-items:center;justify-content:space-between;padding:18px 0;border-bottom:1px solid var(--c-line);font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 96;font-weight:380;font-size:clamp(32px,3.6vw,52px);line-height:1;transition:padding-left var(--dur) var(--ease-out),color var(--dur-fast) ease}
.city-list li:hover{padding-left:12px;color:var(--c-emerald)}
.city-list li .ico{width:28px;height:28px;color:var(--c-gold-deep)}
.faq{max-width:860px}
.faq details{border-bottom:1px solid var(--c-line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;cursor:pointer;list-style:none;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:450;font-size:24px;line-height:1.25}
.faq summary::-webkit-details-marker{display:none}
.faq summary .plus{position:relative;flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--c-line);transition:transform var(--dur) var(--ease-out),background-color var(--dur-fast) ease}
.faq summary .plus::before,.faq summary .plus::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:1.6px;margin:-.8px 0 0 -7px;background:var(--c-ink)}
.faq summary .plus::after{transform:rotate(90deg);transition:transform var(--dur) var(--ease-out)}
.faq details[open] summary .plus{background:var(--c-charcoal);border-color:var(--c-charcoal)}
.faq details[open] summary .plus::before,.faq details[open] summary .plus::after{background:var(--c-gold)}
.faq details[open] summary .plus::after{transform:rotate(0)}
.faq .ans{padding:0 64px 26px 0;font-size:16px;line-height:1.7;color:var(--c-ink-2)}
.faq details[open] .ans{animation:fadeUp .4s var(--ease-out) both}

/* ---------- legal ---------- */
.legal-card{max-width:860px;padding:56px clamp(24px,5vw,64px);border-radius:var(--r-xl);background:var(--c-ivory);box-shadow:var(--sh-1)}
.legal-card h2{margin:44px 0 12px;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:28px}
.legal-card h2:first-of-type{margin-top:28px}
.legal-card p,.legal-card li{font-size:16px;line-height:1.75;color:var(--c-ink-2)}
.legal-card ul{padding-left:20px}
.legal-card a{color:var(--c-ink);font-weight:600}
.notice{display:flex;gap:12px;align-items:flex-start;padding:16px 20px;border-radius:var(--r-md);background:var(--c-cream);border:1px solid var(--c-line);font-size:14px;color:var(--c-ink-2)}
.notice .ico{color:var(--c-gold-deep)}

/* ---------- footer ---------- */
.footer{margin-top:var(--sp-9);border-radius:var(--r-xl) var(--r-xl) 0 0;padding:96px 0 32px}
.foot-top{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;padding-bottom:64px;border-bottom:1px solid var(--c-char-3)}
.foot-top .h2{max-width:14ch}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px;padding-top:56px}
.foot-tagline{margin:20px 0 0;font-size:13px;font-weight:600;letter-spacing:.14em;color:var(--c-gold)}
.foot-note{margin:10px 0 0;font-size:15px;color:var(--c-cream-muted);max-width:30ch}
.foot-h{margin:0 0 18px;font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--c-gold)}
.foot-list{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;font-size:15px;color:var(--c-cream-muted)}
.foot-list a{display:inline-flex;align-items:center;min-height:32px;color:var(--c-cream-muted);text-decoration:none;word-break:break-word;transition:color var(--dur-fast) ease}
.foot-list{gap:6px!important}
.foot-legal a,.foot-legal button{display:inline-flex;align-items:center;min-height:32px}
.foot-list a:hover{color:var(--c-cream)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:72px;padding-top:24px;border-top:1px solid var(--c-char-3);font-size:13px;color:var(--c-cream-muted)}
.foot-legal{display:flex;gap:24px}
.foot-bottom a{color:var(--c-cream-muted);text-decoration:none}
.foot-bottom a:hover{color:var(--c-gold)}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;z-index:130;display:flex;flex-direction:column;background:var(--c-charcoal);color:var(--c-cream);animation:fadeIn .3s ease both}
.lb-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px clamp(20px,4vw,40px)}
.lb-title{margin:0;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-size:24px;font-weight:450}
.lb-count{display:inline-flex;align-items:center;height:28px;margin-left:14px;padding:0 12px;border-radius:var(--r-pill);background:var(--c-char-3);font-family:var(--f-text);font-size:12.5px;font-weight:600;vertical-align:middle}
.lb-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:24px;padding:0 24px}
.lb-img{max-width:min(100%,920px);max-height:calc(100vh - 230px);max-height:calc(100dvh - 230px);width:auto;height:auto;object-fit:contain;border-radius:var(--r-lg);animation:popIn .45s var(--ease-out) both}
.lb-thumbs{display:flex;justify-content:center;gap:8px;padding:16px 20px 24px;overflow-x:auto}
.lb-thumbs button{flex:none;width:56px;height:56px;padding:0;border-radius:12px;border:2px solid transparent;overflow:hidden;background:none;opacity:.55;transition:opacity var(--dur-fast) ease,border-color var(--dur-fast) ease}
.lb-thumbs button[aria-current="true"]{opacity:1;border-color:var(--c-gold)}
.lb-thumbs img{width:100%;height:100%;object-fit:cover}
.lb-desc{margin:0;padding:0 24px;text-align:center;font-size:14px;color:var(--c-cream-muted)}

/* ---------- dialog / toast ---------- */
.dialog{position:fixed;inset:0;z-index:140;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(16,17,17,.55);animation:fadeIn .2s ease both}
.dialog-card{width:min(100%,420px);padding:32px;border-radius:var(--r-lg);background:var(--c-ivory);box-shadow:var(--sh-2);animation:popIn .35s var(--ease-out) both}
.dialog-card .h3{margin:0 0 10px}
.dialog-card p{margin:0;color:var(--c-ink-2);font-size:15px}
.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:28px;flex-wrap:wrap}

/* ---------- mobile bar ---------- */
.mbar{display:none}

/* ---------- quote ---------- */
.q-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:28px;align-items:start;margin-top:-56px;position:relative;z-index:2}
.q-card{padding:40px clamp(22px,4vw,48px) 32px;border-radius:var(--r-xl);background:var(--c-ivory);box-shadow:var(--sh-2)}
.stepper{display:flex;align-items:flex-start;gap:0;margin:0 0 44px;padding:0;list-style:none}
.stepper li{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.stepper li::before{content:"";position:absolute;top:21px;left:-50%;right:50%;height:2px;background:var(--c-line)}
.stepper li::after{content:"";position:absolute;top:21px;left:-50%;right:50%;height:2px;background:var(--c-gold);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-out)}
.stepper li:first-child::before,.stepper li:first-child::after{display:none}
.stepper li.is-done::after,.stepper li.is-current::after{transform:scaleX(1)}
.stepper button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:50%;border:1.5px solid var(--c-line);background:var(--c-ivory);color:var(--c-ink-3);font-family:var(--f-display);font-size:17px;font-weight:500;cursor:default;transition:background-color var(--dur) ease,border-color var(--dur) ease,color var(--dur) ease,transform var(--dur) var(--ease-out)}
.stepper li.is-done button{background:var(--c-emerald);border-color:var(--c-emerald);color:var(--c-cream);cursor:pointer}
.stepper li.is-done button:hover{transform:scale(1.08)}
.stepper li.is-current button{background:var(--c-charcoal);border-color:var(--c-charcoal);color:var(--c-gold);box-shadow:0 0 0 6px rgba(166,130,74,.22);animation:pulse 2.4s ease-in-out infinite}
.stepper .s-label{font-size:12.5px;font-weight:600;color:var(--c-ink-3)}
.stepper li.is-current .s-label{color:var(--c-ink)}
.stepper .ico{width:20px;height:20px;stroke-width:2.2}
.q-panel{border:0;margin:0;padding:0;min-width:0}
.q-panel.is-entering{animation:stepIn .5s var(--ease-out) both}
.q-panel.is-entering.is-back{animation-name:stepBack}
.q-legend{padding:0;margin:0 0 8px;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 96;font-weight:400;font-size:clamp(32px,3.4vw,46px);line-height:1.08;letter-spacing:-.01em}
.q-legend:focus{outline:none}
.q-help{margin:0 0 32px;font-size:15.5px;color:var(--c-ink-2);max-width:54ch}
.opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.opt{position:relative;display:block;cursor:pointer}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt-body{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:200px;padding:24px;border-radius:var(--r-lg);color:var(--c-cream);overflow:hidden;isolation:isolate;transition:transform var(--dur) var(--ease-out),box-shadow var(--dur) ease}
.opt:hover .opt-body{transform:translateY(-3px);box-shadow:var(--sh-1)}
.opt .opt-body.emerald{background:var(--c-emerald)}
.opt .opt-body.burgundy{background:var(--c-burgundy)}
.opt .opt-body.charcoal{background:var(--c-charcoal)}
.opt .opt-body.gold{background:#3B2F1E}
.opt-body .ghost{position:absolute;right:-26px;bottom:-26px;z-index:-1;width:150px;height:150px;color:rgba(230,226,218,.08);stroke-width:.8;transition:transform .8s var(--ease-out)}
.opt:hover .opt-body .ghost{transform:rotate(-8deg) scale(1.06)}
.opt-body .o-ico{width:38px;height:38px;color:var(--c-gold);stroke-width:1.5}
.opt-title{display:block;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:25px;line-height:1.15}
.opt-sub{display:block;margin-top:6px;font-size:13.5px;line-height:1.45;color:rgba(230,226,218,.82)}
.opt .check{position:absolute;top:18px;right:18px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1.5px solid rgba(230,226,218,.45);color:var(--c-charcoal);transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease,transform var(--dur) var(--ease-out)}
.opt .check .ico{width:16px;height:16px;stroke-width:2.6;opacity:0;transform:scale(.4);transition:opacity var(--dur-fast) ease,transform var(--dur) var(--ease-out)}
.opt input:checked+.opt-body{box-shadow:0 0 0 3px var(--c-ivory),0 0 0 5px var(--c-gold),var(--sh-1)}
.opt input:checked+.opt-body .check{background:var(--c-gold);border-color:var(--c-gold);transform:scale(1.08)}
.opt input:checked+.opt-body .check .ico{opacity:1;transform:none}
.opt input:focus-visible+.opt-body{outline:2px solid var(--c-gold);outline-offset:6px}
.opt .opt-body.gold{background:var(--c-gold);color:var(--c-charcoal)}
.opt .opt-body.gold .o-ico{color:var(--c-charcoal)}
.opt .opt-body.gold .opt-sub{color:rgba(16,17,17,.78)}
.opt .opt-body.gold .ghost{color:rgba(16,17,17,.1)}
.opt .opt-body.gold .check{border-color:rgba(16,17,17,.4);color:var(--c-gold)}
.opt input:checked+.opt-body.gold{box-shadow:0 0 0 3px var(--c-ivory),0 0 0 5px var(--c-charcoal),var(--sh-1)}
.opt input:checked+.opt-body.gold .check{background:var(--c-charcoal);border-color:var(--c-charcoal)}
[tabindex="-1"]:focus{outline:none}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.label{font-size:14px;font-weight:600;color:var(--c-ink)}
.label .opt-txt{font-weight:500;color:var(--c-ink-3)}
.input-wrap{position:relative}
.input-wrap .ico{position:absolute;left:16px;top:50%;width:20px;height:20px;margin-top:-10px;color:var(--c-ink-3);pointer-events:none}
.input,.textarea{width:100%;min-height:56px;padding:14px 16px;border-radius:var(--r-sm);border:1px solid var(--c-line);background:#FBFAF7;color:var(--c-ink);font-size:16px;transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease}
.input-wrap .input{padding-left:46px}
.textarea{min-height:180px;line-height:1.6;resize:vertical}
.input::placeholder,.textarea::placeholder{color:#8A877F}
.input:hover,.textarea:hover{border-color:#B9B2A4}
.input:focus,.textarea:focus{outline:none;border-color:var(--c-gold-deep);box-shadow:0 0 0 4px rgba(166,130,74,.2)}
.input[aria-invalid="true"]{border-color:var(--c-burgundy);box-shadow:0 0 0 4px rgba(93,30,33,.12)}
.hint{font-size:13px;color:var(--c-ink-3)}
.err{display:flex;align-items:center;gap:8px;margin:0;font-size:14px;font-weight:600;color:var(--c-burgundy)}
.err:empty{display:none}
.err::before{content:"!";display:inline-flex;align-items:center;justify-content:center;flex:none;width:18px;height:18px;border-radius:50%;background:var(--c-burgundy);color:var(--c-cream);font-size:12px;font-weight:700}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:0}
.pill{position:relative;cursor:pointer}
.pill input{position:absolute;opacity:0;width:1px;height:1px}
.pill span{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;border-radius:var(--r-pill);border:1px solid var(--c-line);background:#FBFAF7;font-size:15px;font-weight:500;color:var(--c-ink);transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-out)}
.pill span .ico{width:18px;height:18px;color:var(--c-gold-deep)}
.pill:hover span{border-color:#B9B2A4;transform:translateY(-1px)}
.pill input:focus-visible+span{outline:2px solid var(--c-gold);outline-offset:3px}
.pill input:checked+span{background:var(--c-emerald);border-color:var(--c-emerald);color:var(--c-cream)}
.pill input:checked+span .ico{color:var(--c-gold)}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:230px;padding:36px 24px;border-radius:var(--r-lg);border:1.5px dashed #B9B2A4;background:#FBFAF7;text-align:center;cursor:pointer;transition:border-color var(--dur-fast) ease,background-color var(--dur-fast) ease,transform var(--dur) var(--ease-out)}
.drop:hover,.drop.is-over{border-color:var(--c-gold-deep);background:#F7F2E8}
.drop.is-over{transform:scale(1.01)}
.drop-ico{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--c-charcoal);color:var(--c-gold)}
.drop-ico .ico{width:28px;height:28px}
.drop-title{font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:24px}
.drop-sub{font-size:14px;color:var(--c-ink-3)}
.thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 0;padding:0;list-style:none}
.thumbs:empty{display:none}
.thumb{position:relative;aspect-ratio:1;border-radius:var(--r-md);overflow:hidden;background:var(--c-line);animation:popIn .4s var(--ease-out) both}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb-x{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border-radius:50%;border:0;background:rgba(16,17,17,.78);color:var(--c-cream)}
.thumb-x:hover{background:var(--c-burgundy)}
.thumb-x .ico{width:14px;height:14px;stroke-width:2.4}
.ideas{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0;list-style:none}
.idea{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border-radius:var(--r-pill);border:1px dashed #B9B2A4;background:transparent;font-size:13.5px;font-weight:500;color:var(--c-ink-2);transition:border-color var(--dur-fast) ease,color var(--dur-fast) ease,background-color var(--dur-fast) ease}
.idea:hover{border-style:solid;border-color:var(--c-gold-deep);color:var(--c-ink);background:#FBFAF7}
.idea .ico{width:14px;height:14px;stroke-width:2.2}
.count{align-self:flex-end;font-size:12.5px;color:var(--c-ink-3)}
.q-nav{display:flex;align-items:center;gap:12px;margin-top:36px;padding-top:24px;border-top:1px solid var(--c-line);flex-wrap:wrap}
.q-nav .spacer{flex:1}
.q-reset{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:var(--r-pill);border:0;background:transparent;font-size:14px;font-weight:600;color:var(--c-ink-2);transition:background-color var(--dur-fast) ease,color var(--dur-fast) ease}
.q-reset:hover{background:rgba(93,30,33,.08);color:var(--c-burgundy)}
.q-reset .ico{width:18px;height:18px;transition:transform .5s var(--ease-out)}
.q-reset:hover .ico{transform:rotate(-180deg)}
.q-consent{margin:20px 0 0;font-size:13px;line-height:1.6;color:var(--c-ink-3)}
.q-consent a{color:var(--c-ink);font-weight:600}
.q-side{position:sticky;top:96px;margin-top:84px;display:flex;flex-direction:column;gap:16px}
.side-card{padding:28px;border-radius:var(--r-xl)}
.side-card h2{margin:0 0 6px;font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 36;font-weight:480;font-size:24px}
.side-card>p{margin:0;font-size:14.5px;color:var(--c-cream-muted)}
.sum{margin:20px 0 0;padding:0;list-style:none}
.sum li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;padding:14px 0;border-top:1px solid var(--c-char-3)}
.sum .ico{width:20px;height:20px;color:var(--c-gold);margin-top:2px}
.sum .k{display:block;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--c-cream-muted)}
.sum .v{display:block;margin-top:2px;font-size:15px;color:var(--c-cream);overflow-wrap:anywhere}
.sum .v.empty{color:#7D7A73}
.sum .v.flash{animation:flash .6s ease both}
.sum-thumbs{display:flex;gap:6px;margin-top:8px}
.sum-thumbs img{width:40px;height:40px;border-radius:10px;object-fit:cover;animation:popIn .3s var(--ease-out) both}
.side-phone{display:inline-flex;align-items:center;gap:10px;margin-top:16px;font-family:var(--f-display);font-size:26px;color:var(--c-cream);text-decoration:none}
.side-phone .ico{width:22px;height:22px;color:var(--c-gold)}
.side-phone:hover{color:var(--c-gold)}
.next-list{margin:16px 0 0;padding:0;list-style:none;counter-reset:n}
.next-list li{position:relative;padding:12px 0 12px 40px;font-size:14.5px;line-height:1.5;color:var(--c-ink-2);counter-increment:n}
.next-list li::before{content:counter(n);position:absolute;left:0;top:10px;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--c-charcoal);color:var(--c-gold);font-family:var(--f-display);font-size:14px}
.side-card.light{background:var(--c-ivory);border:1px solid var(--c-line)}
.side-card.light h2{color:var(--c-ink)}
.q-done{text-align:left}
.done-mark{display:flex;align-items:center;justify-content:center;width:84px;height:84px;margin-bottom:28px;border-radius:50%;background:var(--c-emerald);color:var(--c-gold)}
.done-mark svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.done-mark polyline{stroke-dasharray:30;stroke-dashoffset:30}
.q-done:not([hidden]) .done-mark{animation:popIn .5s var(--ease-out) both}
.q-done:not([hidden]) .done-mark polyline{animation:draw .6s var(--ease-out) .35s forwards}
.q-done .lead{margin-top:16px}
.q-preview{margin:24px 0 0}
.q-summary{margin:28px 0 0;padding:0;list-style:none;border-top:1px solid var(--c-line)}
.q-summary li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--c-line);font-size:15px}
.q-summary span:first-child{color:var(--c-ink-3);font-weight:600;font-size:13.5px}
.q-done .cta-row{margin-top:32px}
.is-quote .mbar{display:none!important}

/* ---------- reveal ---------- */
.js [data-reveal]:not(.is-in){opacity:0}
.js [data-reveal].is-in{animation:revealUp var(--dur-slow) var(--ease-out) backwards;animation-delay:calc(var(--i,0) * 70ms)}
.js [data-reveal="scale"].is-in{animation-name:revealScale}
.js .gallery .pcard.is-shown{animation:popIn .5s var(--ease-out) backwards}

/* ---------- hero backdrop: marble + gold lines ---------- */
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.6) 40%,#000 70%);mask-image:linear-gradient(90deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.6) 40%,#000 70%)}
.hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.26;filter:saturate(.5) contrast(1.15);transform:scale(1.06);will-change:transform}
.js .hero .hero-bg img{animation:drift 40s ease-in-out infinite alternate}
.page-hero .hero-bg img{opacity:.18}
.hero-stair{position:absolute;left:0;right:0;bottom:26px;z-index:1;width:100%;height:84px;pointer-events:none}
.hero-stair polyline{fill:none;stroke:var(--c-gold);stroke-width:1.2;stroke-linejoin:round;stroke-linecap:round;opacity:.55;vector-effect:non-scaling-stroke}
.js .hero-stair polyline{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.6s var(--ease-io) .9s forwards}
.hero-media::before,.hero-media::after{content:"";position:absolute;z-index:0;border:1px solid var(--c-gold);border-radius:999px 999px 46px 46px;pointer-events:none}
.hero-media::before{inset:-18px;opacity:.55}
.hero-media::after{inset:-40px -40px -22px;opacity:.22}
.js .hero-media::before{animation:archIn 1.6s var(--ease-out) .35s both}
.js .hero-media::after{animation:archIn 1.8s var(--ease-out) .55s both}
.hero .arch{z-index:1}
.hero-card,.badge{z-index:3}

/* ---------- section heading word reveal + image curtain ---------- */
.js [data-reveal="words"]:not(.is-in){opacity:1}
.js [data-reveal="words"]:not(.is-in) .word>span{transform:translateY(105%)}
.js [data-reveal="words"].is-in{animation:none}
.js [data-reveal="words"].is-in .word>span{animation:rise .95s var(--ease-out) backwards}
.js [data-reveal="curtain"].is-in{animation:curtain 1.2s var(--ease-out) backwards}
.js [data-reveal="curtain"].is-in img{animation:settle 1.8s var(--ease-out) backwards}

/* ---------- SPA preview views ---------- */
.view.is-entering{animation:viewIn .55s var(--ease-out) both}

/* ---------- keyframes ---------- */
@keyframes rise{to{transform:none}}
@keyframes curtain{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes drift{from{transform:scale(1.06) translate3d(0,0,0)}to{transform:scale(1.14) translate3d(-2%,-1.5%,0)}}
@keyframes revealUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes revealScale{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes popIn{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes archIn{from{clip-path:inset(100% 0 0 0 round 260px 260px 28px 28px)}to{clip-path:inset(0 0 0 0 round 0)}}
@keyframes settle{from{transform:scale(1.15)}to{transform:scale(1)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes nudge{0%,100%{transform:translateX(-4px)}50%{transform:translateX(4px)}}
@keyframes stepIn{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes stepBack{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 6px rgba(166,130,74,.22)}50%{box-shadow:0 0 0 10px rgba(166,130,74,.08)}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes flash{0%{color:var(--c-gold)}100%{color:var(--c-cream)}}
@keyframes viewIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0;transform:translateY(12px)}}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .nav-links a{padding:0 12px}
  .nav-cta .icon-btn:not(.burger){display:none}
  .hero-card{left:-24px}
}
@media (max-width:1024px){
  :root{--sec:96px}
  .nav-links,.nav-cta .btn{display:none}
  .burger{display:inline-flex}
  .hero-grid{grid-template-columns:1fr;gap:56px}
  .hero-media{justify-self:center}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"bath bath" "bath bath" "kit kit" "full base" "add comm" "tile tile"}
  .cards3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards3 .pcard:nth-child(2){margin-top:0}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery .pcard:nth-child(3n+2){margin-top:0}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
  .steps::before,.steps::after{display:none}
  .process-photo,.ig,.cta,.areas,.story,.statement,.svc,.ba{grid-template-columns:1fr;gap:48px}
  .svc.flip .svc-media,.ba-list .ba:nth-child(even) .ba-frame{order:0}
  .ba-list .ba:nth-child(even){grid-template-columns:1fr}
  .cta .arch{justify-self:start}
  .q-layout{grid-template-columns:1fr}
  .q-side{position:static;margin-top:0}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts{grid-template-columns:1fr}
}
@media (max-width:640px){
  :root{--sec:80px}
  body{font-size:16px}
  .nav{top:8px}
  .nav-bar{height:60px;padding:0 8px 0 16px;width:calc(100% - 16px)}
  .brand-word{font-size:19px}
  .hero{padding:118px 0 64px}
  .hero .display{font-size:46px}
  .hero-ctas .btn{width:100%}
  .hero-card{left:12px;right:12px;bottom:-28px;max-width:none}
  .badge{right:-6px;top:-30px;width:104px;height:104px}
  .badge svg.ring text{font-size:8.4px}
  .page-hero{padding:120px 0 64px}
  .page-hero .deco{display:none}
  .hero-media::after{inset:-26px -26px -14px}
  .hero-media::before{inset:-12px}
  .hero-stair{bottom:12px;height:56px}
  .hero-bg{-webkit-mask-image:none;mask-image:none}
  .hero-bg img{opacity:.14}
  .panel{margin-inline:8px;border-radius:var(--r-lg)}
  .lead{font-size:17px}
  .marquee figure,.marquee img{width:160px}
  .marquee img{height:210px}
  .marquee figure:nth-child(even) img{height:180px}
  .bento{grid-template-columns:1fr;grid-auto-rows:220px;grid-template-areas:"bath" "bath" "kit" "full" "base" "add" "comm" "tile"}
  .brand img{height:42px}
  .nav.is-scrolled .brand img{height:40px}
  .brand-big img{height:80px}
  .a-bath h3{font-size:32px}
  .cards3{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:-20px;padding:0 20px 8px;scrollbar-width:none}
  .cards3 .pcard{flex:0 0 80%;scroll-snap-align:start}
  .gallery{grid-template-columns:1fr;gap:36px}
  .steps{grid-template-columns:1fr;gap:36px;margin-top:48px}
  .ig-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cta{padding:56px 24px}
  .cta-row .btn{width:100%}
  .svc{padding-block:56px;gap:32px}
  .svc-panel{aspect-ratio:auto;min-height:240px;padding:28px}
  .ba-list{gap:80px}
  .q-layout{margin-top:-40px}
  .q-card{padding:28px 18px 24px;border-radius:var(--r-lg)}
  .stepper .s-label{display:none}
  .stepper{margin-bottom:32px}
  .opts{grid-template-columns:1fr;gap:12px}
  .opt-body{min-height:0;flex-direction:row;align-items:center;gap:16px;padding:18px 56px 18px 18px}
  .opt-title{font-size:21px}
  .field-row{grid-template-columns:1fr}
  .thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .q-nav{position:sticky;bottom:0;z-index:20;margin:28px -18px -24px;padding:14px 18px calc(14px + env(safe-area-inset-bottom));background:var(--c-ivory);border-radius:0 0 var(--r-lg) var(--r-lg)}
  .q-nav .btn{flex:1}
  .q-nav .spacer{display:none}
  .q-summary li{grid-template-columns:1fr;gap:2px}
  .foot-grid{grid-template-columns:1fr;gap:36px}
  .foot-top .btn{width:100%}
  .lb-stage{flex-wrap:wrap;align-content:center;gap:12px;padding:0 16px}
  .lb-img{order:-1;flex:0 0 100%;max-height:calc(100dvh - 300px);object-fit:contain}
  .lb-title{font-size:19px}
  .faq summary{font-size:20px}
  .faq .ans{padding-right:0}
  .mbar{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:45;display:grid;grid-template-columns:1fr 1.5fr;gap:8px;padding:8px;border-radius:var(--r-pill);background:rgba(16,17,17,.95);border:1px solid var(--c-char-3);box-shadow:0 18px 40px -16px rgba(0,0,0,.6);transition:transform var(--dur) var(--ease-out)}
  .mbar.is-hidden{transform:translateY(140%)}
  .mbar .btn{min-height:46px;padding:0 6px 0 16px;font-size:14px}
  .mbar .btn-line{padding:0 16px}
  .mbar .btn .arrow{width:34px;height:34px}
  .footer{padding-bottom:110px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;transform:none}
  .js .word>span{transform:none}
  .js [data-reveal]:not(.is-in){opacity:1}
  .marquee-track{animation:none}
  .hero-stair polyline{stroke-dashoffset:0}
  .done-mark polyline{stroke-dashoffset:0}
  @view-transition{navigation:none}
}

/* ---------- v3 additions ---------- */
.pill-status{background:rgba(166,130,74,.14)!important;border-color:rgba(122,92,44,.35)!important;color:var(--c-gold-deep)!important}
.on-dark .pill-status{background:rgba(166,130,74,.18)!important;border-color:rgba(166,130,74,.4)!important;color:var(--c-gold-hi)!important}
.gallery-note{margin-top:40px}
.wframe{position:relative;max-width:560px;aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;background:var(--c-char-2)}
.wframe img{width:100%;height:100%;object-fit:cover}
.ex-tag{position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 9px;border-radius:var(--r-pill);background:rgba(16,17,17,.82);color:var(--c-cream);font-size:12px;font-weight:600;letter-spacing:.02em}
.ex-tag .ico{width:14px;height:14px;color:var(--c-gold)}
.trade-note{display:flex;gap:14px;align-items:flex-start;max-width:900px;padding:22px 26px;border-radius:var(--r-lg);background:var(--c-ivory);border:1px solid var(--c-line)}
.trade-note .ico{flex:none;width:22px;height:22px;margin-top:2px;color:var(--c-gold-deep)}
.trade-note p{margin:0;font-size:15px;line-height:1.7;color:var(--c-ink-2)}
.trade-note a{color:var(--c-ink);font-weight:600}
.video-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:center}
.video-row .tag .ico{width:16px;height:16px;color:var(--c-gold)}
.video-frame{justify-self:center;width:min(100%,360px);aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;background:#000;box-shadow:0 30px 60px -30px rgba(0,0,0,.7);border:1px solid var(--c-char-3)}
.video-frame video{display:block;width:100%;height:100%;object-fit:cover;background:#000}
.story-text{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start}
.story-body p{margin:0 0 20px;font-size:18px;line-height:1.75;color:var(--c-ink-2)}
.story-body p:first-child{font-family:var(--f-display);font-variation-settings:"SOFT" 50,"opsz" 72;font-weight:380;font-size:clamp(22px,2.1vw,28px);line-height:1.45;color:var(--c-ink)}
.story-tag{margin-top:28px!important;font-family:var(--f-display);font-size:22px!important;color:var(--c-gold-deep)!important;letter-spacing:.01em}
.founder{display:flex;align-items:center;gap:12px;margin:0;font-size:16px;color:var(--c-ink-2)}
.founder .ico{flex:none;width:44px;height:44px;padding:11px;border-radius:50%;background:var(--c-charcoal);color:var(--c-gold)}
.founder b{color:var(--c-ink);font-weight:700}
.side-mail{display:inline-flex;align-items:center;gap:10px;margin-top:10px;font-size:15px;color:var(--c-cream);text-decoration:none;word-break:break-all}
.side-mail .ico{flex:none;width:18px;height:18px;color:var(--c-gold)}
.side-mail:hover{color:var(--c-gold)}
.tile.ivory .t-body p{color:var(--c-ink-2)}
@media (max-width:1024px){
  .video-row{grid-template-columns:1fr;gap:40px}
  .story-text{grid-template-columns:1fr;gap:32px}
}
@media (max-width:640px){
  .ex-tag{left:10px;bottom:10px}
  .trade-note{padding:18px 18px}
  .story-body p{font-size:17px}
}
/* consent checkbox */
.consent{position:relative;display:flex;gap:12px;align-items:flex-start;margin:28px 0 0;cursor:pointer;font-size:14.5px;line-height:1.55;color:var(--c-ink-2)}
.consent input{position:absolute;left:0;top:0;opacity:0;width:24px;height:24px;margin:0}
.consent .box{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-top:1px;border-radius:7px;border:1.5px solid #9C9586;background:#FBFAF7;transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease}
.consent .box .ico{width:15px;height:15px;color:var(--c-cream);stroke-width:2.6;opacity:0;transition:opacity var(--dur-fast) ease}
.consent input:checked+.box{background:var(--c-emerald);border-color:var(--c-emerald)}
.consent input:checked+.box .ico{opacity:1}
.consent input:focus-visible+.box{outline:2px solid var(--c-gold);outline-offset:3px}
.consent input[aria-invalid="true"]+.box{border-color:#9B2C2C}
.consent+.err{margin-top:8px}