/* ============================================================
   DIAGONAL — Hair Salon · Donostia / San Sebastián
   Editorial · fashion · pure white + black. Colour in imagery.
   Type: Jost (display) · Hanken Grotesk (body) · Newsreader (serif)
   ============================================================ */

:root {
  --black:#0a0a0a; --white:#ffffff; --grey:#7d7d7d; --ink2:#2a2a2a;
  --line:#1c1c1c;                 /* visible hairline (thicker, darker) */
  --line-soft:rgba(10,10,10,0.18);
  --ff-display:"Jost",system-ui,sans-serif;
  --ff-body:"Hanken Grotesk",system-ui,sans-serif;
  --ff-serif:"Newsreader",Georgia,serif;
  --ease:cubic-bezier(0.22,0.61,0.36,1);
  --t-med:0.6s; --t-slow:0.8s;
  --pad-x:clamp(1.25rem,4vw,3.5rem);   /* aligns everything to the header */
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--white);color:var(--black);
  font-family:var(--ff-body);font-weight:400;font-size:18px;line-height:1.7;
  letter-spacing:0.01em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.no-scroll{overflow:hidden;}
img,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--black);color:var(--white);}
h1,h2,h3,h4,p{margin:0;}

/* bilingual show/hide */
html[data-lang="es"] [lang-only="en"]{display:none !important;}
html[data-lang="en"] [lang-only="es"]{display:none !important;}

/* ---------- type primitives ---------- */
.kicker{font-family:var(--ff-body);font-weight:500;font-size:0.74rem;letter-spacing:0.36em;
  text-transform:uppercase;color:var(--black);}
.kicker.muted{color:var(--grey);}

/* serif script line, e.g. "Hair as an art form" */
.script{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(1.9rem,4.6vw,3.6rem);line-height:1.06;letter-spacing:0;color:var(--black);}

/* the big sans display headline */
.display{font-family:var(--ff-display);font-weight:200;
  font-size:clamp(2.9rem,8.6vw,8rem);line-height:0.94;letter-spacing:-0.018em;
  text-transform:uppercase;text-wrap:balance;}
.display.tight{line-height:0.9;}

/* a big italic serif display, e.g. "Designed" / "Beauty" */
.display-serif{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(3.2rem,11vw,10rem);line-height:0.92;letter-spacing:-0.01em;text-wrap:balance;}

.lede{font-family:var(--ff-body);font-weight:300;font-size:clamp(1.15rem,1.55vw,1.4rem);
  line-height:1.6;max-width:42ch;}
.body-copy{font-size:1.02rem;line-height:1.75;color:var(--ink2);max-width:48ch;}
.body-copy p+p{margin-top:1.3rem;}

/* right-aligned italic word stacks (Light / Shape / Movement) */
.word-stack{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(1.5rem,3vw,2.4rem);line-height:1.5;color:var(--black);}
.word-stack .tag{display:block;margin-top:1rem;font-family:var(--ff-body);font-style:normal;
  font-weight:600;font-size:0.7rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--black);}

/* ---------- wordmark ---------- */
.wordmark{display:inline-flex;flex-direction:column;line-height:1;user-select:none;}
.wordmark .wm-main{font-family:var(--ff-display);font-weight:300;letter-spacing:0.42em;
  text-indent:0.42em;font-size:1.1rem;}
.wordmark .wm-sub{font-family:var(--ff-display);font-weight:300;letter-spacing:0.5em;
  text-indent:0.5em;font-size:0.46rem;margin-top:0.5em;color:var(--grey);}

/* ============================================================
   PRELOADER — black → centred logo → diagonal white wipe → white
   ============================================================ */
.preloader{position:fixed;inset:0;z-index:1000;background:var(--black);overflow:hidden;
  transition:opacity 0.9s var(--ease),visibility 0.9s var(--ease);}
.preloader.is-done{opacity:0;visibility:hidden;}
/* white panel that sweeps diagonally across to cover the screen */
.pl-wipe{position:absolute;top:-60%;left:-60%;width:220%;height:220%;background:var(--white);
  transform:rotate(-32deg) translateY(140%);will-change:transform;
  animation:pl-sweep 1.7s var(--ease) 1.7s forwards;}
@keyframes pl-sweep{to{transform:rotate(-32deg) translateY(0%);}}
/* centred logo, dissolves as the wipe advances */
.pl-logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(38vw,300px);z-index:2;opacity:0;animation:pl-logo-in 1s var(--ease) 0.2s forwards,
  pl-logo-out 1s var(--ease) 1.9s forwards;}
.pl-logo img{width:100%;height:auto;display:block;}
@keyframes pl-logo-in{from{opacity:0;transform:translate(-50%,-50%) scale(0.94);}
  to{opacity:1;transform:translate(-50%,-50%) scale(1);}}
@keyframes pl-logo-out{to{opacity:0;}}
/* thin diagonal guideline that draws first */
.pl-line{position:absolute;inset:0;z-index:1;pointer-events:none;}
.pl-line line{stroke:rgba(255,255,255,0.35);stroke-width:1.2;vector-effect:non-scaling-stroke;
  stroke-dasharray:1;stroke-dashoffset:1;animation:pl-draw 1.5s var(--ease) 0.3s forwards;}
@keyframes pl-draw{to{stroke-dashoffset:0;}}
@media (prefers-reduced-motion:reduce){
  .pl-wipe{animation-duration:.01ms;animation-delay:0s;}
  .pl-logo{animation:pl-logo-in .01ms forwards;}
  .pl-line line{animation:none;stroke-dashoffset:0;}
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;
  justify-content:space-between;padding:clamp(1rem,2.2vw,1.7rem) var(--pad-x);
  background:rgba(255,255,255,0.82);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid transparent;transition:border-color var(--t-med) var(--ease);}
.site-header.scrolled{border-bottom-color:var(--line-soft);}
.brand-logo{display:flex;align-items:center;}
.brand-logo img{height:clamp(46px,5vw,60px);width:auto;display:block;}
.header-right{display:flex;align-items:center;gap:clamp(1.1rem,2.4vw,2.2rem);}
.lang-toggle{display:inline-flex;align-items:center;gap:0.4rem;font-family:var(--ff-body);
  font-size:0.74rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--grey);}
.lang-toggle button{appearance:none;background:none;border:0;cursor:pointer;font:inherit;
  letter-spacing:inherit;color:var(--grey);padding:0;transition:color var(--t-med) var(--ease);}
.lang-toggle button:hover,.lang-toggle button.active{color:var(--black);}
.lang-toggle .sep{opacity:0.4;}
.menu-toggle{appearance:none;background:none;border:0;padding:0.4rem;cursor:pointer;color:var(--black);
  display:inline-flex;flex-direction:column;gap:7px;width:32px;}
.menu-toggle span{display:block;height:1.5px;width:100%;background:currentColor;}
.menu-toggle span:nth-child(2){width:64%;align-self:flex-end;}

/* ============================================================
   FULLSCREEN MENU
   ============================================================ */
.fs-menu{position:fixed;inset:0;z-index:300;background:var(--black);color:var(--white);
  display:grid;grid-template-rows:auto 1fr auto;padding:clamp(1rem,2.2vw,1.7rem) var(--pad-x) clamp(2rem,5vh,3.5rem);
  opacity:0;visibility:hidden;transition:opacity var(--t-slow) var(--ease),visibility var(--t-slow) var(--ease);}
.fs-menu.open{opacity:1;visibility:visible;}
.fs-menu-top{display:flex;align-items:center;justify-content:space-between;}
.fs-menu-top .brand-logo img{height:clamp(46px,5vw,60px);}
.fs-close{appearance:none;background:none;border:0;color:inherit;cursor:pointer;font-family:var(--ff-body);
  font-size:0.7rem;letter-spacing:0.3em;text-transform:uppercase;display:inline-flex;align-items:center;gap:0.8rem;}
.fs-close .x{position:relative;width:20px;height:20px;}
.fs-close .x::before,.fs-close .x::after{content:"";position:absolute;top:50%;left:0;width:100%;height:1.5px;background:currentColor;}
.fs-close .x::before{transform:rotate(45deg);} .fs-close .x::after{transform:rotate(-45deg);}
.fs-nav{align-self:center;display:flex;flex-direction:column;gap:clamp(0.1rem,0.6vh,0.5rem);padding:2rem 0;}
.fs-nav a{font-family:var(--ff-display);font-weight:200;font-size:clamp(2.8rem,8.5vw,6.5rem);
  line-height:1.04;color:rgba(255,255,255,0.55);width:max-content;position:relative;
  opacity:0;transform:translateY(16px);transition:color var(--t-med) var(--ease);}
.fs-menu.open .fs-nav a{animation:fs-rise 0.7s var(--ease) forwards;}
@keyframes fs-rise{to{opacity:1;transform:translateY(0);}}
.fs-nav a .idx{font-family:var(--ff-body);font-weight:400;font-size:0.62rem;letter-spacing:0.2em;
  color:rgba(255,255,255,0.4);vertical-align:super;margin-right:0.7rem;}
.fs-nav a:hover,.fs-nav a.current{color:var(--white);}
.fs-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,0.18);padding-top:clamp(1.4rem,3vh,2.2rem);}
.fs-foot .col-label{font-family:var(--ff-body);font-size:0.62rem;letter-spacing:0.3em;
  text-transform:uppercase;color:rgba(255,255,255,0.5);margin-bottom:1rem;}
.social{display:flex;flex-direction:column;gap:0.7rem;}
.social a{display:inline-flex;align-items:center;gap:0.7rem;font-family:var(--ff-body);font-size:0.95rem;
  transition:opacity var(--t-med) var(--ease);}
.social a:hover{opacity:0.55;}
.social svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;}
.fs-foot .social a{color:rgba(255,255,255,0.85);}
.fs-contact{text-align:right;}
.fs-contact a{display:block;}
.fs-contact .tel{font-family:var(--ff-display);font-weight:300;font-size:clamp(1.4rem,3vw,2rem);
  letter-spacing:0.04em;color:var(--white);}
.fs-contact .addr{font-size:0.8rem;color:rgba(255,255,255,0.5);line-height:1.5;margin-top:0.6rem;}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.7rem;font-family:var(--ff-body);
  font-weight:500;font-size:0.76rem;letter-spacing:0.22em;text-transform:uppercase;padding:1.15rem 2.4rem;
  border:1.5px solid var(--black);cursor:pointer;white-space:nowrap;
  transition:background var(--t-med) var(--ease),color var(--t-med) var(--ease),border-color var(--t-med) var(--ease);}
.btn svg{width:14px;height:14px;}
.btn-primary{background:var(--black);color:var(--white);}
.btn-primary:hover{background:#2b2b2b;border-color:#2b2b2b;}
.btn-ghost{background:transparent;color:var(--black);border-color:var(--black);font-weight:500;}
.btn-ghost:hover{background:var(--black);color:var(--white);}
/* book link with arrow */
.book-link{display:inline-flex;align-items:center;gap:1rem;font-family:var(--ff-body);font-weight:500;
  font-size:0.8rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--black);
  transition:gap var(--t-med) var(--ease);}
.book-link:hover{gap:1.6rem;}
.book-link .ar{font-size:1.1rem;line-height:1;}

/* ============================================================
   LAYOUT
   ============================================================ */
.edge{padding-left:var(--pad-x);padding-right:var(--pad-x);}
section{position:relative;}
.section-pad{padding-top:clamp(4.5rem,12vh,11rem);padding-bottom:clamp(4.5rem,12vh,11rem);}
.page-top{padding-top:clamp(7rem,13vh,10rem);}   /* clears fixed header */
.reveal{opacity:0;transform:translateY(30px);transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease);will-change:opacity,transform;}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:0.1s;} .reveal.d2{transition-delay:0.2s;} .reveal.d3{transition-delay:0.3s;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

figure{margin:0;}
.hero-img{width:100%;height:clamp(320px,52vh,640px);object-fit:cover;background:#eee;}
.hero-meta{display:flex;justify-content:space-between;gap:1rem;margin-top:0.9rem;
  font-size:0.66rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--grey);}

/* editorial display pair: kicker + script + display */
.lead-block{display:flex;flex-direction:column;gap:1.1rem;}
.lead-block .display{margin-top:0.3rem;}

/* two-column editorial body row */
.ed-row{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(2.5rem,7vw,7rem);align-items:start;}
.ed-row .right{justify-self:end;text-align:right;}

/* ---------- HOME: hero video ---------- */
.hero-film video{width:100%;height:auto;max-height:86vh;object-fit:cover;background:#111;}
.hero-film .hero-meta{margin-top:1rem;}

/* ---------- HOME: editorial nav (right column) ---------- */
.ed-nav{display:flex;flex-direction:column;gap:clamp(1.1rem,2.4vh,1.8rem);}
.ed-nav button{appearance:none;background:none;border:0;cursor:pointer;text-align:right;padding:0;
  display:flex;flex-direction:column;align-items:flex-end;gap:0.25rem;color:var(--black);
  transition:opacity var(--t-med) var(--ease);}
.ed-nav button .n{font-family:var(--ff-body);font-size:0.66rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--grey);}
.ed-nav button .w{font-family:var(--ff-serif);font-style:italic;font-weight:300;font-size:clamp(1.5rem,3vw,2.3rem);line-height:1;
  position:relative;}
.ed-nav button .w::after{content:"";position:absolute;right:0;bottom:-4px;width:0;height:1.5px;background:var(--black);transition:width var(--t-med) var(--ease);}
.ed-nav button:hover .w::after{width:100%;}
.ed-nav button.active .w{color:var(--black);}
.ed-nav button .w .arrow{position:absolute;left:-1.6em;top:50%;transform:translateY(-50%);font-style:normal;opacity:0;transition:opacity var(--t-med) var(--ease);}
.ed-nav button.active .w .arrow{opacity:1;}

.rule-line{display:flex;align-items:center;gap:1.5rem;margin-top:clamp(2rem,5vh,3.5rem);}
.rule-line .script{flex:none;}
.rule-line .ln{flex:1;height:1.5px;background:var(--line);}

/* ---------- HOME: feature row (Movement) ---------- */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center;}
.feature .feat-media img{width:100%;height:auto;}
.feature .feat-text .num{font-family:var(--ff-body);font-size:0.72rem;letter-spacing:0.22em;
  text-transform:uppercase;color:var(--grey);margin-bottom:0.8rem;}
.feature .feat-text .name{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(2.4rem,5.5vw,4.4rem);line-height:1;margin-bottom:1.4rem;}

/* ---------- index list ---------- */
.index-list{border-top:1.5px solid var(--line);}
.index-list a{display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;
  padding:clamp(1.3rem,3vh,2.4rem) 0;border-bottom:1.5px solid var(--line);transition:padding-left var(--t-med) var(--ease);}
.index-list a:hover{padding-left:1rem;}
.index-list .ix-name{font-family:var(--ff-display);font-weight:200;font-size:clamp(2rem,5.4vw,4.2rem);
  line-height:1;text-transform:uppercase;}
.index-list .ix-num{font-family:var(--ff-body);font-size:0.74rem;letter-spacing:0.2em;color:var(--grey);}

/* ---------- About / Borja ---------- */
.about{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2.5rem,7vw,7rem);align-items:start;}
.about .about-media img{width:100%;height:auto;}
.about .about-name{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(2.8rem,6vw,5rem);line-height:1;margin:0.5rem 0 1.6rem;}

/* ============================================================
   EDITORIAL FULLSCREEN VIEWER (home nav opens this)
   ============================================================ */
.ev{position:fixed;inset:0;z-index:500;background:var(--white);opacity:0;visibility:hidden;
  transition:opacity var(--t-slow) var(--ease),visibility var(--t-slow) var(--ease);}
.ev.open{opacity:1;visibility:visible;}
.ev-top{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;align-items:center;
  justify-content:space-between;padding:clamp(1rem,2.2vw,1.7rem) var(--pad-x);}
.ev-count{font-family:var(--ff-body);font-size:0.72rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--grey);}
.ev-close{appearance:none;background:none;border:0;cursor:pointer;font-family:var(--ff-body);
  font-size:0.7rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--black);display:inline-flex;align-items:center;gap:0.7rem;}
.ev-close .x{position:relative;width:20px;height:20px;}
.ev-close .x::before,.ev-close .x::after{content:"";position:absolute;top:50%;left:0;width:100%;height:1.5px;background:currentColor;}
.ev-close .x::before{transform:rotate(45deg);} .ev-close .x::after{transform:rotate(-45deg);}
.ev-viewport{position:absolute;inset:0;overflow:hidden;}
.ev-track{display:flex;height:100%;transition:transform var(--t-slow) var(--ease);}
.ev-slide{flex:0 0 100%;height:100%;display:grid;grid-template-columns:1fr 1fr;align-items:center;
  gap:clamp(2rem,6vw,6rem);padding:clamp(5.5rem,12vh,8rem) var(--pad-x) clamp(3rem,8vh,5rem);}
.ev-slide .ev-media{height:100%;max-height:78vh;display:flex;align-items:center;}
.ev-slide .ev-media img{width:100%;height:100%;max-height:78vh;object-fit:cover;background:#f0f0f0;}
.ev-slide .ev-text .num{font-family:var(--ff-body);font-size:0.74rem;letter-spacing:0.24em;
  text-transform:uppercase;color:var(--grey);margin-bottom:1rem;}
.ev-slide .ev-text .name{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(3rem,7vw,6rem);line-height:0.95;margin-bottom:1.6rem;}
.ev-slide .ev-text .desc{font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.7;color:var(--ink2);max-width:42ch;}
.ev-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;appearance:none;background:none;
  border:0;cursor:pointer;color:var(--black);width:54px;height:54px;display:grid;place-items:center;
  transition:opacity var(--t-med) var(--ease);}
.ev-arrow svg{width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1;}
.ev-arrow.prev{left:clamp(0.3rem,1.5vw,1.5rem);} .ev-arrow.next{right:clamp(0.3rem,1.5vw,1.5rem);}
.ev-arrow:hover{opacity:0.5;}
.ev-dots{position:absolute;bottom:clamp(1.4rem,4vh,2.6rem);left:0;right:0;z-index:3;display:flex;
  justify-content:center;gap:0.7rem;}
.ev-dots button{appearance:none;border:0;cursor:pointer;width:30px;height:1.5px;background:rgba(10,10,10,0.2);padding:0;
  transition:background var(--t-med) var(--ease);}
.ev-dots button.active{background:var(--black);}

/* ============================================================
   ACCORDION (services) + FAQ
   ============================================================ */
.acc{border-top:1.5px solid var(--line);}
.acc-item{border-bottom:1.5px solid var(--line);}
.acc-head{width:100%;appearance:none;background:none;border:0;cursor:pointer;display:flex;align-items:center;
  justify-content:space-between;gap:1.5rem;padding:clamp(1.3rem,3vh,2.1rem) 0;text-align:left;color:var(--black);}
.acc-head .t{font-family:var(--ff-display);font-weight:300;font-size:clamp(1.4rem,3.4vw,2.4rem);
  line-height:1.05;text-transform:uppercase;letter-spacing:0.01em;}
.acc-head .chev{flex:none;width:22px;height:22px;position:relative;transition:transform var(--t-med) var(--ease);}
.acc-head .chev::before,.acc-head .chev::after{content:"";position:absolute;top:50%;width:12px;height:1.5px;background:var(--black);}
.acc-head .chev::before{left:1px;transform:rotate(45deg);} .acc-head .chev::after{right:1px;transform:rotate(-45deg);}
.acc-item.open .acc-head .chev{transform:rotate(180deg);}
.acc-body{max-height:0;overflow:hidden;transition:max-height var(--t-slow) var(--ease);}
.acc-body-inner{padding:0 0 clamp(1.6rem,3.5vh,2.6rem);max-width:60ch;}
.acc-body-inner .lead-i{font-family:var(--ff-serif);font-style:italic;font-weight:300;
  font-size:clamp(1.2rem,2vw,1.6rem);line-height:1.4;color:var(--black);margin-bottom:1rem;}
.acc-body-inner p{font-size:1rem;line-height:1.7;color:var(--ink2);margin:0 0 0.9rem;}
.acc-body-inner p:last-child{margin-bottom:0;}
.faq .acc-head .t{font-family:var(--ff-body);font-weight:500;font-size:clamp(1.05rem,1.8vw,1.4rem);
  text-transform:none;letter-spacing:0.01em;}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{border-top:1.5px solid var(--line);padding:clamp(3.5rem,8vh,6rem) 0 2.6rem;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:clamp(2rem,4vw,3.5rem);}
.footer-col .col-label{font-family:var(--ff-body);font-size:0.6rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--grey);margin:0 0 1.3rem;}
.footer-brand .brand-logo img{height:54px;width:auto;}
.footer-addr{font-style:normal;line-height:1.8;font-size:0.95rem;color:var(--ink2);margin-top:1.4rem;}
.footer-addr .name{color:var(--black);}
.footer-links{display:flex;flex-direction:column;gap:0.7rem;}
.footer-links a{font-size:0.95rem;color:var(--ink2);width:max-content;transition:color var(--t-med) var(--ease);}
.footer-links a:hover,.footer-links a.current{color:var(--black);}
.footer-col .social a{color:var(--ink2);}
.footer-tel a{font-family:var(--ff-display);font-weight:300;font-size:clamp(1.3rem,2.4vw,1.8rem);letter-spacing:0.03em;color:var(--black);}
.footer-contact-row{display:flex;gap:0.7rem;margin-top:1.3rem;flex-wrap:wrap;}
.footer-contact-row .btn{padding:0.8rem 1.4rem;font-size:0.64rem;}
.seo-keywords{margin-top:clamp(2.6rem,6vh,4rem);padding-top:2rem;border-top:1px solid var(--line-soft);
  display:flex;flex-wrap:wrap;gap:0.5rem 1.4rem;}
.seo-keywords span{font-size:0.72rem;letter-spacing:0.04em;color:var(--grey);}
.seo-keywords span::before{content:"—  ";color:rgba(10,10,10,0.3);}
.footer-base{margin-top:clamp(2.5rem,5vh,3.5rem);display:flex;justify-content:space-between;align-items:center;
  gap:1.5rem;flex-wrap:wrap;font-size:0.72rem;letter-spacing:0.05em;color:var(--grey);}
.footer-base .legal-row{display:flex;gap:1.5rem;flex-wrap:wrap;}
.footer-base a:hover{color:var(--black);}

/* ============================================================
   LEGAL PAGES
   ============================================================ */
.legal-main{max-width:820px;margin:0 auto;padding:clamp(8rem,16vh,12rem) var(--pad-x) clamp(4rem,10vh,8rem);}
.legal-head h1{font-family:var(--ff-display);font-weight:200;font-size:clamp(2.6rem,7vw,5rem);line-height:1;margin:0.8rem 0 0;letter-spacing:-0.01em;text-transform:uppercase;}
.legal-updated{font-size:0.8rem;color:var(--grey);margin-top:1.2rem;}
.legal-body{font-size:1.02rem;color:var(--ink2);margin-top:clamp(2rem,5vh,3.5rem);}
.legal-body h2{font-family:var(--ff-display);font-weight:300;font-size:clamp(1.4rem,3vw,2rem);color:var(--black);margin:clamp(2.4rem,6vh,3.6rem) 0 1rem;padding-top:2rem;border-top:1.5px solid var(--line);text-transform:uppercase;}
.legal-body h3{font-family:var(--ff-body);font-weight:600;font-size:1.05rem;color:var(--black);margin:1.6rem 0 0.6rem;}
.legal-body p{margin:0 0 1.1rem;}
.legal-body ul{margin:0 0 1.3rem;padding-left:1.2rem;}
.legal-body li{margin-bottom:0.5rem;}
.legal-body a{text-decoration:underline;text-underline-offset:3px;}
.legal-body .data-table{width:100%;border-collapse:collapse;margin:1.2rem 0 1.6rem;font-size:0.92rem;}
.legal-body .data-table th,.legal-body .data-table td{text-align:left;padding:0.85rem 1rem;border:1.5px solid var(--line);vertical-align:top;}
.legal-body .data-table th{font-family:var(--ff-body);font-weight:600;color:var(--black);}
.back-link{display:inline-flex;align-items:center;gap:0.6rem;font-size:0.72rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--grey);margin-top:3rem;transition:gap var(--t-med) var(--ease),color var(--t-med) var(--ease);}
.back-link:hover{gap:1rem;color:var(--black);}

/* ============================================================
   COOKIE POP-UP — bottom-left
   ============================================================ */
.cookie{position:fixed;left:clamp(1rem,3vw,2.4rem);bottom:clamp(1rem,3vw,2.4rem);z-index:400;
  width:min(380px,calc(100vw - 2rem));background:var(--white);color:var(--black);border:1.5px solid var(--black);
  padding:1.7rem 1.7rem 1.5rem;transform:translateY(20px);opacity:0;visibility:hidden;
  transition:transform var(--t-slow) var(--ease),opacity var(--t-slow) var(--ease),visibility var(--t-slow) var(--ease);}
.cookie.show{transform:none;opacity:1;visibility:visible;}
.cookie .ck-label{font-family:var(--ff-body);font-size:0.58rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--grey);margin-bottom:0.8rem;}
.cookie h4{font-family:var(--ff-display);font-weight:300;font-size:1.25rem;margin:0 0 0.6rem;text-transform:uppercase;}
.cookie p{font-size:0.85rem;line-height:1.6;color:var(--ink2);margin:0 0 1.3rem;}
.cookie p a{text-decoration:underline;text-underline-offset:2px;}
.cookie-actions{display:flex;gap:0.5rem;flex-wrap:wrap;align-items:center;}
.cookie-actions .btn{padding:0.75rem 1.2rem;font-size:0.62rem;letter-spacing:0.16em;}
.ck-config-link{background:none;border:0;cursor:pointer;font-family:var(--ff-body);font-size:0.72rem;color:var(--grey);text-decoration:underline;text-underline-offset:3px;padding:0;}
.ck-config-link:hover{color:var(--black);}
.ck-save{display:none;}
.cookie.config .ck-save{display:inline-flex;}
.cookie.config .ck-config-link{display:none;}
.ck-prefs{display:none;margin:0 0 1.2rem;}
.cookie.config .ck-prefs{display:block;}
.cookie.config .cookie-intro{display:none;}
.ck-row{display:flex;align-items:flex-start;justify-content:space-between;gap:0.8rem;padding:0.9rem 0;border-top:1px solid var(--line-soft);}
.ck-row:first-child{border-top:0;}
.ck-row .t{font-family:var(--ff-body);font-weight:600;font-size:0.85rem;}
.ck-row .d{font-size:0.76rem;color:var(--grey);margin-top:0.2rem;line-height:1.45;}
.tgl{position:relative;width:40px;height:21px;flex:none;margin-top:0.15rem;}
.tgl input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;}
.tgl .track{position:absolute;inset:0;border:1.5px solid var(--black);border-radius:999px;transition:background var(--t-med) var(--ease);}
.tgl .track::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;background:var(--black);border-radius:50%;transition:transform var(--t-med) var(--ease),background var(--t-med) var(--ease);}
.tgl input:checked + .track{background:var(--black);}
.tgl input:checked + .track::after{transform:translateX(19px);background:var(--white);}
.tgl.locked .track{background:var(--black);opacity:0.45;}
.tgl.locked .track::after{transform:translateX(19px);background:var(--white);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:980px){
  .ed-row,.feature,.about,.contact-grid{grid-template-columns:1fr;gap:2.5rem;}
  .ed-row .right{justify-self:start;text-align:left;}
  .ed-nav{align-items:flex-start;}
  .ed-nav button{text-align:left;align-items:flex-start;}
  .ed-nav button .w::after{left:0;right:auto;}
  .ev-slide{grid-template-columns:1fr;gap:1.6rem;overflow-y:auto;align-content:start;
    padding-top:clamp(4.5rem,10vh,6rem);}
  .ev-slide .ev-media{max-height:46vh;} .ev-slide .ev-media img{max-height:46vh;}
  .ev-arrow{display:none;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:2.5rem 2rem;}
  .footer-brand{grid-column:1 / -1;}
}
@media (max-width:560px){
  body{font-size:17px;}
  :root{--pad-x:1.25rem;}
  /* keep big words from breaking on phones */
  .display{font-size:clamp(2.5rem,12vw,3.6rem);hyphens:none;word-break:normal;overflow-wrap:normal;}
  .display-serif{font-size:clamp(3rem,16vw,5rem);hyphens:none;}
  .script{font-size:clamp(1.7rem,7vw,2.4rem);}
  .footer-grid{grid-template-columns:1fr;}
  .cookie{width:calc(100vw - 2rem);}
  .cookie-actions{flex-direction:column;align-items:stretch;}
  .cookie-actions .btn{width:100%;}
  .index-list .ix-name{font-size:2.1rem;}
  .footer-contact-row{flex-direction:column;align-items:stretch;}
}

/* contact page helpers */
.contact-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:clamp(2.5rem,7vw,6rem);align-items:start;}
.contact-block .c-label{font-size:0.66rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--grey);margin-bottom:0.9rem;}
.contact-block .c-big{font-family:var(--ff-display);font-weight:300;font-size:clamp(1.8rem,4vw,3rem);letter-spacing:0.02em;display:inline-block;}
.contact-cta{display:flex;gap:0.8rem;flex-wrap:wrap;margin-top:1.4rem;}
.contact-block .social{margin-top:0.2rem;}
