/* Shared design system — reset, tokens, layout primitives, nav/footer chrome.
   Linked from every page. One-off styling stays inline in the page that uses
   it; only reusable cross-page primitives live here. */

:root{
  --ink:#080808;
  --ink-soft:#151515;
  --paper:#ffffff;
  --paper-warm:#f5f3ee;
  --stone:#8a8882;
  --gold:#a58a52;
  --gold-dark:#806a3d;

  --font-serif:'Cormorant Garamond',serif;
  --font-sans:'Inter',sans-serif;

  --space-xs: clamp(0.5rem, 0.4rem + 0.5vw, 0.75rem);
  --space-sm: clamp(0.75rem, 0.6rem + 0.75vw, 1rem);
  --space-md: clamp(1rem, 0.85rem + 0.75vw, 1.5rem);
  --space-lg: clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem);
  --space-xl: clamp(2rem, 1.6rem + 2vw, 3rem);
  --space-2xl: clamp(2.5rem, 1.8rem + 3.5vw, 4.5rem);
  --space-3xl: clamp(3rem, 2rem + 5vw, 6rem);
  --space-4xl: clamp(4rem, 2.5rem + 7.5vw, 9rem);

  --container-max: 90rem;
  --container-pad: clamp(1.25rem, 4vw, 4rem);

  --fs-eyebrow: clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
  --fs-body: clamp(1rem, 0.95rem + 0.25vw, 1.1rem);
  --fs-body-sm: clamp(0.9rem, 0.87rem + 0.15vw, 0.95rem);
  --fs-h1: clamp(2.5rem, 1.6rem + 6vw, 6rem);
  --fs-h2: clamp(1.9rem, 1.4rem + 3vw, 3.4rem);
  --fs-h3: clamp(1.4rem, 1.15rem + 1.4vw, 2rem);
  --fs-number: clamp(1.8rem, 1.4rem + 2.5vw, 3.4rem);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
}
body{margin:0;overflow-x:hidden;font-family:var(--font-sans);color:var(--ink);background:var(--paper)}
::selection{background:var(--ink);color:#fff}
a{color:var(--ink);text-decoration:none}
/* :where() keeps this hover colour weaker than any class that sets its own link colour */
a:where(:hover){color:var(--ink-soft)}
img{display:block;max-width:100%;height:auto}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

h1,h2{font-family:var(--font-serif);font-weight:500}
h1{font-size:var(--fs-h1);line-height:1.05;margin:0 0 var(--space-2xl)}
h2{font-size:var(--fs-h2);margin:0 0 var(--space-lg)}
.subhead{font-size:var(--fs-h3);margin:var(--space-2xl) 0 var(--space-md)}

.container{
  width:min(100% - 2 * var(--container-pad), var(--container-max));
  margin-inline:auto;
}
.container-narrow{max-width:44rem}
.container-max-auto{max-width:var(--container-max);margin:0 auto}
.center-lg{max-width:56rem;margin:0 auto;text-align:center}
.center-md{max-width:44rem;margin:0 auto;text-align:center}
.col-lg{max-width:36rem}
.col-md{max-width:34rem}
.stack-col{display:flex;flex-direction:column}

.image-frame{position:relative;overflow:hidden}
.image-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:11px;letter-spacing:0.14em;padding:16px 30px;
  border:1px solid var(--gold-dark);white-space:normal;text-align:center;
  min-height:44px;transition:background .3s,color .3s,border-color .3s;
}
.btn-solid{background:var(--ink);color:#fff;border-color:var(--gold)}
.btn-solid:hover{background:transparent;color:var(--ink);border-color:var(--gold-dark)}
.btn-outline{background:transparent;color:var(--ink)}
.btn-outline:hover{background:var(--ink);color:#fff;border-color:var(--gold)}
.btn-on-dark{border-color:var(--gold);color:#fff}
.btn-on-dark.btn-solid{background:#fff;color:var(--ink)}
.btn-on-dark.btn-solid:hover{background:transparent;color:#fff}

.text-link,.back-link{font-size:11px;letter-spacing:0.14em;display:inline-flex;align-items:center}
.text-link{color:var(--ink);gap:10px}
.back-link{color:var(--stone);gap:8px;margin-bottom:var(--space-lg)}

/* ---- Navbar ---- */
.site-nav{position:absolute;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:clamp(16px,4vw,36px) var(--container-pad)}
.site-nav .brand{display:flex;align-items:center;gap:12px;min-width:0;color:inherit}
.site-nav .brand img{object-fit:contain}
.site-nav .brand > div{min-width:0;line-height:1.15}
.site-nav .brand-name{font-family:var(--font-serif);font-size:19px;letter-spacing:0.08em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-nav .brand-sub{font-size:9px;letter-spacing:0.22em;color:var(--ink-soft)}
.site-nav .actions{display:flex;align-items:center;gap:clamp(12px,3vw,24px)}
.site-nav .cta{font-size:11px;letter-spacing:0.14em;padding:clamp(10px,2vw,12px) clamp(14px,4vw,24px);border:1px solid var(--gold-dark);white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;transition:background .25s,color .25s,border-color .25s}
.site-nav .cta:hover{background:var(--ink);color:#fff;border-color:var(--gold)}
.site-nav .cta-wa{background:transparent;color:var(--ink);border-color:var(--ink)}
.site-nav .cta-wa:hover{background:#25D366;color:#fff;border-color:#25D366}
.menu-trigger{width:44px;height:44px;flex-shrink:0;border:1px solid var(--ink);background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;transition:background .25s}
.menu-trigger:hover{background:var(--gold-dark)}
.menu-trigger span{width:16px;height:1px;background:var(--ink);transition:background .25s}
.menu-trigger:hover span{background:#fff}
@media (max-width:640px){
  .site-nav .cta{display:none}
  .site-nav .brand-name{font-size:15px}
}

/* ---- Fullscreen menu overlay (opened by shared/nav.js) ---- */
.menu-overlay{position:fixed;inset:0;background:var(--ink);z-index:50;display:flex;flex-direction:column;padding:90px clamp(24px,6vw,64px) 32px;box-sizing:border-box;opacity:0;pointer-events:none;transition:opacity .5s cubic-bezier(.16,.84,.44,1)}
.menu-overlay.is-open{opacity:1;pointer-events:auto}
.menu-overlay .menu-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.12}
.menu-close{position:absolute;top:24px;right:24px;width:44px;height:44px;border:1px solid var(--stone);background:transparent;cursor:pointer;z-index:2;transition:border-color .2s}
.menu-close:hover{border-color:#fff}
.menu-close span{position:absolute;top:50%;left:8px;right:8px;height:1px;background:var(--paper-warm)}
.menu-close span:first-child{transform:rotate(45deg)}
.menu-close span:last-child{transform:rotate(-45deg)}
.menu-nav{position:relative;z-index:2;display:flex;flex-direction:column;gap:0;flex:1 1 0%;height:0;min-height:0;overflow-y:auto;justify-content:center}
.menu-nav a{display:flex;align-items:baseline;gap:18px;font-family:var(--font-serif);font-size:clamp(20px,6vw,30px);color:var(--paper-warm);padding:10px 0;min-height:44px;transition:color .25s,transform .25s}
.menu-nav a:hover,.menu-nav a.active{color:var(--gold);transform:translateX(10px)}
.menu-nav a .idx{font-family:var(--font-sans);font-size:11px;color:var(--stone);letter-spacing:0.1em}
.menu-foot{position:relative;z-index:2;flex:0 0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:11px;letter-spacing:0.14em;color:var(--stone);padding-top:16px}

/* ---- Footer ---- */
.site-footer{background:var(--ink);color:var(--stone);padding:clamp(40px,8vw,70px) var(--container-pad) 36px}
.site-footer .footer-grid{max-width:var(--container-max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--space-xl);padding-bottom:var(--space-xl);border-bottom:1px solid var(--gold-dark)}
.site-footer .footer-brand{font-family:var(--font-serif);font-size:19px;letter-spacing:0.08em;color:#fff}
.site-footer .footer-tag{font-size:9px;letter-spacing:0.22em;margin-top:6px}
.site-footer .footer-links{display:flex;flex-direction:column;gap:10px;font-size:12px;letter-spacing:0.06em}
.site-footer .footer-links a{color:var(--stone)}
.site-footer .footer-links a:hover{color:#fff}
.site-footer .footer-contact{display:flex;flex-direction:column;gap:10px;font-size:12px;letter-spacing:0.06em}
.site-footer .footer-contact a{color:inherit}
.site-footer .footer-bottom{max-width:var(--container-max);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;font-size:10px;letter-spacing:0.1em}
.site-footer .footer-bottom-links{display:flex;gap:28px;flex-wrap:wrap}
@media (max-width:767px){
  .site-footer .footer-grid{grid-template-columns:1fr;text-align:left}
  .site-footer .footer-contact{text-align:left}
}

/* ---- Layout primitives ---- */
.split{display:flex;align-items:stretch;min-height:70vh;min-height:70svh}
.split > .split-media,.split > .split-text{width:50%}
.split.split-45-55 > .split-media{width:45%}
.split.split-45-55 > .split-text{width:55%}
.split-text{display:flex;align-items:center;padding:var(--space-3xl) var(--container-pad)}
@media (max-width:1023px){
  .split{flex-direction:column;min-height:0}
  .split > .split-media,.split > .split-text,
  .split.split-45-55 > .split-media,.split.split-45-55 > .split-text{width:100%}
  .split > .split-media{aspect-ratio:4/3}
}

/* ---- Location map ---- */
.map-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-xl)}
.map-heading h2{font-size:var(--fs-h3);margin:0 0 var(--space-sm)}
.map-address{font-size:var(--fs-body-sm);line-height:1.7;color:var(--ink-soft);margin:0}
.map-frame{width:min(calc(100% - 2 * var(--container-pad)),var(--container-max));height:clamp(360px,40vw,540px);margin:0 auto var(--space-4xl);overflow:hidden;border:1px solid var(--stone);background:var(--paper)}
.map-frame iframe{display:block;width:100%;height:100%;border:0}
@media (max-width:640px){.map-heading{align-items:flex-start;flex-direction:column}}

.grid-editorial{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ink-soft);border-left:1px solid var(--ink-soft)}
@media (max-width:1023px){.grid-editorial{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-editorial{grid-template-columns:1fr}}
.grid-editorial > *{border-right:1px solid var(--ink-soft);border-bottom:1px solid var(--ink-soft);padding:clamp(28px,6vw,44px) clamp(16px,4vw,32px);min-width:0}
.grid-editorial > a{color:inherit;display:block;transition:background .4s}
.grid-editorial > a:hover{background:var(--paper-warm)}

.approche-grid{display:grid;grid-template-columns:repeat(4,1fr)}
@media (max-width:1023px){.approche-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.approche-grid{grid-template-columns:1fr}}
.bio-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--space-3xl)}
@media (max-width:767px){.bio-grid{grid-template-columns:1fr}}
.approche-grid > *,.bio-grid > *{min-width:0}

.eyebrow{font-size:var(--fs-eyebrow);letter-spacing:0.22em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:var(--space-md)}

.gold-heading{
  background:linear-gradient(100deg, var(--gold) 0%, var(--gold-dark) 100%);
  -webkit-background-clip:text;background-clip:text;
  color:var(--gold-dark);-webkit-text-fill-color:transparent;
}
.section-pad{padding-block:var(--space-4xl);padding-inline:var(--container-pad)}
.page-head{padding-top:clamp(140px,22vw,180px)}
@media (min-width:1024px){
  .page-head .eyebrow,.page-head h1{text-align:center}
  .page-head .prose{text-align:justify;text-justify:inter-word;hyphens:auto}
  .page-head h1,.page-head .measure{margin-inline:auto!important}
  .page-head .btn{display:flex;width:max-content;margin-inline:auto}
}
.bg-warm{background:var(--paper-warm)}
.bg-dark{background:var(--ink);color:var(--paper-warm)}
@media (min-width:1024px){
  .expertise-content .subhead{text-align:center}
  .expertise-content .measure{margin-inline:auto;text-align:justify;text-justify:inter-word;hyphens:auto}
}

/* ---- Scroll reveal (shared/reveal.js adds .is-visible) ---- */
[data-reveal] .reveal-target{opacity:0;transform:translateY(28px);transition:opacity 1s cubic-bezier(.16,.84,.44,1),transform 1s cubic-bezier(.16,.84,.44,1)}
[data-reveal].is-visible .reveal-target{opacity:1;transform:translateY(0)}

/* ---- Missing-photo placeholder (visible stand-in, not a silent blank box) ---- */
.photo-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:24px;box-sizing:border-box;background:rgba(127,127,127,.08);border:1.5px dashed currentColor;color:var(--stone)}
.photo-placeholder svg{opacity:.45;flex-shrink:0}
.photo-placeholder span{font-size:13px;letter-spacing:.02em;max-width:32ch}
.band{width:100%;height:clamp(280px,45vw,480px);filter:grayscale(1)}

/* ---- Accordion (FAQ, driven by shared/accordion.js) ---- */
.accordion-item{border-top:1px solid var(--stone)}
.accordion-trigger{width:100%;background:none;border:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 0;text-align:left;min-height:44px;font:inherit}
.accordion-trigger:hover{opacity:0.7}
.accordion-label{font-size:15px;letter-spacing:0.01em;color:var(--ink);padding-right:20px}
.accordion-icon{font-size:20px;flex-shrink:0;color:var(--gold-dark);transition:transform .3s}
.accordion-panel{overflow:hidden;transition:max-height .4s ease,opacity .4s ease}
.accordion-panel p{font-size:var(--fs-body-sm);line-height:1.8;color:var(--ink-soft);margin:0 0 26px;max-width:65ch}

/* ---- Article / expertise item cards ---- */
.meta{font-size:10px;letter-spacing:0.14em;color:var(--stone);text-transform:uppercase;margin-bottom:var(--space-md)}
.article-card{display:flex;justify-content:space-between;align-items:center;padding:26px 0;border-top:1px solid var(--stone);gap:24px;min-height:44px}
.article-card:last-child{border-bottom:1px solid var(--stone)}
.article-card:hover{opacity:0.65}
.article-card .meta{margin-bottom:10px}
.article-card .title{font-family:var(--font-serif);font-size:clamp(16px,4vw,20px);max-width:65ch}
.article-card .arrow{font-size:20px;flex-shrink:0;color:var(--gold-dark)}

/* ---- Text blocks ---- */
.prose{font-size:var(--fs-body);line-height:1.85;color:var(--ink-soft);margin:0 0 var(--space-lg)}
.note{font-size:var(--fs-body-sm);line-height:1.7;color:var(--stone);margin:0 0 var(--space-2xl)}
.rule{width:24px;height:1px;background:var(--ink-soft);margin:20px 0}
.num{font-family:var(--font-serif);font-size:var(--fs-number)}
.card-title{font-size:14px;letter-spacing:0.04em}
.card-text{font-size:13px;line-height:1.7;color:var(--ink-soft);margin:0}
.card-more{display:block;margin-top:12px;font-size:12px;letter-spacing:.08em;color:var(--gold);font-weight:500}

/* long-text safety */
h1,h2,p,a,span,button{min-width:0}
.measure{max-width:65ch}