:root{--bg:#f7f1e6;--fg:#14202f;--mut:#58626f;--card:#fffdf8;--line:#e2d9c8;--navy:#5c1f10;--gold:#9a6b2a;--gold2:#e0b564;--serif:'Fraunces',Georgia,serif;--sans:'Inter',system-ui,sans-serif}
*{box-sizing:border-box;margin:0}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
[id]{scroll-margin-top:96px}html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px)}
body{background:var(--bg);color:var(--fg);font:400 17px/1.65 var(--sans);overflow-x:hidden}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px}
header.nav{position:fixed;top:calc(10px + env(safe-area-inset-top,0px));left:12px;right:12px;max-width:1080px;margin:0 auto;z-index:10;padding:7px 8px 7px 22px;display:flex;justify-content:space-between;align-items:center;gap:18px;color:#5c1f10;background:#fffbf2d9;backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border:1px solid #e2d9c8;border-radius:999px;box-shadow:0 6px 24px #5c1f1014;transition:box-shadow .3s,background .3s;animation:nd .8s .1s cubic-bezier(.2,.7,.2,1) both}header.nav.sc{box-shadow:0 10px 34px #5c1f1030;background:#fffbf2f2}@keyframes nd{from{opacity:0;transform:translateY(-20px)}}.nav nav{display:flex;gap:6px}.nav nav a{position:relative;padding:8px 14px;text-decoration:none;font-weight:500;font-size:15px;color:#5c1f10}.nav nav a:after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2px;background:var(--gold);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .35s}.nav nav a:hover:after{transform:scaleX(1)}.nav .btn{display:inline-flex;gap:8px;align-items:center;padding:11px 20px;white-space:nowrap}.nav .btn svg{flex:none}@media(max-width:820px){.nav nav{display:none}}@media(max-width:420px){.nav{padding-left:16px}.nav .btn{padding:10px 14px;font-size:14px}}
.logo{display:flex;gap:10px;align-items:center;font:600 18px var(--serif);text-decoration:none;letter-spacing:.02em}
.brand{height:40px;width:auto;display:block}.herologo{width:min(440px,80vw);height:auto;margin-bottom:22px}.chip{display:inline-flex;gap:8px;align-items:center;padding:7px 14px;border:1px solid #9a6b2a66;border-radius:999px;font-size:14px;color:#5c1f10;background:#fffbf2aa;margin-bottom:18px}.chip b{color:#9a6b2a;letter-spacing:2px}.callbar{display:none}.footlogo{width:210px;height:auto;margin-bottom:12px}.btn{display:inline-block;padding:13px 22px;border-radius:999px;background:var(--gold2);color:#1a1405;font-weight:600;text-decoration:none;font-size:15px;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:transparent;border:1px solid #5c1f1066;color:#5c1f10}
.hero{position:relative;min-height:100svh;background:radial-gradient(110% 90% at 75% 15%,#fffbf2,#f3e8d3 60%,#e9d9bb);color:#5c1f10;display:flex;align-items:center;overflow:hidden}
.layer{position:absolute;inset:-10% 0;will-change:transform;pointer-events:none}
.grid{background-image:linear-gradient(#9a6b2a24 1px,transparent 1px),linear-gradient(90deg,#9a6b2a18 1px,transparent 1px);background-size:56px 56px;animation:drift 24s linear infinite}
@keyframes drift{to{background-position:0 56px,56px 0}}
.nums span{position:absolute;font:400 clamp(60px,12vw,150px)/1 var(--serif);color:#9a6b2a;opacity:.12;animation:float 12s ease-in-out infinite alternate}
@keyframes float{to{transform:translateY(-26px)}}
.bars{position:absolute;right:6%;bottom:12%;display:flex;gap:14px;align-items:flex-end;height:46%}
.bars i{width:clamp(14px,3vw,34px);background:linear-gradient(var(--gold2),#e0b56422);border-radius:6px 6px 0 0;animation:grow 6s ease-in-out infinite alternate;transform-origin:bottom}
.bars i:nth-child(1){height:35%}.bars i:nth-child(2){height:55%;animation-delay:-1s}.bars i:nth-child(3){height:45%;animation-delay:-2s}.bars i:nth-child(4){height:75%;animation-delay:-3s}.bars i:nth-child(5){height:100%;animation-delay:-4s}
@keyframes grow{from{transform:scaleY(.8)}to{transform:scaleY(1)}}
.hero .wrap{position:relative;z-index:2;padding-top:90px;padding-bottom:60px}
.eyebrow{font:600 12px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
h1{font:600 clamp(38px,7vw,78px)/1.05 var(--serif);margin:16px 0 20px;max-width:14ch}
.hero p.lead{max-width:46ch;color:#5b4a40;font-size:19px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
section{padding:96px 0}
h2{font:600 clamp(28px,4.5vw,44px)/1.1 var(--serif);margin:10px 0 22px}
.about p{max-width:62ch;color:var(--mut)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:30px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;transition:transform .3s,border-color .3s}
.card:hover{transform:translateY(-4px);border-color:var(--gold)}
.card b{font:600 20px var(--serif);display:block;margin-bottom:6px}.card span{color:var(--mut);font-size:15px}
.num{font:400 14px var(--serif);color:var(--gold);display:block;margin-bottom:12px}
.review{background:var(--navy);color:#f3ead8;border-radius:24px;padding:clamp(28px,5vw,56px);position:relative;overflow:hidden}
.review blockquote{font:400 clamp(21px,3vw,30px)/1.4 var(--serif);max-width:30ch}
.review blockquote+blockquote{margin-top:16px;color:#d5cdbd}
.stars{color:var(--gold2);letter-spacing:4px;margin-bottom:16px}
.review cite{display:block;margin-top:22px;font:500 14px var(--sans);color:#b8b0a0;font-style:normal}
.info{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.info .card a{color:var(--gold);font-weight:600}
footer{background:#efe4cf;color:#5b4a40;padding:56px 0 calc(40px + env(safe-area-inset-bottom,0px));font-size:15px}
footer a{color:#5c1f10;font-weight:500}
.card ul{list-style:none;padding:0;margin-top:10px;font-size:15px;color:var(--mut)}.card li{padding:7px 0 7px 18px;position:relative;border-top:1px solid var(--line)}.card li:before{content:"";position:absolute;left:0;top:16px;width:7px;height:7px;border-radius:50%;background:var(--gold)}.about p.area{margin-top:18px;color:var(--fg);font-weight:500}.person{text-align:center}.person i{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 14px;border-radius:50%;background:var(--navy);color:var(--gold2);font:600 30px var(--serif);font-style:normal}.cards{align-items:start}.more{margin-top:14px;max-width:62ch}.more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border:1px solid var(--gold);border-radius:999px;color:var(--gold);font-weight:600;font-size:15px;transition:background .2s,color .2s}.more summary::-webkit-details-marker{display:none}.more summary:hover{background:var(--gold);color:#fff}.more summary:after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .3s}.more[open] summary:after{transform:rotate(-135deg)}.more .vl,.more[open] .vm{display:none}.more[open] .vl{display:inline}.more .mc{margin-top:18px;animation:mo .5s ease}.more .mc p{color:var(--mut)}@keyframes mo{from{opacity:0;transform:translateY(-8px)}}
.prog{position:fixed;top:0;left:0;right:0;height:3px;z-index:30;background:linear-gradient(90deg,var(--gold),#e0b564);transform:scaleX(0);transform-origin:left;will-change:transform}
.hero .wrap>*{opacity:0;animation:up .9s cubic-bezier(.2,.7,.2,1) forwards}
.hero .wrap>*:nth-child(1){animation-delay:.15s}.hero .wrap>*:nth-child(2){animation-delay:.3s}.hero .wrap>*:nth-child(3){animation-delay:.45s}.hero .wrap>*:nth-child(4){animation-delay:.65s}.hero .wrap>*:nth-child(5){animation-delay:.85s}.hero .wrap>*:nth-child(6){animation-delay:1s}
@keyframes up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.chart{position:absolute;left:0;right:0;bottom:8%;width:100%;height:42%;opacity:.55}
.chart path{fill:none;stroke:#b98a3c;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1600;stroke-dashoffset:1600;animation:draw 9s ease-in-out infinite}
.chart circle{fill:#b98a3c;animation:pop 9s ease-in-out infinite}
@keyframes draw{0%{stroke-dashoffset:1600}55%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:-1600}}
@keyframes pop{0%,50%{opacity:0;transform:scale(0)}58%,85%{opacity:1;transform:scale(1)}100%{opacity:0}}
.chart circle{transform-box:fill-box;transform-origin:center}
.cta .btn:first-child{animation:ring 2.8s ease-out infinite}
@keyframes ring{0%{box-shadow:0 0 0 0 #e0b56480}70%,100%{box-shadow:0 0 0 16px #e0b56400}}
h2:after{content:"";display:block;height:3px;width:0;margin-top:14px;background:linear-gradient(90deg,var(--gold),transparent);border-radius:2px;transition:width 1s .3s cubic-bezier(.2,.7,.2,1)}
.in h2:after,h2.in:after{width:72px}
.card{position:relative;overflow:hidden}
.card:after{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:linear-gradient(90deg,var(--gold),#e0b564);transform:scaleX(0);transform-origin:left;transition:transform .5s}
.card:hover:after{transform:scaleX(1)}
.card:hover .num{transform:translateX(6px)}.num{transition:transform .3s}
.person:hover i{transform:rotate(-6deg) scale(1.08)}.person i{transition:transform .35s}
.stars{background:linear-gradient(100deg,var(--gold2) 40%,#fff 50%,var(--gold2) 60%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shine 4s linear infinite}
@keyframes shine{from{background-position:150% 0}to{background-position:-100% 0}}
.review:before{content:"\201C";position:absolute;right:28px;top:-30px;font:400 220px/1 var(--serif);color:#e0b564;opacity:.13}
.brand{transition:transform .4s}.logo:hover .brand{transform:scale(1.04)}
.team{grid-template-columns:repeat(2,1fr);gap:14px}@media(min-width:900px){.team{grid-template-columns:repeat(4,1fr)}}.person{padding:26px 14px}.person span{display:block;min-height:1.4em;font-size:14px}.person b{font-size:18px}.av{width:96px;height:96px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 14px;border:3px solid var(--gold2);transition:transform .35s}.person:hover .av{transform:scale(1.07) rotate(-3deg)}.team{align-items:stretch!important}.vm2{margin-top:14px;background:none;border:1px solid var(--gold);color:var(--gold);border-radius:999px;padding:8px 18px;font:600 14px var(--sans);cursor:pointer;transition:background .2s,color .2s}.vm2:hover{background:var(--gold);color:#fff}
dialog#bd{border:0;border-radius:22px;padding:30px 28px 26px;max-width:min(520px,92vw);width:100%;background:var(--card);color:var(--fg);box-shadow:0 30px 80px #0008}dialog#bd::backdrop{background:#190905b3;backdrop-filter:blur(4px)}dialog#bd[open]{animation:dp .35s cubic-bezier(.2,.7,.2,1)}@keyframes dp{from{opacity:0;transform:translateY(20px) scale(.97)}}
#bd .hd{display:flex;gap:16px;align-items:center;margin-bottom:16px}#bd .hd img{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid var(--gold2)}#bd h3{font:600 24px var(--serif)}#bd .rl{color:var(--gold);font-size:14px;font-weight:600}#bd p,#bd li{color:var(--mut);font-size:16px}#bd p+p{margin-top:10px}#bd ul{list-style:none;padding:0;margin-top:8px}#bd li{padding:8px 0 8px 18px;position:relative;border-top:1px solid var(--line)}#bd li:before{content:"";position:absolute;left:0;top:17px;width:7px;height:7px;border-radius:50%;background:var(--gold)}#bd .x{position:absolute;right:14px;top:12px;background:none;border:0;font-size:28px;line-height:1;color:var(--mut);cursor:pointer}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:clamp(70px,12vh,130px);background:linear-gradient(to bottom,#f7f1e600,#f7f1e6b8 70%,#f7f1e6);z-index:1;pointer-events:none}.hero .wrap{will-change:transform,opacity}.panel{margin:28px 0 8px;padding:28px clamp(20px,4vw,38px);max-width:720px;background:linear-gradient(135deg,#fffbf2,#f3e8d3);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:18px;box-shadow:0 14px 40px #5c1f1012;position:relative;overflow:hidden}.panel:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 40%,#ffffff80 50%,transparent 60%);transform:translateX(-100%);animation:sw 7s 1.5s ease-in-out infinite;pointer-events:none}@keyframes sw{0%,60%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.about .panel p{color:var(--fg);max-width:none;font-size:17px}.about .panel p+p{margin-top:12px}.hl{background:linear-gradient(transparent 62%,#e0b56477 62%) no-repeat 0 0/0% 100%;color:var(--navy);font-weight:600;padding:0 2px;transition:background-size 1.1s .5s cubic-bezier(.2,.7,.2,1)}.in .hl{background-size:100% 100%}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.chips span{padding:9px 20px;border-radius:999px;background:var(--navy);color:#f3ead8;font:600 13px var(--sans);letter-spacing:.1em;text-transform:uppercase;opacity:0;transform:translateY(12px) scale(.9);transition:opacity .6s var(--d),transform .6s var(--d) cubic-bezier(.3,1.5,.5,1)}.in .chips span{opacity:1;transform:none}.sig{margin-top:18px;font:italic 400 19px var(--serif);color:var(--gold)}
@media (prefers-reduced-motion:reduce){.chips span{opacity:1;transform:none}.hl{background-size:100% 100%}}
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s}.rv.in{opacity:1;transform:none}
@media (max-width:640px){.callbar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:20;gap:8px}.callbar a{flex:1;text-align:center;padding:14px;border-radius:14px;font-weight:600;text-decoration:none;box-shadow:0 8px 24px #0006}.callbar .c{background:#e0b564;color:#1a1405}.callbar .d{background:#2a0f08;color:#f3ead8}footer{padding-bottom:96px}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}

/* ===== mobile fixes (match the promo video) ===== */
/* team popup centred and stable */
dialog#bd{margin:auto;max-height:min(86vh,720px);overflow:auto}
html:has(dialog[open]){overflow:hidden}
/* grid drift on the compositor instead of repainting the background every frame (same look) */
.grid{animation:gd 24s linear infinite;inset:-10% 0 -10% -56px}
@keyframes gd{to{transform:translate3d(56px,56px,0)}}
@media (max-width:640px){
 .hero .cta .ghost{display:none}
 .hero .wrap{padding-bottom:110px}
 .bars{opacity:.35;height:32%;bottom:6%}
 .chart{opacity:.4}
 header.nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fffbf2f2}
}

/* v1.0.1: service boxes all the same size; simpler footer */
@media (min-width:700px){.cards:not(.team){align-items:stretch;grid-auto-rows:1fr}}
.cards:not(.team) .card{display:flex;flex-direction:column}
footer{text-align:center}footer .footlogo{margin-left:auto;margin-right:auto;display:block}

/* v1.0.2: vector logo, rotating reviews, live opening hours */
.herologo{height:auto}
.review .rslides{display:grid;margin-top:4px}
.review .rs{grid-area:1/1;margin:0;opacity:0;transform:translate3d(24px,0,0);filter:blur(6px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .7s;pointer-events:none}
.review .rs.on{opacity:1;transform:none;filter:none;pointer-events:auto}
.review .rs.out{transform:translate3d(-24px,0,0)}
.review .rs blockquote{font:400 clamp(21px,3vw,30px)/1.4 var(--serif);max-width:32ch;margin:0}
.review .rs cite{display:block;margin-top:22px;font:500 14px var(--sans);color:#b8b0a0;font-style:normal;letter-spacing:.02em}
.rnav{display:flex;align-items:center;gap:14px;margin-top:26px}
.rnav button{width:44px;height:44px;border-radius:50%;border:1px solid #e0b56466;background:transparent;color:#f3ead8;font:400 26px/1 var(--serif);cursor:pointer;transition:background .2s,border-color .2s}
.rnav button:hover{background:#e0b5641f;border-color:#e0b564}
.rdots{display:flex;gap:8px}
.rdots button{width:10px;height:10px;padding:0;border-radius:999px;border:0;background:#f3ead84d;cursor:pointer;transition:width .4s cubic-bezier(.16,1,.3,1),background .3s}
.rdots button[aria-selected="true"]{width:30px;background:#e0b564}
.rsum{margin-top:18px;font-size:14px;color:#d5cdbd}
.hours .hstat{display:flex;align-items:center;gap:10px;margin:8px 0 12px;font-weight:600;font-size:15px;color:var(--fg)}
.hours .hstat i{width:10px;height:10px;border-radius:50%;background:#b8b0a0;flex:none;position:relative}
.hours.open .hstat i{background:#2f9e5b}
.hours.open .hstat i:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid #2f9e5b;animation:hp 2s cubic-bezier(.16,1,.3,1) infinite}
.hours.soon .hstat i{background:#d08a1e}
@keyframes hp{from{opacity:.8;transform:scale(.6)}to{opacity:0;transform:scale(1.6)}}
.hours .hweek{list-style:none;padding:0;margin:0;font-size:15px}
.hours .hweek li{display:flex;justify-content:space-between;gap:12px;padding:7px 10px;margin:0 -10px;border-radius:10px;color:var(--mut);border-top:1px solid var(--line)}
.hours .hweek li:before{display:none}
.hours .hweek li.today{background:#e0b56429;color:var(--navy);font-weight:600;border-top-color:transparent}
.hours .hbar{height:4px;border-radius:4px;background:var(--line);margin-top:14px;overflow:hidden}
.hours .hbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),#e0b564);border-radius:4px;transition:width 1.4s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){.review .rs{transition:none}.hours.open .hstat i:after{animation:none}}

/* WordPress: keep the floating header below the admin bar for logged-in users */
.admin-bar header.nav{top:calc(42px + env(safe-area-inset-top,0px))}
.admin-bar .prog{top:32px}
@media (max-width:782px){.admin-bar header.nav{top:56px}.admin-bar .prog{top:46px}}
