/* ============================================================
   DST · INK ATELIER — a new visual system
   Gallery-editorial. Bone paper, ink that stains the page,
   vermilion accent. Bodoni Moda × Space Grotesk × Space Mono.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..700&family=Space+Grotesk:wght@300..700&family=Space+Mono:ital,wght@0,400;0,700;1,400&display=swap');

:root{
  --paper:#F5F5F5;
  --paper-2:#EEEEEE;
  --paper-card:#F9F9F9;
  --ink:#18150F;
  --ink-2:#433C30;
  --ink-3:#7A7264;
  --ink-4:#A9A294;
  --accent:#b30f0f;
  --accent-deep:#8a0a0a;
  --accent-soft:rgba(179,15,15,0.10);
  --line:rgba(24,21,15,0.16);
  --r-pill:999px;
  --r-card:14px;
  --r-btn:8px;
  --r-input:8px;
  --line-2:rgba(24,21,15,0.30);
  --serif:'Playfair Display', Georgia, serif;
  --sans:'Space Grotesk', system-ui, sans-serif;
  --mono:'Space Mono', ui-monospace, monospace;
  --gut:clamp(20px, 5vw, 80px);
  --maxw:1380px;
  --ink-amt:0.36;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:96px; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; }
::selection{ background:var(--accent); color:var(--paper); }

/* ---------- ink backdrop: video stains the paper via multiply ---------- */
.ink{ position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.ink video{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:max(100vw,177.78vh); height:max(100vh,56.25vw); object-fit:cover;
  mix-blend-mode:multiply; opacity:var(--ink-amt); filter:contrast(1.12) brightness(1.06); }
.ink::after{ content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.62), rgba(255,255,255,0.68)),
    radial-gradient(125% 90% at 50% -10%, transparent 35%, rgba(255,255,255,0.72) 100%); }

/* page sits above the ink */
.page{ position:relative; z-index:1; }

/* ---------- shared rhythm ---------- */
.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); }
.section{ padding-block:clamp(72px,11vw,150px); position:relative; }
.rule{ height:1px; background:var(--line); border:0; }

/* editorial section index label */
.eyebrow{ display:flex; align-items:center; gap:12px; font-family:var(--mono);
  font-size:12px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--accent-deep); }
.eyebrow::before{ content:attr(data-n); font-weight:400; color:var(--ink-3); }
.eyebrow b{ font-weight:400; color:var(--ink-3); }

/* type scale */
.display{ font-family:var(--serif); font-weight:500; line-height:0.96;
  letter-spacing:-0.015em; font-size:clamp(3.4rem,11vw,9.5rem); }
.h1{ font-family:var(--serif); font-weight:500; line-height:1.0; letter-spacing:-0.01em;
  font-size:clamp(2.6rem,6.5vw,5.4rem); }
.h2{ font-family:var(--serif); font-weight:500; line-height:1.04; letter-spacing:-0.01em;
  font-size:clamp(2rem,4.6vw,3.6rem); }
.h3{ font-family:var(--serif); font-weight:500; font-size:clamp(1.4rem,2.4vw,2rem); line-height:1.1; }
.it{ font-style:italic; }
.accent{ color:var(--accent); }
.lead{ font-size:clamp(1.05rem,1.5vw,1.35rem); line-height:1.55; color:var(--ink-2); max-width:46ch; }
.muted{ color:var(--ink-3); }
.kicker{ font-family:var(--mono); font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--ink-3); }

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; gap:10px; cursor:pointer; border:1px solid var(--ink);
  background:var(--ink); color:var(--paper); font-family:var(--mono); font-size:12px;
  letter-spacing:0.14em; text-transform:uppercase; padding:14px 22px; border-radius:var(--r-btn);
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.btn:hover{ background:var(--accent); border-color:var(--accent); color:var(--paper); }
.btn svg{ width:15px; height:15px; }
.btn--ghost{ background:transparent; color:var(--ink); }
.btn--ghost:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn--accent{ background:var(--accent); border-color:var(--accent); }
.btn--accent:hover{ background:var(--accent-deep); border-color:var(--accent-deep); }
.btn--lg{ padding:17px 28px; font-size:13px; }
.btn--block{ width:100%; justify-content:center; }
.ico{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round; }
.ico--sm{ width:15px; height:15px; }

/* reveal */
[data-reveal]{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
html:not(.reveal-ready) [data-reveal], [data-reveal].in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ [data-reveal]{ opacity:1 !important; transform:none !important; } }

/* ============================================================ NAV */
.nav{ position:fixed; top:0; left:0; right:0; z-index:50; display:flex; align-items:center;
  justify-content:space-between; gap:20px; padding:16px var(--gut);
  background:rgba(255,255,255,0.88); backdrop-filter:blur(20px) saturate(110%);
  -webkit-backdrop-filter:blur(20px) saturate(110%); border-bottom:1px solid rgba(0,0,0,0.07); }
.brand{ font-family:var(--serif); font-weight:600; font-size:1.5rem; letter-spacing:-0.01em; line-height:1; }
.brand i{ font-style:italic; color:var(--accent); font-weight:500; padding-left:0.06em; }
.nav__links{ display:flex; align-items:center; gap:28px; }
.nav__links a{ font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-2);
  position:relative; padding:4px 0; transition:color .25s var(--ease); }
.nav__links a::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--accent); transition:width .3s var(--ease); }
.nav__links a:hover{ color:var(--ink); } .nav__links a:hover::after, .nav__links a.active::after{ width:100%; }
.nav__links a.active{ color:var(--ink); }
.nav__right{ display:flex; align-items:center; gap:18px; }
.nav__ig{ display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--line-2); border-radius:50%; transition:.25s var(--ease); }
.nav__ig:hover{ border-color:var(--accent); color:var(--accent); }
.burger{ display:none; width:44px; height:44px; align-items:center; justify-content:center; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; }
.burger span{ display:block; width:22px; height:1.5px; background:var(--ink); transition:.3s var(--ease); }
body.menu-open .burger span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
body.menu-open .burger span:nth-child(2){ opacity:0; }
body.menu-open .burger span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* mobile menu */
.navmenu{ position:fixed; inset:0; z-index:49; background:var(--paper); display:flex; flex-direction:column;
  justify-content:center; gap:6px; padding:14vh var(--gut) 8vh; opacity:0; visibility:hidden; transform:translateY(-10px);
  transition:opacity .35s var(--ease), transform .35s var(--ease), visibility .35s; }
body.menu-open .navmenu{ opacity:1; visibility:visible; transform:none; }
.navmenu a{ font-family:var(--serif); font-size:clamp(2.2rem,11vw,3.4rem); line-height:1.18; display:flex; align-items:baseline; gap:16px; }
.navmenu a::before{ content:attr(data-n); font-family:var(--mono); font-size:0.8rem; color:var(--accent); }
.navmenu__foot{ margin-top:6vh; display:flex; flex-direction:column; gap:14px; max-width:380px; }
.navmenu__meta{ font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-3); }

/* ============================================================ HERO */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end;
  padding:120px var(--gut) clamp(32px,5vw,64px); }
.hero__side{ display:none; position:absolute; left:24px; top:50%; transform:translateY(-50%) rotate(180deg); writing-mode:vertical-rl;
  font-family:var(--mono); font-size:11px; letter-spacing:0.3em; text-transform:uppercase; color:var(--ink-3); }
@media (min-width:1640px){ .hero__side{ display:block; } }
.hero__top{ position:absolute; top:clamp(96px,13vh,150px); left:var(--gut); right:var(--gut);
  display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.hero__idx{ font-family:var(--mono); font-size:12px; letter-spacing:0.2em; color:var(--ink-3); }
.hero__inner{ max-width:var(--maxw); margin-inline:auto; width:100%; }
.hero__title{ margin-left:-0.04em; }
.hero__title .accent{ font-style:italic; }
.hero__bottom{ display:grid; grid-template-columns:1.3fr 1fr; gap:clamp(24px,5vw,80px); align-items:end;
  margin-top:clamp(28px,4vw,52px); padding-top:28px; border-top:1px solid var(--line); }
.hero__lead-wrap{ display:flex; flex-direction:column; gap:22px; }
.hero__cta{ display:flex; gap:14px; flex-wrap:wrap; }
.hero__stats{ display:flex; gap:clamp(20px,3vw,46px); justify-content:flex-end; }
.stat .n{ font-family:var(--serif); font-size:clamp(2.2rem,3.4vw,3rem); line-height:1; font-variant-numeric:tabular-nums; }
.stat .l{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-3); margin-top:8px; }
.scrollcue{ font-family:var(--mono); font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink-3);
  display:flex; align-items:center; gap:10px; margin-top:18px; }
.scrollcue::before{ content:""; width:34px; height:1px; background:var(--accent); animation:cue 2.4s var(--ease) infinite; }
@keyframes cue{ 0%,100%{ transform:scaleX(.4); opacity:.4; transform-origin:left; } 50%{ transform:scaleX(1); opacity:1; transform-origin:left; } }

/* ============================================================ ABOUT */
.about{ display:grid; grid-template-columns:0.82fr 1.18fr; gap:clamp(28px,5vw,72px); align-items:center; }
.portrait{ position:relative; overflow:hidden; background:var(--paper-2); border-radius:var(--r-card); }
.portrait img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center top; will-change:transform; }
.portrait::after{ content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px var(--line-2); pointer-events:none; }
.portrait__tag{ position:absolute; left:16px; bottom:16px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--paper); background:var(--accent); padding:6px 11px; }
.about__copy{ max-width:60ch; }
.about__copy .h2{ margin-top:18px; }
.about__copy p{ margin-top:22px; color:var(--ink-2); max-width:54ch; }
.about__sign{ font-family:var(--serif); font-style:italic; font-size:1.7rem; color:var(--accent); margin-top:30px; }
.detail-row{ display:flex; gap:40px; margin-top:30px; flex-wrap:wrap; }
.detail{ display:flex; flex-direction:column; gap:4px; }
.detail .k{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-3); }
.detail .v{ font-size:1.02rem; }
a.detail:hover .v{ color:var(--accent); }

/* ============================================================ PROCESS */
.sechead{ display:flex; flex-direction:column; gap:16px; margin-bottom:clamp(36px,5vw,64px); }
.sechead--center{ align-items:center; text-align:center; }
.sechead--center .eyebrow{ justify-content:center; }
.process{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--line-2); }
.process--five{ grid-template-columns:repeat(5,1fr); }
.process--five .pstep{ padding:32px 22px 32px 20px; }
.process--five .pstep__n{ font-size:2.6rem; }
.process--five .pstep h3{ font-size:1.28rem; }
@media (max-width:1100px){ .process--five{ grid-template-columns:repeat(2,1fr); }
  .process--five .pstep{ border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .process--five .pstep:nth-child(odd){ padding-left:0; }
  .process--five .pstep:nth-child(even){ padding-left:22px; border-right:0; } }
.pstep{ padding:36px 30px 36px 24px; border-right:1px solid var(--line); }
.pstep:last-child{ border-right:0; }
.pstep__n{ font-family:var(--serif); font-size:3.2rem; line-height:1; color:var(--accent); }
.pstep__k{ font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-3); margin:14px 0 16px; }
.pstep h3{ font-family:var(--serif); font-size:1.5rem; }
.pstep p{ margin-top:14px; color:var(--ink-2); font-size:0.96rem; line-height:1.6; }

/* ============================================================ GALLERY */
.gal__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:36px; }
.filters{ display:flex; gap:6px; flex-wrap:wrap; }
.filter{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-3);
  background:none; border:1px solid transparent; padding:8px 14px; cursor:pointer; transition:.25s var(--ease); }
.filter:hover{ color:var(--ink); }
.filter.active{ color:var(--accent); border-color:var(--line-2); }
.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(8px,1vw,14px); }
.tile{ position:relative; overflow:hidden; background:var(--paper-2); cursor:pointer; aspect-ratio:1/1; border-radius:var(--r-card); }
.tile img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease), filter .5s var(--ease);
  filter:grayscale(0.18) contrast(1.04); }
.tile:hover img{ transform:scale(1.05); filter:grayscale(0) contrast(1.06); }
.tile__no{ position:absolute; top:12px; left:14px; font-family:var(--mono); font-size:11px; letter-spacing:0.1em; color:var(--paper);
  mix-blend-mode:difference; z-index:2; }
.tile__multi{ position:absolute; top:12px; right:14px; display:inline-flex; align-items:center; gap:5px;
  font-family:var(--mono); font-size:10px; color:var(--paper); background:rgba(20,16,10,0.5); padding:3px 7px; z-index:2; }
.tile__multi svg{ width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:1.6; }
.tile__meta{ position:absolute; left:0; right:0; bottom:0; padding:16px; z-index:2;
  background:linear-gradient(to top, rgba(18,15,10,0.82), transparent); color:var(--paper);
  transform:translateY(8px); opacity:0; transition:.4s var(--ease); }
.stage{ position:relative; padding:18px; }
/* terminal-style frame: corner brackets + hairline grid */
.stage__frame{ position:absolute; inset:0; pointer-events:none; z-index:3;
  background-image:linear-gradient(to right, rgba(24,21,15,0.04) 1px, transparent 1px),
                   linear-gradient(to bottom, rgba(24,21,15,0.04) 1px, transparent 1px);
  background-size:54px 54px; }
.stage__frame::before, .stage__frame::after{ content:""; position:absolute; width:18px; height:18px; }
.stage__frame::before{ top:0; left:0; border-top:1px solid var(--line-2); border-left:1px solid var(--line-2); }
.stage__frame::after{ top:0; right:0; border-top:1px solid var(--line-2); border-right:1px solid var(--line-2); }
.stage__corner{ position:absolute; bottom:0; width:18px; height:18px; pointer-events:none; z-index:3; }
.stage__corner.l{ left:0; border-bottom:1px solid var(--line-2); border-left:1px solid var(--line-2); }
.stage__corner.r{ right:0; border-bottom:1px solid var(--line-2); border-right:1px solid var(--line-2); }
.stage__tag{ position:absolute; z-index:4; font-family:var(--mono); font-size:10px; letter-spacing:0.2em;
  text-transform:uppercase; color:var(--ink-3); display:flex; gap:14px; }
.stage__tag .ac{ color:var(--accent); }
.stage__tag--tl{ top:13px; left:36px; } .stage__tag--tr{ top:13px; right:36px; }
.stage__tag--bl{ bottom:13px; left:36px; } .stage__tag--br{ bottom:13px; right:36px; }
.deck{ position:relative; height:540px; perspective:1500px; cursor:grab; touch-action:pan-y; user-select:none; }
.deck:active{ cursor:grabbing; }
.deck__vp{ position:absolute; inset:0; transform-style:preserve-3d; }
.dcard{ position:absolute; top:50%; left:50%; width:330px; height:470px; margin:-235px 0 0 -165px;
  transform-style:preserve-3d; will-change:transform; opacity:0; }
.dcard__inner{ position:relative; width:100%; height:100%; overflow:hidden; background:var(--ink);
  border:1px solid rgba(232,227,216,0.12);
  box-shadow:0 40px 70px -20px rgba(20,16,10,0.7), 0 8px 20px rgba(20,16,10,0.35); }
.dcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:grayscale(0.25) contrast(1.06); transition:filter .5s var(--ease), transform .9s var(--ease); }
.dcard.front img{ filter:grayscale(0) contrast(1.06); }
.dcard__no{ position:absolute; top:14px; left:16px; font-family:var(--mono); font-size:11px; letter-spacing:0.12em;
  color:var(--paper); z-index:2; }
.dcard__multi{ position:absolute; top:14px; right:16px; display:inline-flex; align-items:center; gap:5px;
  font-family:var(--mono); font-size:10px; color:var(--paper); background:rgba(20,16,10,0.5); padding:3px 7px; z-index:2; }
.dcard__multi svg{ width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:1.6; }
.dcard__meta{ position:absolute; left:0; right:0; bottom:0; padding:18px; z-index:2; color:var(--paper);
  background:linear-gradient(to top, rgba(14,11,7,0.86), transparent); }
.dcard__style{ font-family:var(--mono); font-size:10px; letter-spacing:0.16em; text-transform:uppercase; color:#E89A78; }
.dcard__title{ font-family:var(--serif); font-size:1.5rem; margin-top:4px; }
.dcard.hide{ display:none; }
.deck__hint{ margin-top:22px; display:flex; align-items:center; justify-content:center; gap:12px;
  font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-3); }
.deck__hint .bar{ width:40px; height:1px; background:var(--accent); }
.deck__progress{ font-variant-numeric:tabular-nums; color:var(--accent); }
/* fallback if GSAP fails to load: plain horizontal scroll row */
.deck.nofx{ height:auto; perspective:none; cursor:default; display:flex; gap:16px; overflow-x:auto;
  scroll-snap-type:x mandatory; padding-bottom:14px; }
.deck.nofx .deck__vp{ position:static; display:flex; gap:16px; transform:none; }
.deck.nofx .dcard{ position:static; margin:0; opacity:1; flex:0 0 auto; scroll-snap-align:center; cursor:pointer; }
@media (max-width:680px){
  .deck{ height:440px; }
  .dcard{ width:250px; height:360px; margin:-180px 0 0 -125px; }
  .stage__tag{ font-size:9px; letter-spacing:0.12em; }
  .stage__tag--tl,.stage__tag--bl{ left:30px; } .stage__tag--tr,.stage__tag--br{ right:30px; }
}

.tile:hover .tile__meta{ transform:none; opacity:1; }
.tile__style{ font-family:var(--mono); font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent); }
.tile__title{ font-family:var(--serif); font-size:1.3rem; margin-top:3px; }
.tile.hide{ display:none; }

/* ============================================================ PRICING (ruled table) */
.panel{ background:var(--paper-2); border-block:1px solid var(--line-2); }
.consult{ display:flex; justify-content:space-between; align-items:center; gap:24px 48px; flex-wrap:wrap;
  padding:30px 0; border-bottom:1px solid var(--line-2); }
.consult__l{ display:flex; align-items:baseline; gap:20px; flex-wrap:wrap; }
.consult__name{ font-family:var(--mono); font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-3); }
.consult__free{ font-family:var(--serif); font-style:italic; font-size:2.4rem; color:var(--accent); line-height:1; }
.consult p{ color:var(--ink-2); max-width:58ch; font-size:0.96rem; }
.rates{ border-top:1px solid var(--line); }
.rate{ display:grid; grid-template-columns:minmax(140px,1fr) 2.2fr auto auto; gap:18px 28px; align-items:center;
  padding:26px 0; border-bottom:1px solid var(--line); transition:padding .3s var(--ease); }
.rate:hover{ padding-inline:14px; background:var(--accent-soft); }
.rate__name{ font-family:var(--serif); font-size:1.5rem; display:flex; align-items:center; gap:12px; }
.rate__badge{ font-family:var(--mono); font-size:9.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--paper);
  background:var(--accent); padding:3px 8px; }
.rate__note{ color:var(--ink-3); font-size:0.92rem; max-width:48ch; }
.rate__price{ font-family:var(--serif); font-size:1.8rem; white-space:nowrap; }
.rate__price small{ font-family:var(--mono); font-size:11px; color:var(--ink-3); letter-spacing:0.04em; }
.rate__cta{ font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent);
  display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.rate__cta svg{ width:14px; height:14px; transition:transform .3s var(--ease); }
.rate:hover .rate__cta svg{ transform:translateX(4px); }

/* ============================================================ POLICIES */
.policies{ display:grid; grid-template-columns:0.7fr 1.3fr; gap:clamp(28px,5vw,64px); align-items:start; }
.polist{ display:grid; gap:0; border-top:1px solid var(--line-2); }
.pol{ display:grid; grid-template-columns:auto 1fr; gap:24px; padding:24px 0; border-bottom:1px solid var(--line); }
.pol__n{ font-family:var(--mono); font-size:12px; color:var(--accent); }
.pol__t{ font-family:var(--serif); font-size:1.35rem; margin-bottom:8px; }
.pol__b{ color:var(--ink-2); font-size:0.96rem; max-width:60ch; }

/* ============================================================ REVIEWS */
.rrating{ display:inline-flex; align-items:center; gap:9px; font-family:var(--mono); font-size:12px; letter-spacing:0.06em;
  color:var(--ink-2); border-bottom:1px solid var(--accent); padding-bottom:3px; margin-top:18px; }
.rrating b{ color:var(--accent); }
.reviews{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,24px); }
.review{ display:flex; flex-direction:column; padding:clamp(24px,2.4vw,34px);
  background:var(--paper-card); border:1px solid var(--line-2); border-radius:var(--r-card);
  box-shadow:0 18px 40px -28px rgba(20,16,10,0.6); }
.review__stars{ display:flex; gap:3px; color:var(--accent); }
.review__stars svg{ width:15px; height:15px; fill:currentColor; }
.review__q{ font-family:var(--serif); font-size:1.32rem; line-height:1.35; margin:18px 0 24px; flex:1; }
.review__a{ display:flex; align-items:center; gap:12px; }
.avatar{ width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:var(--paper);
  font-family:var(--serif); font-size:1.1rem; }
.review__name{ font-size:0.95rem; font-weight:500; }
.review__role{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-3); }

/* ============================================================ BOOKING */
.booking{ max-width:880px; margin-inline:auto; }
.booking__head{ text-align:center; margin-bottom:44px; }
.booking__head .lead{ margin-inline:auto; margin-top:18px; }
.igblock{ display:flex; align-items:center; gap:clamp(20px,4vw,48px); padding:clamp(24px,3.5vw,40px);
  background:var(--ink); color:var(--paper); }
.igblock__k{ font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent); }
.igblock__t{ font-size:1.05rem; line-height:1.55; color:#E8E3D8; max-width:44ch; margin:12px 0 22px; }
.igblock .btn{ background:var(--accent); border-color:var(--accent); }
.igblock .btn:hover{ background:var(--paper); border-color:var(--paper); color:var(--ink); }
.igqr{ flex:none; text-align:center; display:flex; flex-direction:column; align-items:center; }
.igqr img{ width:180px; height:180px; padding:12px; background:var(--paper); border-radius:18px;
  box-shadow:0 12px 40px -8px rgba(20,16,10,0.38), 0 2px 10px rgba(20,16,10,0.14); }
.igqr span{ display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-4); margin-top:9px; }
.or{ display:flex; align-items:center; gap:18px; margin:40px 0 34px; color:var(--ink-3); }
.or::before,.or::after{ content:""; flex:1; height:1px; background:var(--line); }
.or span{ font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px 28px; }
.field{ display:flex; flex-direction:column; gap:8px; }
.field--full{ grid-column:1/-1; }
.field label{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-3); }
.field input,.field select,.field textarea{ font-family:var(--sans); font-size:1rem; color:var(--ink);
  background:rgba(255,255,255,0.78); border:1px solid var(--line-2); border-radius:var(--r-input); padding:13px 14px;
  transition:border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease); }
.field input::placeholder,.field textarea::placeholder{ color:var(--ink-3); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--accent); background:#fff;
  box-shadow:0 0 0 3px var(--accent-soft); }
.field textarea{ resize:vertical; min-height:80px; }
.field select{ cursor:pointer; }
.form-foot{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-top:30px; }
.fstatus{ font-family:var(--mono); font-size:11px; letter-spacing:0.04em; color:var(--ink-3); }
.fstatus[data-state="error"]{ color:var(--accent); }
.sent{ text-align:center; padding:50px 20px; display:flex; flex-direction:column; align-items:center; gap:14px; }
.sent__mark{ width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--paper); }
.sent__mark svg{ width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.sent h3{ font-family:var(--serif); font-size:1.9rem; } .sent p{ color:var(--ink-3); max-width:40ch; }

/* ============================================================ VISIT */
.visit{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(28px,5vw,64px); align-items:center; }
.visit__info{ display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.map{ width:100%; border:1px solid var(--line-2); overflow:hidden; background:var(--paper-2); border-radius:var(--r-card); }
.map iframe{ display:block; width:100%; height:clamp(320px,46vh,460px); border:0; filter:grayscale(1) contrast(1.05) brightness(0.96); }

/* ============================================================ FOOTER */
.foot{ position:relative; z-index:1; border-top:1px solid var(--line-2); padding-block:clamp(48px,7vw,90px); }
.foot__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px; }
.foot__brand{ font-family:var(--serif); font-size:2.4rem; } .foot__brand i{ font-style:italic; color:var(--accent); padding-left:0.06em; }
.foot__brand + p{ color:var(--ink-3); max-width:32ch; margin-top:16px; font-size:0.95rem; }
.foot__h{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-3); margin-bottom:16px; }
.foot__nav{ display:flex; flex-direction:column; gap:11px; }
.foot__nav a{ font-size:0.98rem; color:var(--ink-2); width:max-content; transition:color .25s var(--ease); }
.foot__nav a:hover{ color:var(--accent); }
.foot__bottom{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:48px; padding-top:22px; border-top:1px solid var(--line);
  font-family:var(--mono); font-size:11px; letter-spacing:0.08em; color:var(--ink-3); }

/* ============================================================ LIGHTBOX */
.lb{ position:fixed; inset:0; z-index:120; display:none; place-items:center; padding:clamp(16px,4vw,48px);
  background:rgba(16,13,9,0.94); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.lb.open{ display:grid; }
.lb img#lbImg{ max-width:min(1040px,90vw); max-height:74vh; object-fit:contain; }
.lb__btn{ position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; display:grid; place-items:center;
  background:none; border:1px solid rgba(232,227,216,0.3); color:var(--paper); font-size:1.4rem; cursor:pointer; transition:.25s var(--ease); }
.lb__btn:hover{ border-color:var(--accent); color:var(--accent); }
.lb__prev{ left:clamp(8px,3vw,28px); } .lb__next{ right:clamp(8px,3vw,28px); }
.lb__close{ position:absolute; top:clamp(14px,3vw,26px); right:clamp(14px,3vw,26px); width:46px; height:46px; background:none;
  border:1px solid rgba(232,227,216,0.3); color:var(--paper); cursor:pointer; transition:.25s var(--ease); }
.lb__close:hover{ border-color:var(--accent); color:var(--accent); }
.lb__bar{ position:absolute; left:0; right:0; bottom:clamp(14px,3vw,28px); display:flex; flex-direction:column; align-items:center; gap:14px; color:var(--paper); }
.lb__meta{ font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; display:flex; gap:12px; }
.lb__meta .s{ color:var(--accent); }
.lb__thumbs{ display:flex; gap:8px; }
.lb__thumbs img{ width:46px; height:46px; object-fit:cover; opacity:0.45; cursor:pointer; transition:opacity .25s var(--ease); }
.lb__thumbs img.active{ opacity:1; outline:1px solid var(--accent); }
.lb__thumbs.single{ display:none; }

/* ============================================================ MOBILE BAR */
.mbar{ position:fixed; left:0; right:0; bottom:0; z-index:40; display:none; gap:10px;
  padding:10px max(var(--gut),12px) calc(10px + env(safe-area-inset-bottom,0px));
  background:rgba(255,255,255,0.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-top:1px solid var(--line); }
.mbar a{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; height:48px;
  font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; }
.mbar__ig{ border:1px solid var(--line-2); color:var(--ink); }
.mbar__book{ background:var(--accent); color:var(--paper); }
.mbar svg{ width:16px; height:16px; }

/* ============================================================ RESPONSIVE */
@media (max-width:1000px){
  .nav__links{ display:none; }
  .burger{ display:flex; }
  .nav__right .btn{ display:none; }
  .about,.policies,.visit{ grid-template-columns:1fr; }
  .hero__bottom{ grid-template-columns:1fr; }
  .hero__stats{ justify-content:flex-start; }
  .process{ grid-template-columns:1fr; }
  .process--five{ grid-template-columns:1fr; }
  .process--five .pstep{ padding-left:0; border-right:0; }
  .pstep{ border-right:0; border-bottom:1px solid var(--line); padding-right:0; }
  .reviews{ grid-template-columns:1fr; }
  .grid{ grid-template-columns:repeat(2,1fr); }
  .tile,.tile:nth-child(1),.tile:nth-child(4),.tile:nth-child(7),.tile:nth-child(15){ grid-column:span 1; aspect-ratio:1/1; }
  .foot__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:680px){
  .mbar{ display:flex; }
  .hero__side{ display:none; }
  .navmenu{ gap:2px; padding:12vh var(--gut) 6vh; }
  .navmenu a{ font-size:clamp(1.5rem,7vw,2rem); line-height:1.5; gap:12px; }
  .navmenu a::before{ font-size:0.7rem; }
  .navmenu__foot{ margin-top:4vh; }
  .navmenu__foot .btn--lg{ padding:14px 20px; font-size:12px; }
  .form-grid{ grid-template-columns:1fr; }
  .igblock{ flex-direction:column-reverse; text-align:center; align-items:center; }
  .rate{ grid-template-columns:1fr auto; gap:6px 16px; }
  .rate__note{ grid-column:1/-1; order:3; }
  .rate__cta{ grid-column:1/-1; order:4; }
  .foot__grid{ grid-template-columns:1fr; }
  .detail-row{ gap:24px; }
}