/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --bg:      #FFFFFF;
  --ink:     #000000;
  --soft:    #F5F5F5;
  --muted:   #6B6B6B;
  --hairline:rgba(0,0,0,.12);
  --whisper: rgba(0,0,0,.04);
  --gold:    #C9A227;

  --serif:"Playfair Display", Georgia, serif;
  --sans: "Inter", Helvetica, Arial, sans-serif;

  --pad:   clamp(1.25rem, 4vw, 4rem);
  --maxw:  1280px;
  --nav-h: 64px;
  --ease:  cubic-bezier(.22,1,.36,1);
}

/* ============================================================
   RESET
   ============================================================ */
*{ margin:0; padding:0; box-sizing:border-box; }
html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.7;
  padding-top:var(--nav-h);
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
button{ font:inherit; }
::selection{ background:var(--ink); color:var(--bg); }

/* Lenis */
html.lenis,html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-stopped{ overflow:hidden; }

/* ============================================================
   LAYOUT
   ============================================================ */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); position:relative; z-index:2; }
.section{ padding-block:clamp(4.5rem, 9vh, 7rem); position:relative; overflow:hidden; }
.section--soft{ background:var(--soft); }

/* ============================================================
   TYPE
   ============================================================ */
h1,h2,h3{ font-family:var(--serif); font-weight:400; line-height:1.15; letter-spacing:-.005em; color:var(--ink); }
h1{ font-size:clamp(2.25rem, 5vw, 3.5rem); }
h2{ font-size:clamp(1.75rem, 3.5vw, 2.25rem); }
h3{ font-size:1.25rem; font-weight:500; font-family:var(--sans); }
p{ color:var(--ink); }

.caption{
  display:inline-block;
  font-family:var(--sans); font-size:.75rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink);
}
.muted{ color:var(--muted); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; gap:.75rem;
  padding:1rem 1.75rem;
  background:var(--ink); color:var(--bg);
  font-family:var(--sans); font-size:.75rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase;
  border:1px solid var(--ink); cursor:pointer;
  transition: background .25s ease, color .25s ease;
}
.btn:hover{ background:var(--bg); color:var(--ink); }
.btn--sm{ padding:.7rem 1.1rem; font-size:.7rem; letter-spacing:.1em; }
.btn--inverse{ background:var(--bg); color:var(--ink); }
.btn--inverse:hover{ background:var(--ink); color:var(--bg); }

.text-link{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--sans); font-size:.78rem; font-weight:500;
  letter-spacing:.06em; color:var(--ink); cursor:pointer;
  background:transparent; border:0; padding:0;
  border-bottom:1px solid var(--ink); padding-bottom:3px;
  transition: opacity .2s ease;
}
.text-link:hover{ opacity:.6; }

/* ============================================================
   NAV — HYBRID STICKY
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--nav-h);
  background:var(--bg); color:var(--ink);
  display:flex; align-items:center;
  padding-inline:var(--pad);
  border-bottom:1px solid var(--hairline);
}
.nav__left{ display:flex; align-items:center; gap:1.25rem; }
.nav__brand{
  font-family:var(--serif); font-size:1.05rem; font-weight:500;
  letter-spacing:.02em; text-transform:uppercase; color:var(--ink);
  white-space:nowrap;
}
.nav__hamburger{
  background:transparent; border:0; padding:.4rem; cursor:pointer;
  display:grid; place-items:center; color:var(--ink);
  line-height:0;
}
.nav__hamburger svg{ display:block; }

.nav__center{
  display:flex; gap:1.75rem;
  margin-left:auto;
}
.nav__center a{
  font-family:var(--sans); font-size:.72rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink);
  transition:opacity .2s;
  position:relative;
}
.nav__center a:hover{ opacity:.6; }
.nav__center a.is-active::after{
  content:""; position:absolute; bottom:-6px; left:0; right:0; height:1px; background:var(--ink);
}

.nav__right{
  display:flex; align-items:center; gap:1.25rem;
  margin-left:1.75rem;
}
.nav__phone{
  font-family:var(--sans); font-size:.82rem; color:var(--ink); font-weight:500;
  white-space:nowrap;
}
.nav__phone:hover{ text-decoration:underline; text-underline-offset:3px; }
.nav__cta{
  background:var(--ink); color:var(--bg);
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase;
  padding:.7rem 1.1rem;
  border:1px solid var(--ink); cursor:pointer;
  transition:background .2s, color .2s;
  white-space:nowrap;
}
.nav__cta:hover{ background:var(--bg); color:var(--ink); }

@media(max-width:980px){
  .nav__center{ display:none; }
  .nav__right{ margin-left:auto; }
}
@media(max-width:560px){
  .nav__phone{ display:none; }
  .nav__brand{ font-size:.95rem; }
  .nav__cta{ padding:.55rem .85rem; font-size:.65rem; }
  .nav__right{ gap:.75rem; }
}

/* MENU OVERLAY (mobile + full menu) */
.menu{
  position:fixed; inset:0; z-index:200;
  background:var(--ink); color:var(--bg);
  transform:translateX(-100%);
  transition: transform .5s var(--ease);
  display:flex; flex-direction:column;
  padding: clamp(1.5rem, 4vh, 2.5rem) var(--pad);
  overflow-y:auto;
}
.menu.is-open{ transform:translateX(0); }
.menu__head{
  display:flex; justify-content:space-between; align-items:center;
  padding-bottom: clamp(1.5rem, 3vh, 2rem);
  border-bottom:1px solid rgba(255,255,255,.18);
}
.menu__brand{
  font-family:var(--serif); font-size:1.05rem; font-weight:500;
  letter-spacing:.02em; text-transform:uppercase; color:var(--bg);
}
.menu__close{
  background:transparent; border:1px solid rgba(255,255,255,.3); color:var(--bg);
  width:44px; height:44px; cursor:pointer; padding:0;
  display:grid; place-items:center; line-height:0;
}
.menu__close:hover{ background:var(--bg); color:var(--ink); border-color:var(--bg); }
.menu__links{
  display:flex; flex-direction:column; gap:.5rem;
  padding-top: clamp(2rem, 5vh, 3rem); list-style:none;
}
.menu__links a{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(2rem, 6vw, 3.5rem); color:var(--bg);
  line-height:1.1; letter-spacing:-.01em;
  padding:.4rem 0;
  transition:opacity .2s, padding-left .25s var(--ease);
}
.menu__links a:hover{ opacity:.6; padding-left:.5rem; }
.menu__foot{
  margin-top:auto; padding-top:clamp(2rem, 4vh, 3rem);
  border-top:1px solid rgba(255,255,255,.18);
  display:grid; grid-template-columns:1fr 1fr; gap:1rem 2rem;
  font-size:.78rem; color:rgba(255,255,255,.65);
}
.menu__foot strong{ font-weight:500; color:rgba(255,255,255,.95); display:block; margin-bottom:.25rem; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; }
.menu__foot a{ color:rgba(255,255,255,.9); display:block; }
.menu__foot a:hover{ color:var(--bg); }
@media(max-width:520px){ .menu__foot{ grid-template-columns:1fr; gap:1.25rem; } }
body.menu-open{ overflow:hidden; }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  min-height:calc(100svh - var(--nav-h));
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
  padding:clamp(3rem,8vh,6rem) var(--pad);
  position:relative; overflow:hidden;
  isolation:isolate;
}
.hero::before{
  content:"";
  position:absolute; inset:-6%;
  background: url("/hero-bg.webp") center/cover no-repeat;
  filter: blur(14px) saturate(1.05);
  transform: scale(1.08);
  z-index:0;
  will-change: transform;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.62) 0%,
      rgba(255,255,255,.70) 50%,
      rgba(255,255,255,.86) 100%);
  z-index:1;
  pointer-events:none;
}
.hero__inner{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; max-width:60rem; }
.hero h1{ max-width:22ch; margin-bottom:1.25rem; font-size:clamp(2.3rem, 5.2vw, 3.75rem); line-height:1.1; }
.hero__sub{
  max-width:46ch; margin-bottom:1rem;
  color:var(--ink); font-size:clamp(1rem, 1.25vw, 1.15rem); line-height:1.55;
}
.hero__supporting{
  max-width:50ch; margin-bottom:2.5rem;
  color:var(--muted); font-size:.95rem; line-height:1.55;
}
.hero__ctas{ display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; justify-content:center; }
.hero__tel{
  font-family:var(--sans); font-size:.95rem; font-weight:500; color:var(--ink);
}
.hero__tel:hover{ text-decoration:underline; text-underline-offset:3px; }
.hero__note{
  margin-top:1.75rem; color:var(--muted); font-size:.85rem; max-width:54ch;
}

/* ============================================================
   SOCIAL PROOF BAR
   ============================================================ */
.social-proof{
  background:var(--soft);
  border-bottom:1px solid var(--hairline);
  padding:1.1rem var(--pad);
  text-align:center;
  font-family:var(--sans); font-size:.72rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--ink);
  white-space:nowrap; overflow-x:auto;
  scrollbar-width:none;
}
.social-proof::-webkit-scrollbar{ display:none; }
.social-proof span{ display:inline-block; padding:0 .2em; }
.social-proof .sep{ color:var(--muted); padding:0 .8em; }

/* ============================================================
   SECTION HEAD
   ============================================================ */
.s-head{ margin-bottom:clamp(2.5rem, 5vh, 4rem); display:flex; flex-direction:column; gap:1rem; position:relative; z-index:2; }
.s-head h2{ max-width:30ch; }
.s-cta{
  margin-top:clamp(2rem, 4vh, 3rem); position:relative; z-index:2;
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--sans); font-size:.78rem; font-weight:500;
  letter-spacing:.06em; color:var(--ink); cursor:pointer;
  background:transparent; border:0; padding:0;
  border-bottom:1px solid var(--ink); padding-bottom:3px;
  transition: opacity .2s ease;
}
.s-cta:hover{ opacity:.6; }

/* ============================================================
   PATTERN DECORATIONS (per-section graphic motifs)
   ============================================================ */
.pattern-svg{
  position:absolute; pointer-events:none; user-select:none; z-index:0;
  color:rgba(0,0,0,.08);
}
.pattern-svg--tr{ top:-3rem;   right:-3rem;  width:clamp(180px, 28vw, 360px); }
.pattern-svg--br{ bottom:-3rem; right:-3rem;  width:clamp(180px, 28vw, 360px); }
.pattern-svg--bl{ bottom:-3rem; left:-3rem;   width:clamp(180px, 28vw, 360px); }
.pattern-svg--tl{ top:-3rem;   left:-3rem;   width:clamp(180px, 28vw, 360px); }
.footer .pattern-svg{ color:rgba(255,255,255,.08); }

.pattern-rule{
  position:absolute; top:0; left:50%; bottom:0; width:1px;
  background:var(--hairline); z-index:0; pointer-events:none;
}
@media(max-width:760px){ .pattern-rule{ display:none; } }

.pattern-halftone{
  position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image: radial-gradient(circle, rgba(0,0,0,.13) 1.5px, transparent 1.8px);
  background-size: 20px 20px;
  -webkit-mask-image: radial-gradient(80% 80% at 90% 10%, #000 0%, transparent 60%);
          mask-image: radial-gradient(80% 80% at 90% 10%, #000 0%, transparent 60%);
}
.pattern-grid{
  position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:
    linear-gradient(to right, var(--hairline) 1px, transparent 1px),
    linear-gradient(to bottom, var(--hairline) 1px, transparent 1px);
  background-size: clamp(60px, 8vw, 96px) clamp(60px, 8vw, 96px);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
          mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
  opacity:.5;
}

/* ============================================================
   WHO WE ARE
   ============================================================ */
.who h2{ max-width:24ch; margin-top:1rem; line-height:1.15; }
.who p{ max-width:60ch; margin-top:1.5rem; color:var(--muted); font-size:1.05rem; line-height:1.7; }
.who p + p{ margin-top:1rem; }

/* ============================================================
   SERVICES GRID — 12 ITEMS
   ============================================================ */
.svc-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:0;
  border-top:1px solid var(--ink); position:relative; z-index:2;
}
@media(max-width:900px){ .svc-grid{ grid-template-columns:repeat(2, 1fr); } }
@media(max-width:520px){ .svc-grid{ grid-template-columns:1fr; } }
.svc-item{
  padding:clamp(1.5rem, 3vh, 2.25rem) clamp(1.25rem, 2vw, 1.75rem);
  border-bottom:1px solid var(--ink); border-right:1px solid var(--ink);
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.1rem, 1.75vw, 1.4rem); line-height:1.2;
  background:var(--bg);
  transition: background .2s ease, padding-left .3s var(--ease);
  display:flex; align-items:center;
}
.svc-item:hover{ background:var(--soft); padding-left:calc(clamp(1.25rem, 2vw, 1.75rem) + .35rem); }
.svc-grid > .svc-item:nth-child(3n){ border-right:0; }
@media(max-width:900px){
  .svc-grid > .svc-item{ border-right:1px solid var(--ink); }
  .svc-grid > .svc-item:nth-child(3n){ border-right:1px solid var(--ink); }
  .svc-grid > .svc-item:nth-child(2n){ border-right:0; }
}
@media(max-width:520px){
  .svc-grid > .svc-item{ border-right:0; }
}

/* ============================================================
   ABOUT / TEAM
   ============================================================ */
.team{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem, 5vw, 4rem); position:relative; z-index:2; }
@media(max-width:760px){ .team{ grid-template-columns:1fr; gap:3rem; } }
.team__card{ display:flex; flex-direction:column; gap:1.5rem; }
.team__portrait{
  position:relative; aspect-ratio:4/5;
  background:var(--soft);
  border:1px solid var(--ink);
  overflow:hidden;
}
.team__portrait img{
  width:100%; height:100%; object-fit:cover;
  object-position: 50% var(--photo-y, 50%);
  transform: scale(var(--photo-scale, 1));
  transform-origin: center var(--photo-y, 50%);
  transition: transform 1.2s var(--ease);
}
.team__card:hover .team__portrait img{
  transform: scale(calc(var(--photo-scale, 1) * 1.04));
}
.team__meta{ display:flex; flex-direction:column; gap:.4rem; }
.team__num{ font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.team__name{ font-family:var(--serif); font-size:1.75rem; font-weight:400; line-height:1.1; }
.team__role{ font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-top:.25rem; }
.team__bio{ margin-top:.75rem; max-width:46ch; color:var(--muted); }
.team__link{
  display:inline-flex; align-items:center; gap:.4rem;
  margin-top:.6rem; align-self:flex-start;
  font-family:var(--sans); font-size:.72rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink);
  border-bottom:1px solid var(--ink); padding-bottom:2px;
  transition: opacity .2s ease;
}
.team__link:hover{ opacity:.6; }

/* ============================================================
   PORTFOLIO CARDS
   ============================================================ */
.portfolio{ display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(1.5rem, 3vw, 2.5rem); position:relative; z-index:2; }
@media(max-width:980px){ .portfolio{ grid-template-columns:repeat(2, 1fr); } }
@media(max-width:640px){ .portfolio{ grid-template-columns:1fr; } }
.proj{
  display:flex; flex-direction:column;
  background:var(--bg);
  border:1px solid var(--hairline);
  cursor:pointer;
  transition: border-color .3s ease, transform .35s var(--ease);
}
.proj:hover{ border-color:var(--ink); transform:translateY(-6px); }
.proj:focus-visible{ outline:2px solid var(--ink); outline-offset:4px; }
.proj__media{
  aspect-ratio:4/3; background:var(--soft);
  border-bottom:1px solid var(--hairline);
  overflow:hidden;
  transition:border-color .3s ease;
}
.proj__media img{
  width:100%; height:100%; object-fit:cover; object-position:top;
  transition: transform .8s var(--ease);
}
.proj:hover .proj__media{ border-bottom-color:var(--ink); }
.proj:hover .proj__media img{ transform: scale(1.03); }
.proj__body{ padding:1.5rem; display:flex; flex-direction:column; gap:.5rem; }
.proj__cat{ font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.proj__name{ font-family:var(--serif); font-size:1.25rem; font-weight:500; }
.proj__desc{ font-size:.9375rem; color:var(--muted); line-height:1.6; }
.proj__view{
  display:inline-flex; align-items:center; gap:.4rem;
  margin-top:.5rem;
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink);
  opacity:0; transform:translateY(4px);
  transition: opacity .3s ease, transform .3s ease;
}
.proj:hover .proj__view, .proj:focus-visible .proj__view{ opacity:1; transform:none; }

.portfolio--full{ margin-top:0; }
.proj.proj--placeholder{
  cursor:default; background:var(--soft); border-style:dashed; border-color:var(--hairline);
  transform:none !important;
}
.proj.proj--placeholder:hover{ border-color:var(--hairline); transform:none; }
.proj.proj--placeholder .proj__media{ background:var(--bg); border-bottom-style:dashed; }
.proj.proj--placeholder .proj__media::after{
  content:"COMING SOON"; position:absolute; inset:0;
  display:grid; place-items:center;
  font-family:var(--sans); font-size:.65rem; font-weight:500;
  letter-spacing:.18em; color:var(--muted);
}
.proj.proj--placeholder .proj__media{ position:relative; }

.portfolio-cta{
  display:flex; justify-content:center; margin-top:clamp(2.5rem, 5vh, 4rem); position:relative; z-index:2;
}

/* PORTFOLIO PAGE FILTER */
.pf-filter{
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-bottom:clamp(2rem, 4vh, 3rem);
  position:relative; z-index:2;
}
.pf-filter button{
  background:transparent; border:1px solid var(--ink); color:var(--ink);
  padding:.55rem 1rem;
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase;
  cursor:pointer;
  transition: background .2s, color .2s;
}
.pf-filter button:hover, .pf-filter button.is-active{
  background:var(--ink); color:var(--bg);
}

/* ============================================================
   LIGHTBOX
   ============================================================ */
.lightbox{
  position:fixed; inset:0; z-index:1000;
  background:rgba(0,0,0,.96);
  -webkit-backdrop-filter:blur(6px);
          backdrop-filter:blur(6px);
  display:none; flex-direction:column;
  opacity:0; transition: opacity .25s ease;
}
.lightbox.is-open{ display:flex; opacity:1; }

.lightbox__inner{
  flex:1; display:flex; flex-direction:column;
  padding:clamp(1rem, 3vh, 1.5rem) clamp(1rem, 4vw, 3rem);
  color:var(--bg); min-height:0;
}
.lightbox__head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:2rem;
  padding-bottom:clamp(.75rem, 2vh, 1.25rem);
  border-bottom:1px solid rgba(255,255,255,.15);
}
.lightbox__title{ display:flex; flex-direction:column; gap:.4rem; }
.lightbox__cat{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.55);
}
.lightbox__name{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.3rem, 2.4vw, 1.9rem); color:var(--bg);
}
.lightbox__close{
  background:transparent; color:var(--bg);
  border:1px solid rgba(255,255,255,.3);
  width:44px; height:44px; cursor:pointer; padding:0;
  display:grid; place-items:center; flex-shrink:0;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.lightbox__close:hover{ background:var(--bg); color:var(--ink); border-color:var(--bg); }

.lightbox__stage{
  flex:1; min-height:0;
  position:relative;
  display:flex; justify-content:center; align-items:flex-start;
  padding:clamp(.75rem, 2vh, 1.5rem) clamp(4rem, 8vw, 6rem);
  overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.25) transparent;
}
.lightbox__stage::-webkit-scrollbar{ width:8px; }
.lightbox__stage::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.25); }
.lightbox__stage::-webkit-scrollbar-track{ background:transparent; }
.lightbox__img{
  display:block;
  width:100%; height:auto;
  max-width:1500px;
  margin:0 auto;
  user-select:none;
}
.lightbox__nav{
  position:fixed; top:50%; transform:translateY(-50%);
  background:rgba(0,0,0,.6); color:var(--bg);
  border:1px solid rgba(255,255,255,.3);
  width:48px; height:48px; cursor:pointer; padding:0;
  display:grid; place-items:center; z-index:1001;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.lightbox__nav:hover{ background:var(--bg); color:var(--ink); border-color:var(--bg); }
.lightbox__nav--prev{ left:clamp(.5rem, 2vw, 1.5rem); }
.lightbox__nav--next{ right:clamp(.5rem, 2vw, 1.5rem); }

.lightbox__foot{
  display:flex; align-items:center; gap:1.25rem;
  padding-top:clamp(.5rem, 1vh, 1rem);
  border-top:1px solid rgba(255,255,255,.15);
}
.lightbox__count{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.55);
  flex-shrink:0;
}
.lightbox__thumbs{
  display:flex; gap:.5rem; overflow-x:auto;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.2) transparent;
  padding:.5rem 0;
}
.lightbox__thumbs::-webkit-scrollbar{ height:6px; }
.lightbox__thumbs::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.2); }
.lightbox__thumb{
  flex:0 0 auto; width:96px; aspect-ratio:4/3;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.15);
  cursor:pointer; padding:0; overflow:hidden;
  opacity:.55; transition: opacity .2s ease, border-color .2s ease;
}
.lightbox__thumb:hover{ opacity:.85; }
.lightbox__thumb.is-active{ opacity:1; border-color:var(--bg); }
.lightbox__thumb img{ width:100%; height:100%; object-fit:cover; object-position:top; display:block; }
@media(max-width:640px){
  .lightbox__nav{ width:40px; height:40px; }
  .lightbox__thumb{ width:72px; }
}
body.lb-open{ overflow:hidden; }

/* ============================================================
   TESTIMONIALS — CARD GRID
   ============================================================ */
.test-grid{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:clamp(1.25rem, 2.5vw, 2rem);
  position:relative; z-index:2;
}
@media(max-width:900px){ .test-grid{ grid-template-columns:repeat(2, 1fr); } }
@media(max-width:560px){ .test-grid{ grid-template-columns:1fr; } }
.test-card{
  display:flex; flex-direction:column; gap:1.1rem;
  padding:clamp(1.5rem, 2.5vw, 1.75rem);
  border:1px solid var(--hairline);
  background:var(--bg);
  transition: border-color .25s ease, transform .35s var(--ease);
}
.test-card:hover{ border-color:var(--ink); transform:translateY(-4px); }
.test-card__stars{
  font-size:.95rem; letter-spacing:.18em; color:var(--gold);
  line-height:1;
}
.test-card__quote{
  font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:clamp(1rem, 1.25vw, 1.1rem); line-height:1.5; color:var(--ink);
  flex:1; margin:0;
}
.test-card__by{
  display:flex; flex-direction:column; gap:.2rem;
  padding-top:1rem; border-top:1px solid var(--hairline);
}
.test-card__name{
  font-family:var(--sans); font-size:.78rem; font-weight:600;
  letter-spacing:.05em; text-transform:uppercase; color:var(--ink);
}
.test-card__co{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
}
.test-card__country{
  font-family:var(--sans); font-size:.7rem; color:var(--muted);
  margin-top:.15rem;
}

/* ============================================================
   FAQ ACCORDION
   ============================================================ */
.faq{ border-top:1px solid var(--ink); position:relative; z-index:2; }
.faq__group + .faq__group{ margin-top:clamp(2.5rem, 5vh, 4rem); }
.faq__group-title{
  font-family:var(--sans); font-size:.72rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
  padding:clamp(1.5rem, 3vh, 2rem) 0 .25rem;
  border-bottom:1px solid var(--hairline); margin-bottom:.25rem;
}
.faq__item{ border-bottom:1px solid var(--ink); }
.faq__q{
  width:100%; padding:clamp(1.1rem, 2.5vh, 1.6rem) 0;
  background:transparent; border:0; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:1.5rem;
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.05rem, 1.4vw, 1.25rem); line-height:1.3;
  text-align:left; color:var(--ink);
}
.faq__icon{
  flex-shrink:0; width:24px; height:24px;
  display:grid; place-items:center;
  transition: transform .3s var(--ease);
  color:var(--ink);
}
.faq__item.is-open .faq__icon{ transform:rotate(45deg); }
.faq__a{
  max-height:0; overflow:hidden;
  transition: max-height .4s var(--ease), padding-bottom .4s var(--ease);
  color:var(--muted); line-height:1.7; max-width:78ch;
}
.faq__item.is-open .faq__a{
  max-height:800px; padding-bottom: clamp(1.25rem, 2.5vh, 1.75rem);
}

/* ============================================================
   CONTACT
   ============================================================ */
.contact-grid{
  display:grid; grid-template-columns:1.3fr 1fr;
  gap:clamp(2rem, 5vw, 4rem);
  position:relative; z-index:2;
}
@media(max-width:760px){ .contact-grid{ grid-template-columns:1fr; gap:3rem; } }
.contact-form{ display:flex; flex-direction:column; gap:1.1rem; }
.contact-form .field{ display:flex; flex-direction:column; gap:.4rem; }
.contact-form label{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
}
.contact-form input, .contact-form textarea{
  font-family:var(--sans); font-size:1rem;
  padding:.85rem 1rem;
  background:var(--bg);
  border:1px solid var(--ink); border-radius:0;
  color:var(--ink); width:100%;
  outline:none; transition: background .15s ease;
}
.contact-form input:focus, .contact-form textarea:focus{ background:var(--soft); }
.contact-form textarea{ min-height:140px; resize:vertical; line-height:1.5; }
.contact-form .honeypot{ position:absolute; left:-9999px; opacity:0; }
.contact-form button[type=submit]{
  background:var(--ink); color:var(--bg);
  border:1px solid var(--ink); padding:1rem 1.5rem;
  font-family:var(--sans); font-size:.75rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase;
  cursor:pointer; align-self:flex-start; margin-top:.5rem;
  transition: background .2s, color .2s;
}
.contact-form button[type=submit]:hover{ background:var(--bg); color:var(--ink); }
.form-status{
  font-size:.85rem; padding:.5rem 0; min-height:1.5rem; color:var(--muted);
}
.form-status.is-ok{ color:var(--ink); }
.form-status.is-err{ color:#B91C1C; }

.contact-details{ display:flex; flex-direction:column; }
.contact-details__row{
  display:flex; flex-direction:column; gap:.3rem;
  padding:1.1rem 0; border-bottom:1px solid var(--hairline);
}
.contact-details__row:first-child{ padding-top:0; }
.contact-details__label{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
}
.contact-details__value{
  font-family:var(--serif); font-size:clamp(1rem, 1.25vw, 1.1rem); color:var(--ink); font-style:normal;
}
.contact-details a.contact-details__value:hover{ text-decoration:underline; text-underline-offset:3px; }

.contact-cal{
  margin-top:clamp(3rem, 6vh, 5rem); padding-top:clamp(2rem, 4vh, 2.5rem);
  border-top:1px solid var(--ink); position:relative; z-index:2;
}
.contact-cal h3{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.5rem, 2.5vw, 2rem); margin-bottom:.5rem;
}
.contact-cal p{ color:var(--muted); margin-bottom:1.5rem; max-width:54ch; }
.calendly-inline-widget{ min-height:680px; }

/* ============================================================
   FLOATING WHATSAPP BUTTON (pill: icon + "Chat With Us!")
   ============================================================ */
.wa-btn{
  position:fixed;
  right:18px; bottom:18px;
  z-index:90;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:10px;
  height:52px;
  width:auto;
  max-width:none;
  padding:0 18px 0 14px;
  background:#25D366;
  color:#ffffff;
  border-radius:26px;
  box-shadow:0 6px 18px rgba(37,211,102,.42), 0 2px 6px rgba(0,0,0,.12);
  font-family:"Inter", Helvetica, Arial, sans-serif;
  font-size:15px;
  font-weight:600;
  letter-spacing:.01em;
  line-height:1;
  white-space:nowrap;
  text-decoration:none;
  transition: transform .25s ease, box-shadow .25s ease, background .2s ease;
}
.wa-btn:hover{
  transform: translateY(-2px);
  background:#1ebe5d;
  box-shadow:0 10px 24px rgba(37,211,102,.55), 0 2px 6px rgba(0,0,0,.18);
}
.wa-btn svg{
  width:24px;
  height:24px;
  display:block;
  flex:0 0 24px;
  color:#ffffff;
}
.wa-btn .wa-btn__label{
  display:inline-block;
  color:#ffffff;
  white-space:nowrap;
  line-height:1;
}
@media(max-width:520px){
  .wa-btn{
    width:52px;
    padding:0;
    border-radius:50%;
    gap:0;
  }
  .wa-btn .wa-btn__label{ display:none; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:var(--ink); color:var(--bg); padding-block:clamp(4rem, 7vh, 5.5rem); position:relative; overflow:hidden; }
.footer__grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem;
  padding-bottom:clamp(3rem, 6vh, 4.5rem); position:relative; z-index:2;
}
@media(max-width:900px){ .footer__grid{ grid-template-columns:1fr 1fr; gap:2.5rem; } }
@media(max-width:520px){ .footer__grid{ grid-template-columns:1fr; gap:2.5rem; } }
.footer__brand{
  font-family:var(--serif); font-size:1.35rem; font-weight:500;
  letter-spacing:.02em; text-transform:uppercase; color:var(--bg); margin-bottom:1rem;
}
.footer__tag{ color:#9A9A9A; max-width:32ch; font-size:.92rem; line-height:1.6; }
.footer__icons{ display:flex; gap:.6rem; margin-top:1.25rem; }
.footer__icon{
  width:36px; height:36px; display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.2); color:var(--bg);
  transition: background .2s, color .2s, border-color .2s;
}
.footer__icon:hover{ background:var(--bg); color:var(--ink); border-color:var(--bg); }
.footer__icon svg{ width:16px; height:16px; display:block; }
.footer__col h4{
  font-family:var(--sans); font-size:.72rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:#9A9A9A; margin-bottom:1.1rem;
}
.footer__col ul{ list-style:none; display:flex; flex-direction:column; gap:.6rem; }
.footer__col a{ color:#D5D5D5; font-size:.92rem; transition:color .2s ease; }
.footer__col a:hover{ color:var(--bg); }
.footer__col address{ font-style:normal; color:#D5D5D5; font-size:.92rem; line-height:1.55; }
.footer__line{ height:1px; background:rgba(255,255,255,.15); margin-bottom:1.5rem; position:relative; z-index:2; }
.footer__base{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  font-size:.72rem; color:#9A9A9A; letter-spacing:.05em; position:relative; z-index:2;
}

/* ============================================================
   404 PAGE
   ============================================================ */
.notfound{
  min-height: calc(100svh - var(--nav-h));
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
  padding:clamp(3rem, 8vh, 6rem) var(--pad);
}
.notfound .caption{ color:var(--muted); margin-bottom:1.5rem; }
.notfound h1{ font-size:clamp(2.5rem, 7vw, 4.5rem); margin-bottom:1rem; }
.notfound p{ color:var(--muted); margin-bottom:2.5rem; max-width:46ch; }

/* ============================================================
   BLOG
   ============================================================ */
.blog-grid{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:clamp(1.5rem, 3vw, 2.5rem); position:relative; z-index:2;
}
@media(max-width:900px){ .blog-grid{ grid-template-columns:repeat(2, 1fr); } }
@media(max-width:580px){ .blog-grid{ grid-template-columns:1fr; } }
.post{
  display:flex; flex-direction:column;
  border:1px solid var(--hairline); background:var(--bg);
  transition: border-color .25s ease, transform .3s var(--ease);
  text-decoration:none; color:inherit;
}
.post:hover{ border-color:var(--ink); transform:translateY(-4px); }
.post__media{
  aspect-ratio:16/10; background:var(--soft);
  border-bottom:1px solid var(--hairline);
}
.post__body{ padding:1.5rem; display:flex; flex-direction:column; gap:.5rem; }
.post__cat{ font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.post__title{ font-family:var(--serif); font-size:1.25rem; font-weight:500; line-height:1.25; color:var(--ink); }
.post__excerpt{ font-size:.92rem; color:var(--muted); line-height:1.6; }
.post__meta{ font-size:.72rem; color:var(--muted); margin-top:.5rem; letter-spacing:.04em; }

/* ============================================================
   ARTICLE (single blog post)
   ============================================================ */
.article{ max-width:70ch; margin:0 auto; }
.article__head{ margin-bottom:clamp(2rem,4vh,3rem); }
.article__cat{ display:inline-block; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:1rem; }
.article__title{ font-family:var(--serif); font-size:clamp(2rem,4.4vw,3.4rem); line-height:1.1; font-weight:500; color:var(--ink); margin-bottom:1.2rem; }
.article__meta{ font-size:.85rem; color:var(--muted); letter-spacing:.02em; }
.article__meta span + span::before{ content:"·"; margin:0 .5rem; color:var(--hairline); }
.article__body{ font-size:1.02rem; line-height:1.75; color:var(--ink); }
.article__body > * + *{ margin-top:1.15rem; }
.article__body h2{ font-family:var(--serif); font-size:clamp(1.5rem,2.6vw,2rem); font-weight:500; line-height:1.2; margin-top:2.8rem; }
.article__body h3{ font-family:var(--serif); font-size:1.25rem; font-weight:500; margin-top:2rem; }
.article__body p{ color:var(--ink); }
.article__body a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.article__body ul, .article__body ol{ padding-left:1.4rem; }
.article__body li + li{ margin-top:.5rem; }
.article__body strong{ font-weight:600; }
.article__body blockquote{ font-family:var(--serif); font-style:italic; font-size:1.2rem; line-height:1.5; border-left:2px solid var(--ink); padding:.5rem 0 .5rem 1.25rem; color:var(--muted); }
.article__body hr{ border:none; border-top:1px solid var(--hairline); margin:2.4rem 0; }
.article__foot{ margin-top:clamp(3rem,6vh,4.5rem); padding-top:clamp(2rem,4vh,3rem); border-top:1px solid var(--hairline); display:flex; justify-content:center; }
.article__hero{ margin:2rem 0 clamp(2rem,4vh,3rem); border:1px solid var(--hairline); }
.article__hero img{ display:block; width:100%; height:auto; }
.article__toc{ background:var(--soft); border:1px solid var(--hairline); padding:1.25rem 1.5rem; margin:2rem 0; }
.article__toc-title{ font-family:var(--sans); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:.6rem; }
.article__toc ol{ padding-left:1.2rem; margin:0; }
.article__toc li{ font-size:.95rem; line-height:1.5; }
.article__toc li + li{ margin-top:.35rem; }
.article__toc a{ color:var(--ink); text-decoration:none; border-bottom:1px solid transparent; }
.article__toc a:hover{ border-bottom-color:var(--ink); }
.article__author{ margin-top:clamp(2.5rem,5vh,3.5rem); padding:1.5rem 1.75rem; border:1px solid var(--hairline); background:var(--soft); }
.article__author-title{ font-family:var(--sans); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.article__author-role{ font-size:.9rem; color:var(--muted); margin-top:.35rem; }
.article__author-bio{ margin-top:.75rem; font-size:.96rem; line-height:1.65; color:var(--ink); }
.article__author-link{ display:inline-block; margin-top:.75rem; color:var(--ink); text-decoration:underline; text-underline-offset:3px; font-size:.9rem; }
.article__pager{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:clamp(2.5rem,5vh,3.5rem); }
@media(max-width:640px){ .article__pager{ grid-template-columns:1fr; } }
.article__pager-link{ display:flex; flex-direction:column; gap:.35rem; padding:1rem 1.25rem; border:1px solid var(--hairline); text-decoration:none; color:inherit; transition:border-color .25s ease, transform .3s var(--ease); }
.article__pager-link:hover{ border-color:var(--ink); transform:translateY(-2px); }
.article__pager-link--next{ text-align:right; }
.article__pager-hint{ font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.article__pager-title{ font-family:var(--serif); font-size:1.02rem; font-weight:500; line-height:1.3; color:var(--ink); }
.crumbs{ font-size:.85rem; color:var(--muted); margin-bottom:1.5rem; }
.crumbs a{ color:var(--muted); text-decoration:none; border-bottom:1px solid transparent; }
.crumbs a:hover{ border-bottom-color:var(--muted); color:var(--ink); }
.crumbs span[aria-hidden]{ margin:0 .5rem; }
.pager{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:clamp(2.5rem,5vh,3.5rem); padding-top:clamp(2rem,4vh,2.5rem); border-top:1px solid var(--hairline); flex-wrap:wrap; }
.pager__link{ color:var(--ink); text-decoration:none; border-bottom:1px solid var(--hairline); padding-bottom:.15rem; font-size:.95rem; }
.pager__link:hover{ border-bottom-color:var(--ink); }
.pager__pos{ font-size:.85rem; color:var(--muted); letter-spacing:.02em; }
.s-related-heading{ font-family:var(--serif); font-size:clamp(1.4rem,2.2vw,1.8rem); font-weight:500; margin-bottom:1.5rem; }

/* pf-filter used on blog list too — anchor style parity with buttons */
.pf-filter a{ color:var(--ink); text-decoration:none; }

/* ============================================================
   GLOSSARY
   ============================================================ */

/* Small section eyebrow */
.gloss-eyebrow{
  display:block;
  font-family:var(--sans);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  margin-bottom:1rem;
}
.gloss-h3{
  font-family:var(--serif);
  font-size:clamp(1.35rem,2.1vw,1.75rem);
  font-weight:500;
  margin:0 0 1.5rem;
  line-height:1.15;
}

/* A–Z bar */
.gloss-alpha{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(44px, 1fr));
  gap:.25rem;
  margin:clamp(2rem,4vh,3rem) 0;
  padding:1rem;
  border:1px solid var(--hairline);
  background:var(--bg);
}
.gloss-alpha__link{
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:1;
  font-family:var(--serif);
  font-size:1.15rem;
  font-weight:500;
  color:var(--ink);
  text-decoration:none;
  border:1px solid transparent;
  transition:border-color .2s ease, background .2s ease, color .2s ease;
}
.gloss-alpha__link:not(.gloss-alpha__link--empty):hover{
  border-color:var(--ink);
  background:var(--soft);
}
.gloss-alpha__link--active{
  background:var(--ink);
  color:var(--bg);
  border-color:var(--ink);
}
.gloss-alpha__link--empty{
  color:var(--hairline);
  cursor:not-allowed;
}

/* Card grid */
.gloss-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
  gap:1rem;
}
.gloss-card{
  display:flex; flex-direction:column; gap:.65rem;
  padding:1.5rem 1.6rem 1.4rem;
  border:1px solid var(--hairline);
  background:var(--bg);
  text-decoration:none;
  color:inherit;
  position:relative;
  min-height:190px;
  overflow:hidden;
  transition:border-color .25s ease, transform .3s var(--ease), box-shadow .3s var(--ease);
}
.gloss-card:hover{
  border-color:var(--ink);
  transform:translateY(-3px);
  box-shadow:0 12px 28px -18px rgba(0,0,0,.25);
}
.gloss-card__letter{
  position:absolute;
  top:-8px; right:-2px;
  font-family:var(--serif);
  font-size:6rem;
  color:var(--soft);
  font-weight:500;
  line-height:1;
  pointer-events:none;
  user-select:none;
  z-index:0;
}
.gloss-card__cat{
  position:relative; z-index:1;
  align-self:flex-start;
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  padding:.28rem .55rem;
  border:1px solid var(--hairline);
  background:var(--bg);
}
.gloss-card__term{
  position:relative; z-index:1;
  font-family:var(--serif);
  font-size:1.28rem;
  font-weight:500;
  line-height:1.2;
  color:var(--ink);
  margin:0;
  padding-right:2.5rem;
}
.gloss-card__def{
  position:relative; z-index:1;
  font-size:.9rem;
  line-height:1.6;
  color:var(--muted);
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.gloss-card__arrow{
  position:relative; z-index:1;
  margin-top:auto;
  font-size:.78rem;
  letter-spacing:.06em;
  color:var(--ink);
  opacity:.55;
  transition:opacity .25s ease, transform .25s ease;
}
.gloss-card:hover .gloss-card__arrow{
  opacity:1;
  transform:translateX(3px);
}

/* Single-term detail page */
.gloss-entry{
  max-width:74ch;
  margin:0 auto;
}
.gloss-entry__head{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:1rem;
  margin-bottom:clamp(2rem,4vh,3rem);
  padding-bottom:1.75rem;
  border-bottom:1px solid var(--hairline);
  position:relative;
}
.gloss-entry__cat{
  display:inline-block;
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  padding:.35rem .7rem;
  border:1px solid var(--hairline);
  background:var(--soft);
  margin:0;
}
.gloss-entry__term{
  font-family:var(--serif);
  font-size:clamp(2.2rem,5vw,3.6rem);
  font-weight:500;
  line-height:1.05;
  color:var(--ink);
  margin:0;
  letter-spacing:-0.01em;
}
.gloss-entry__syn{
  margin:0;
  color:var(--muted);
  font-size:.92rem;
  font-style:italic;
}
.gloss-entry__syn strong{ font-style:normal; font-weight:500; color:var(--ink); }
.gloss-entry__body{
  font-size:1.05rem;
  line-height:1.8;
  color:var(--ink);
}
.gloss-entry__body p{ margin:0 0 1.15rem; }
.gloss-entry__body p:first-child::first-letter{
  font-family:var(--serif);
  font-size:3.6em;
  float:left;
  line-height:.85;
  padding:.15em .18em 0 0;
  color:var(--ink);
  font-weight:500;
}
.gloss-entry__body h2, .gloss-entry__body h3{ font-family:var(--serif); font-weight:500; }
.gloss-entry__body h2{ font-size:1.5rem; margin:2rem 0 .8rem; }
.gloss-entry__body h3{ font-size:1.2rem; margin:1.6rem 0 .6rem; }
.gloss-entry__body ul, .gloss-entry__body ol{ padding-left:1.4rem; margin:0 0 1.15rem; }
.gloss-entry__body li + li{ margin-top:.4rem; }
.gloss-entry__body a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.gloss-entry__body code{ background:var(--soft); padding:.12em .35em; font-size:.9em; border-radius:2px; }

/* Related terms */
.gloss-related{
  margin-top:clamp(2.5rem,5vh,3.5rem);
  padding:0;
  background:transparent;
  border:none;
}
.gloss-related__title{
  font-family:var(--sans);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  margin:0 0 1.25rem;
  padding-bottom:.75rem;
  border-bottom:1px solid var(--hairline);
}
.gloss-related__list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
  gap:.75rem;
}
.gloss-related__list li{ list-style:none; }
.gloss-related__list a{
  display:flex; flex-direction:column; gap:.35rem;
  padding:1rem 1.15rem;
  text-decoration:none;
  color:inherit;
  border:1px solid var(--hairline);
  background:var(--bg);
  transition:border-color .2s ease, transform .2s ease;
  height:100%;
}
.gloss-related__list a:hover{
  border-color:var(--ink);
  transform:translateY(-2px);
}
.gloss-related__list strong{
  font-family:var(--serif);
  font-size:1.02rem;
  font-weight:500;
  color:var(--ink);
  line-height:1.25;
}
.gloss-related__list span{
  font-size:.84rem;
  color:var(--muted);
  line-height:1.5;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* ============================================================
   METRO / LOCATION PAGES
   ============================================================ */
.metro-hero{ padding-top:clamp(2.5rem,5vh,4rem); }
.metro-hero__title{ font-family:var(--serif); font-size:clamp(2.5rem,5.5vw,4.4rem); font-weight:500; line-height:1.05; letter-spacing:-.01em; margin:1.5rem 0 1rem; color:var(--ink); }
.metro-hero__sub{ font-size:clamp(1rem,1.4vw,1.15rem); line-height:1.6; color:var(--muted); max-width:60ch; margin:0 0 1.75rem; }
.metro-hero__ctas{ display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.metro-intro{ max-width:70ch; font-size:1.02rem; line-height:1.8; color:var(--ink); }
.metro-intro p + p{ margin-top:1.2rem; }
.metro-hook{ max-width:70ch; }
.metro-hook h3{ font-family:var(--serif); font-size:clamp(1.35rem,2.1vw,1.7rem); font-weight:500; margin:0 0 1.25rem; }
.metro-hook ul{ list-style:none; padding:0; margin:0; display:grid; gap:1rem; }
.metro-hook li{ position:relative; padding:1.1rem 1.25rem 1.1rem 3rem; border:1px solid var(--hairline); background:var(--bg); line-height:1.6; color:var(--ink); }
.metro-hook li::before{ content:""; position:absolute; left:1.15rem; top:1.55rem; width:12px; height:1px; background:var(--ink); }
.metro-hook li strong{ font-weight:600; }
.metro-hook em{ font-style:italic; color:var(--muted); }
.metro-hook p{ color:var(--muted); line-height:1.7; margin:0 0 1rem; }
.metro-note{ margin-top:1.5rem; padding:1rem 1.25rem; background:var(--soft); border-left:2px solid var(--ink); font-size:.95rem; color:var(--ink); max-width:70ch; }
.metro-note strong{ font-weight:600; }
.metro-two-col{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,3vw,2.5rem); }
@media(max-width:800px){ .metro-two-col{ grid-template-columns:1fr; } }
.metro-two-col__block{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); }
.metro-block__title{ font-family:var(--serif); font-size:clamp(1.3rem,2vw,1.6rem); font-weight:500; margin:.5rem 0 1rem; color:var(--ink); }
.metro-list{ list-style:none; padding:0; margin:0; display:grid; gap:.75rem; }
.metro-list li{ padding:.7rem 0; border-bottom:1px dashed var(--hairline); font-size:.95rem; line-height:1.4; color:var(--ink); }
.metro-list li:last-child{ border-bottom:none; }
.metro-chips{ display:flex; flex-wrap:wrap; gap:.5rem; }
.metro-chip{ padding:.35rem .75rem; border:1px solid var(--hairline); background:var(--soft); font-size:.85rem; color:var(--ink); letter-spacing:.01em; }
.metro-cta{ max-width:70ch; margin:0 auto; text-align:center; padding:clamp(2rem,4vh,3rem) 0; }
.metro-cta .caption{ margin-bottom:1rem; }
.metro-cta h2{ font-family:var(--serif); font-size:clamp(2rem,3.5vw,2.8rem); font-weight:500; margin:0 0 1rem; line-height:1.1; }
.metro-cta p{ color:var(--muted); line-height:1.7; margin:0 0 1.75rem; }
.metro-cta__actions{ display:inline-flex; align-items:center; gap:1.5rem; flex-wrap:wrap; justify-content:center; }

/* Skip-to-content link (a11y) — sr-only pattern */
.skip-link{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  -webkit-clip-path:inset(50%);
          clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}
.skip-link:focus{
  position:fixed !important;
  top:1rem; left:1rem;
  width:auto; height:auto;
  padding:.75rem 1rem;
  clip:auto;
  -webkit-clip-path:none;
          clip-path:none;
  background:var(--ink);
  color:var(--bg);
  z-index:9999;
  font-family:var(--sans);
  font-size:.9rem;
  font-weight:500;
  text-decoration:none;
  border-radius:4px;
  outline:2px solid var(--bg);
  outline-offset:2px;
}

/* Hire rate card */
.rate-card{ display:flex; flex-direction:column; gap:.35rem; padding:1.5rem 1.75rem; background:var(--bg); border:1px solid var(--hairline); max-width:70ch; margin-top:1.5rem; }
.rate-card__label{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.rate-card__value{ font-family:var(--serif); font-size:1.85rem; font-weight:500; color:var(--ink); }
.rate-card__note{ font-size:.88rem; color:var(--muted); line-height:1.5; }

/* Pricing tier cards */
.tier-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1.25rem; }
.tier-card{ padding:2rem 2.15rem 1.75rem; border:1px solid var(--hairline); background:var(--bg); position:relative; overflow:hidden; }
.tier-card__num{ position:absolute; top:-8px; right:0; font-family:var(--serif); font-size:5rem; color:var(--soft); font-weight:500; line-height:1; pointer-events:none; z-index:0; }
.tier-card__name{ position:relative; z-index:1; font-family:var(--serif); font-size:1.35rem; font-weight:500; margin:0 0 .5rem; color:var(--ink); }
.tier-card__price{ position:relative; z-index:1; font-family:var(--serif); font-size:1.6rem; font-weight:500; color:var(--ink); margin-bottom:.35rem; }
.tier-card__timeline{ position:relative; z-index:1; font-size:.82rem; letter-spacing:.06em; color:var(--muted); margin-bottom:1.25rem; padding-bottom:1rem; border-bottom:1px solid var(--hairline); }
.tier-card__bullets{ position:relative; z-index:1; list-style:none; padding:0; margin:0; display:grid; gap:.55rem; }
.tier-card__bullets li{ font-size:.9rem; line-height:1.55; color:var(--muted); padding-left:1.15rem; position:relative; }
.tier-card__bullets li::before{ content:""; position:absolute; left:0; top:.7em; width:8px; height:1px; background:var(--ink); }

/* Cost drivers */
.drivers{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:1rem; max-width:80ch; }
.driver{ padding:1.15rem 1.35rem; border:1px solid var(--hairline); background:var(--bg); }
.driver__label{ display:block; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:.5rem; }
.driver__note{ font-size:.92rem; line-height:1.5; color:var(--ink); margin:0; }

/* Hidden costs list */
.hidden-costs{ list-style:none; padding:0; margin:0; max-width:70ch; display:grid; gap:.65rem; }
.hidden-costs li{ padding:.75rem 1rem; background:var(--soft); border-left:2px solid var(--hairline); font-size:.92rem; line-height:1.5; color:var(--ink); }

/* Compare / comparison pages */
.cmp-strengths{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:1.25rem; }
.cmp-strength{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); }
.cmp-strength__tag{ display:inline-block; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:500; padding:.3rem .65rem; border:1px solid var(--hairline); background:var(--soft); margin-bottom:1rem; }
.cmp-strength__body ul{ list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.cmp-strength__body li{ font-size:.95rem; line-height:1.6; color:var(--ink); padding-left:1.1rem; position:relative; }
.cmp-strength__body li::before{ content:""; position:absolute; left:0; top:.75em; width:8px; height:1px; background:var(--ink); }
.cmp-strength__body strong{ font-weight:600; }
.cmp-table-wrap{ overflow-x:auto; }
.cmp-table{ width:100%; border-collapse:collapse; background:var(--bg); border:1px solid var(--hairline); }
.cmp-table th, .cmp-table td{ text-align:left; padding:.85rem 1rem; border-bottom:1px solid var(--hairline); vertical-align:top; font-size:.92rem; line-height:1.5; }
.cmp-table thead th{ background:var(--soft); font-family:var(--sans); font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.cmp-table tbody th{ font-family:var(--sans); font-size:.9rem; font-weight:500; color:var(--ink); }
.cmp-table td.is-winner{ background:rgba(0,0,0,.03); font-weight:600; color:var(--ink); }
.cmp-table tr:last-child th, .cmp-table tr:last-child td{ border-bottom:none; }
.cmp-decision{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:1.25rem; }
.cmp-decision__block{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); }
.cmp-decision__block h3{ font-family:var(--serif); font-size:1.2rem; font-weight:500; margin:0 0 .75rem; color:var(--ink); }
.cmp-decision__block strong{ font-weight:600; }
.cmp-decision__block p{ font-size:.95rem; line-height:1.6; color:var(--muted); margin:0; }
.cmp-verdict{ margin-top:2rem; padding:1.5rem 1.75rem; background:var(--soft); border-left:3px solid var(--ink); max-width:70ch; }
.cmp-verdict__label{ display:block; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:.6rem; }
.cmp-verdict p{ font-family:var(--serif); font-size:1.05rem; line-height:1.55; color:var(--ink); margin:0; }

/* Tech stack grid (services pages) */
.stack-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:1rem; }
.stack-card{ padding:1.5rem 1.65rem; border:1px solid var(--hairline); background:var(--bg); }
.stack-card__label{ display:block; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:.9rem; padding-bottom:.6rem; border-bottom:1px solid var(--hairline); }
.stack-card__items{ list-style:none; padding:0; margin:0; display:grid; gap:.5rem; }
.stack-card__items li{ font-size:.92rem; line-height:1.4; color:var(--ink); }

/* Process steps (services pages) */
.process-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:1.25rem; }
.process-step{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); position:relative; }
.process-step__num{ display:block; font-family:var(--serif); font-size:2.5rem; font-weight:500; color:var(--hairline); line-height:1; margin-bottom:.75rem; }
.process-step__title{ font-family:var(--serif); font-size:1.15rem; font-weight:500; line-height:1.25; color:var(--ink); margin:0 0 .65rem; }
.process-step__desc{ font-size:.92rem; line-height:1.6; color:var(--muted); margin:0; }

/* Services index — big cards with number badge */
.svc-cards{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(340px, 1fr));
  gap:1.25rem;
  margin-top:clamp(2rem,4vh,3rem);
}
@media(min-width:900px){
  .svc-cards{ grid-template-columns:repeat(2, 1fr); gap:1.5rem; }
}
@media(min-width:1200px){
  .svc-cards{ grid-template-columns:repeat(3, 1fr); }
}
.svc-card{
  display:flex; flex-direction:column;
  gap:.75rem;
  padding:2.25rem 2.25rem 2rem;
  border:1px solid var(--hairline);
  background:var(--bg);
  text-decoration:none;
  color:inherit;
  position:relative;
  overflow:hidden;
  min-height:280px;
  transition:border-color .25s ease, transform .3s var(--ease), box-shadow .3s var(--ease);
}
.svc-card:hover{
  border-color:var(--ink);
  transform:translateY(-4px);
  box-shadow:0 18px 40px -24px rgba(0,0,0,.28);
}
.svc-card__num{
  position:absolute;
  top:.75rem; right:1.25rem;
  font-family:var(--serif);
  font-size:4.5rem;
  color:var(--soft);
  font-weight:500;
  line-height:1;
  pointer-events:none;
  user-select:none;
  z-index:0;
}
.svc-card__tag{
  position:relative; z-index:1;
  align-self:flex-start;
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  padding:.3rem .65rem;
  border:1px solid var(--hairline);
  background:var(--bg);
}
.svc-card__title{
  position:relative; z-index:1;
  font-family:var(--serif);
  font-size:clamp(1.4rem,1.8vw,1.7rem);
  font-weight:500;
  line-height:1.15;
  margin:.25rem 0 0;
  color:var(--ink);
  letter-spacing:-.005em;
  padding-right:2.5rem;
}
.svc-card__desc{
  position:relative; z-index:1;
  font-size:.95rem;
  line-height:1.6;
  color:var(--muted);
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.svc-card__cta{
  position:relative; z-index:1;
  margin-top:auto;
  padding-top:.75rem;
  border-top:1px solid var(--hairline);
  font-size:.85rem;
  letter-spacing:.02em;
  color:var(--ink);
  font-weight:500;
  display:flex; align-items:center; justify-content:space-between;
}
.svc-card__cta span{ transition:transform .25s ease; }
.svc-card:hover .svc-card__cta span{ transform:translateX(4px); }

/* Locations index grid */
.metro-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:1.25rem; margin-top:clamp(2rem,4vh,3rem); }
.metro-card{ display:flex; flex-direction:column; gap:.6rem; padding:2rem 2.15rem 1.75rem; border:1px solid var(--hairline); background:var(--bg); text-decoration:none; color:inherit; position:relative; overflow:hidden; transition:border-color .25s ease, transform .3s var(--ease), box-shadow .3s var(--ease); }
.metro-card:hover{ border-color:var(--ink); transform:translateY(-3px); box-shadow:0 14px 32px -20px rgba(0,0,0,.25); }
.metro-card__state{ font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.metro-card__name{ font-family:var(--serif); font-size:2rem; font-weight:500; line-height:1.05; margin:0; color:var(--ink); letter-spacing:-.01em; }
.metro-card__desc{ font-size:.92rem; line-height:1.55; color:var(--muted); margin:.35rem 0 .75rem; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.metro-card__arrow{ font-size:.82rem; letter-spacing:.05em; color:var(--ink); opacity:.6; margin-top:auto; transition:opacity .25s ease, transform .25s ease; }
.metro-card:hover .metro-card__arrow{ opacity:1; transform:translateX(3px); }

/* Bottom compact alphabet strip */
.gloss-alpha--strip{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.1rem;
  padding:.6rem;
  background:transparent;
  border-top:1px solid var(--hairline);
  border-bottom:none;
  border-left:none;
  border-right:none;
}
.gloss-alpha--strip .gloss-alpha__link{
  aspect-ratio:auto;
  width:34px; height:34px;
  font-size:.98rem;
}

/* ============================================================
   REVEAL STATES (pre-animation hidden)
   ============================================================ */
[data-reveal-fade]{ opacity:0; transform:translateY(20px); }
[data-reveal-left]{ opacity:0; transform:translateX(-24px); }
[data-stagger-item]{ opacity:0; transform:translateY(30px); }
[data-reveal-lines]{ opacity:0; transform:translateY(28px); clip-path:inset(100% 0 0 0); -webkit-clip-path:inset(100% 0 0 0); }
[data-hero-h1]{ opacity:0; transform:translateY(28px); clip-path:inset(100% 0 0 0); -webkit-clip-path:inset(100% 0 0 0); }

@media (prefers-reduced-motion: reduce){
  [data-reveal-fade], [data-reveal-left], [data-stagger-item], [data-reveal-lines], [data-hero-h1]{
    opacity:1; transform:none; clip-path:none; -webkit-clip-path:none;
  }
}

/* ============================================================
   Narrow wrap (for team + case study body copy)
   ============================================================ */
.wrap--narrow{ max-width:min(72ch, 100%); margin-left:auto; margin-right:auto; }

/* ============================================================
   Team pages (/team/, /team/[slug]/)
   ============================================================ */
.team__links{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:.75rem; }

.team-index{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:1.5rem; margin-top:clamp(2rem,4vh,3rem); }
.team-index__card{ display:flex; flex-direction:column; text-decoration:none; color:inherit; border:1px solid var(--hairline); background:var(--bg); overflow:hidden; transition:transform .3s ease, border-color .3s ease; }
.team-index__card:hover{ transform:translateY(-4px); border-color:var(--ink); }
.team-index__portrait{ aspect-ratio:1/1; overflow:hidden; background:var(--soft); }
.team-index__portrait img{ width:100%; height:100%; object-fit:cover; object-position:center var(--photo-y, 50%); transform:scale(var(--photo-scale, 1)); }
.team-index__meta{ padding:1.5rem 1.75rem; }
.team-index__role{ display:block; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:.5rem; }
.team-index__name{ font-family:var(--serif); font-weight:500; font-size:1.5rem; margin:0 0 .5rem; }
.team-index__bio{ font-size:.92rem; line-height:1.6; color:var(--muted); margin:0 0 1rem; }
.team-index__cta{ font-size:.85rem; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:2px; }

.team-hero{ display:grid; grid-template-columns:minmax(240px, 320px) 1fr; gap:clamp(2rem, 5vw, 4rem); align-items:start; margin-top:clamp(2rem,4vh,3rem); }
@media (max-width: 720px){ .team-hero{ grid-template-columns:1fr; } .team-hero__portrait{ max-width:280px; } }
.team-hero__portrait{ aspect-ratio:1/1; overflow:hidden; background:var(--soft); }
.team-hero__portrait img{ width:100%; height:100%; object-fit:cover; object-position:center var(--photo-y, 50%); transform:scale(var(--photo-scale, 1)); }
.team-hero__facts{ display:flex; flex-direction:column; gap:.5rem; margin-top:1.5rem; font-size:.9rem; color:var(--muted); }
.team-hero__facts strong{ color:var(--ink); font-weight:500; margin-right:.5rem; }
.team-hero__links{ display:flex; gap:.75rem; flex-wrap:wrap; margin-top:1.5rem; }

.team-body p{ font-size:1.05rem; line-height:1.75; color:var(--ink); margin:0 0 1.25rem; }

.team-focus{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1.25rem; margin-top:clamp(1.5rem,3vh,2rem); }
.team-focus__card{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); }
.team-focus__title{ font-family:var(--serif); font-weight:500; font-size:1.15rem; margin:0 0 .75rem; color:var(--ink); }
.team-focus__desc{ font-size:.92rem; line-height:1.65; color:var(--muted); margin:0; }

.team-cred{ list-style:none; padding:0; margin:clamp(1.5rem,3vh,2rem) 0 0; max-width:70ch; display:grid; gap:.65rem; }
.team-cred li{ position:relative; padding-left:1.25rem; font-size:.95rem; line-height:1.6; color:var(--ink); }
.team-cred li::before{ content:""; position:absolute; left:0; top:.75em; width:10px; height:1px; background:var(--ink); }

.team-tags{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:clamp(1.5rem,3vh,2rem); }
.team-tag{ font-size:.8rem; padding:.4rem .8rem; border:1px solid var(--hairline); background:var(--soft); color:var(--ink); letter-spacing:.02em; }

.team-proj{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1.25rem; margin-top:clamp(1.5rem,3vh,2rem); }
.team-proj__card{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); }
.team-proj__role{ display:block; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:.5rem; }
.team-proj__name{ font-family:var(--serif); font-weight:500; font-size:1.2rem; margin:0 0 .5rem; color:var(--ink); }
.team-proj__desc{ font-size:.9rem; line-height:1.6; color:var(--muted); margin:0; }
.team-proj__card--linked{ text-decoration:none; color:inherit; display:block; transition:border-color .2s ease, transform .2s ease; }
.team-proj__card--linked:hover{ border-color:var(--ink); transform:translateY(-2px); }
.team-proj__cta{ display:inline-block; margin-top:.9rem; font-size:.82rem; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:1px; }

/* ============================================================
   Case study pages (/portfolio/[slug]/)
   ============================================================ */
.case-facts{ display:flex; flex-wrap:wrap; gap:1.5rem 2.5rem; margin-top:clamp(1.5rem,3vh,2rem); padding:1.25rem 0; border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.case-facts > div{ display:flex; flex-direction:column; gap:.25rem; }
.case-facts__label{ font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.case-facts a{ color:var(--ink); text-decoration:none; border-bottom:1px solid var(--hairline); padding-bottom:1px; }
.case-facts a:hover{ border-bottom-color:var(--ink); }

.case-hero{ margin:clamp(2rem,4vh,3rem) 0 0; }
.case-hero img{ width:100%; height:auto; display:block; }

.case-body{ display:flex; flex-direction:column; gap:clamp(2.5rem,5vh,4rem); }
.case-body__section{ }
.case-body__section h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.5rem, 2.5vw, 2rem); margin:1rem 0 1.25rem; color:var(--ink); }
.case-body__section p{ font-size:1.05rem; line-height:1.75; color:var(--ink); margin:0 0 1.25rem; }

.case-metrics{ display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:1.25rem; margin-top:clamp(1.5rem,3vh,2rem); }
.case-metric{ padding:1.75rem 1.85rem; border:1px solid var(--hairline); background:var(--bg); text-align:center; }
.case-metric__value{ display:block; font-family:var(--serif); font-weight:500; font-size:clamp(1.75rem, 3vw, 2.5rem); color:var(--ink); line-height:1.1; margin-bottom:.5rem; }
.case-metric__label{ display:block; font-size:.85rem; color:var(--muted); line-height:1.4; }

.case-testimonial{ margin:0; padding:2.5rem 2.75rem; background:var(--bg); border:1px solid var(--hairline); position:relative; }
.case-testimonial__quote{ font-family:var(--serif); font-weight:500; font-size:clamp(1.15rem, 1.8vw, 1.4rem); line-height:1.5; color:var(--ink); margin:0 0 1.5rem; }
.case-testimonial__by{ display:flex; flex-direction:column; gap:.2rem; }
.case-testimonial__name{ font-weight:500; color:var(--ink); }
.case-testimonial__role{ font-size:.85rem; color:var(--muted); }

.case-gallery{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:1.25rem; margin-top:clamp(1.5rem,3vh,2rem); }
.case-gallery__item{ margin:0; overflow:hidden; border:1px solid var(--hairline); background:var(--bg); }
.case-gallery__item img{ width:100%; height:auto; display:block; }

/* ============================================================
   Reviews hub (/reviews/)
   ============================================================ */
.reviews-summary{ display:flex; flex-wrap:wrap; align-items:center; gap:2rem; margin:clamp(2rem,4vh,3rem) 0; padding:2rem 2.25rem; border:1px solid var(--hairline); background:var(--bg); }
.reviews-summary__score{ display:flex; flex-direction:column; align-items:center; gap:.25rem; }
.reviews-summary__num{ font-family:var(--serif); font-weight:500; font-size:clamp(2.5rem, 5vw, 4rem); line-height:1; color:var(--ink); }
.reviews-summary__stars{ font-size:1.25rem; color:var(--ink); letter-spacing:.15em; }
.reviews-summary__meta{ display:flex; flex-direction:column; gap:.35rem; }
.reviews-summary__meta strong{ font-size:1.1rem; color:var(--ink); font-weight:500; }

.reviews-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:1.25rem; margin-top:clamp(1.5rem,3vh,2rem); }
.review-card{ padding:2rem 2.15rem; border:1px solid var(--hairline); background:var(--bg); display:flex; flex-direction:column; gap:1rem; }
.review-card__stars{ font-size:.95rem; color:var(--ink); letter-spacing:.15em; }
.review-card__quote{ font-family:var(--serif); font-weight:500; font-size:1.05rem; line-height:1.6; color:var(--ink); margin:0; }
.review-card__by{ display:flex; flex-direction:column; gap:.2rem; padding-top:.75rem; border-top:1px solid var(--hairline); }
.review-card__name{ font-weight:500; color:var(--ink); }
.review-card__co{ font-size:.85rem; color:var(--muted); }
.review-card__country{ font-size:.8rem; color:var(--muted); letter-spacing:.04em; }
.review-card__meta{ display:flex; justify-content:space-between; align-items:center; gap:1rem; padding-top:.75rem; border-top:1px solid var(--hairline); font-size:.78rem; color:var(--muted); }
.review-card__service{ letter-spacing:.05em; }

.reviews-by-svc{ list-style:none; padding:0; margin:clamp(1.5rem,3vh,2rem) 0 0; display:grid; gap:.6rem; }
.reviews-by-svc li{ display:flex; justify-content:space-between; padding:1rem 0; border-bottom:1px solid var(--hairline); font-size:.95rem; }
.reviews-by-svc__name{ color:var(--ink); font-weight:500; }
.reviews-by-svc__count{ color:var(--muted); font-size:.85rem; }

/* ============================================================
   Glossary/blog inline services + explore blocks
   ============================================================ */
.gloss-services{ margin:clamp(2rem,4vh,3rem) 0 0; padding:2rem 2.25rem; border:1px solid var(--hairline); background:var(--soft); }
.gloss-services__intro{ font-size:.95rem; line-height:1.65; color:var(--muted); margin:0 0 1.5rem; max-width:65ch; }
.gloss-services__grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:.75rem; }
.gloss-services__card{ display:flex; flex-direction:column; gap:.4rem; padding:1.15rem 1.35rem; background:var(--bg); border:1px solid var(--hairline); color:var(--ink); text-decoration:none; transition:border-color .2s ease, transform .2s ease; }
.gloss-services__card:hover{ border-color:var(--ink); transform:translateY(-2px); }
.gloss-services__cat{ font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.gloss-services__card strong{ font-family:var(--serif); font-weight:500; font-size:1rem; color:var(--ink); }

.gloss-explore{ margin:clamp(2rem,4vh,3rem) 0 0; padding:2rem 2.25rem; border:1px solid var(--hairline); background:var(--bg); }
.gloss-explore__grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:1rem; }
.gloss-explore__link{ display:flex; flex-direction:column; gap:.35rem; padding:.85rem 0; text-decoration:none; color:var(--ink); border-bottom:1px solid var(--hairline); transition:padding-left .2s ease; }
.gloss-explore__link:hover{ padding-left:.35rem; }
.gloss-explore__link strong{ font-family:var(--serif); font-weight:500; font-size:1.05rem; color:var(--ink); }
.gloss-explore__link span{ font-size:.85rem; color:var(--muted); line-height:1.5; }

/* ============================================================
   Location × service pages
   ============================================================ */
.loc-svc-intro{ margin-top:clamp(1.5rem,3vh,2rem); padding:1.5rem 1.75rem; background:var(--soft); border-left:2px solid var(--ink); }
.loc-svc-intro p{ margin:0; font-size:1rem; line-height:1.7; color:var(--ink); }

/* ============================================================
   Blog author links group
   ============================================================ */
.article__author-links{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:.75rem; }

/* ============================================================
   Tools (/tools/, /tools/[slug]/)
   ============================================================ */
.calc{ display:grid; grid-template-columns:1fr; gap:2rem; margin-top:clamp(2rem,4vh,3rem); }
@media (min-width: 960px){ .calc{ grid-template-columns:1.1fr 1fr; align-items:start; } }

.calc__form{ padding:2rem 2.25rem; border:1px solid var(--hairline); background:var(--bg); display:flex; flex-direction:column; gap:1.75rem; }
.calc__field{ border:0; padding:0; margin:0; }
.calc__label{ display:block; font-family:var(--serif); font-size:1.1rem; font-weight:500; color:var(--ink); margin-bottom:.9rem; padding:0; }
.calc__opts{ display:grid; grid-template-columns:1fr; gap:.55rem; }
@media (min-width: 640px){ .calc__opts{ grid-template-columns:repeat(2, 1fr); } }

.calc__opt{ display:flex; align-items:flex-start; gap:.75rem; padding:.9rem 1rem; border:1px solid var(--hairline); background:var(--soft); cursor:pointer; transition:border-color .2s ease, background .2s ease; }
.calc__opt:hover{ border-color:var(--ink); }
.calc__opt input{ margin-top:.25rem; accent-color:var(--ink); flex-shrink:0; }
.calc__opt span{ display:flex; flex-direction:column; gap:.25rem; }
.calc__opt strong{ font-weight:500; color:var(--ink); font-size:.95rem; }
.calc__opt small{ font-size:.8rem; color:var(--muted); line-height:1.4; }
.calc__opt input:checked ~ span strong{ font-weight:600; }
.calc__opt:has(input:checked){ border-color:var(--ink); background:var(--bg); box-shadow:inset 3px 0 0 var(--ink); }

.calc__grid{ display:grid; grid-template-columns:1fr; gap:.85rem; }
@media (min-width: 640px){ .calc__grid{ grid-template-columns:1fr 1fr; } }

.calc__input{ display:flex; flex-direction:column; gap:.35rem; }
.calc__input span{ font-size:.78rem; color:var(--muted); letter-spacing:.04em; }
.calc__input input, .calc__input textarea, .calc__input select{
  padding:.65rem .85rem; border:1px solid var(--hairline); background:var(--bg); color:var(--ink);
  font-family:inherit; font-size:.95rem; border-radius:0; -webkit-appearance:none; appearance:none;
}
.calc__input input:focus, .calc__input textarea:focus{ outline:none; border-color:var(--ink); }
.calc__input textarea{ resize:vertical; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.88rem; line-height:1.5; }

.calc__repeat{ display:flex; flex-direction:column; gap:.75rem; margin-bottom:.75rem; }
.calc__row{ display:grid; grid-template-columns:1fr; gap:.5rem; padding:.85rem; background:var(--soft); border:1px solid var(--hairline); position:relative; }
@media (min-width: 720px){ .calc__row{ grid-template-columns:1fr 1fr 1fr auto; align-items:end; } }
.calc__remove{ background:none; border:1px solid var(--hairline); color:var(--muted); width:32px; height:32px; cursor:pointer; font-size:1.2rem; line-height:1; align-self:end; transition:color .2s ease, border-color .2s ease; }
.calc__remove:hover{ color:var(--ink); border-color:var(--ink); }

.calc__submit{ align-self:flex-start; }

.calc__result{ padding:2rem 2.25rem; border:1px solid var(--hairline); background:var(--soft); display:flex; flex-direction:column; gap:1.25rem; position:sticky; top:1rem; }
.calc__result[hidden]{ display:none; }
.calc__result-title{ font-family:var(--serif); font-weight:500; font-size:1.5rem; margin:0; color:var(--ink); }
.calc__result-price{ font-family:var(--serif); font-weight:500; font-size:clamp(1.8rem, 3.5vw, 2.5rem); line-height:1.1; color:var(--ink); }
.calc__result-timeline{ font-size:.95rem; color:var(--muted); letter-spacing:.02em; }
.calc__result-tier{ padding-top:1rem; border-top:1px solid var(--hairline); }
.calc__result-tier p{ margin:.35rem 0; font-size:.92rem; line-height:1.55; }

.calc__breakdown{ padding-top:1rem; border-top:1px solid var(--hairline); }
.calc__breakdown h3{ font-family:var(--serif); font-weight:500; font-size:1rem; margin:0 0 .75rem; color:var(--ink); }
.calc__breakdown ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.calc__breakdown li{ display:flex; justify-content:space-between; gap:1rem; font-size:.88rem; color:var(--ink); padding:.4rem 0; border-bottom:1px dashed var(--hairline); }
.calc__breakdown li:last-child{ border-bottom:0; }
.calc__breakdown li span:last-child{ color:var(--muted); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.82rem; text-align:right; }
.calc__breakdown code{ font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.85em; padding:.1em .35em; background:var(--bg); border:1px solid var(--hairline); }

.calc__actions{ display:flex; gap:.75rem; flex-wrap:wrap; }

.calc__disclaimer{ font-size:.78rem; padding-top:.85rem; border-top:1px solid var(--hairline); line-height:1.5; }

.calc__output-wrap{ background:var(--bg); border:1px solid var(--hairline); }
.calc__output{ width:100%; padding:1.15rem 1.35rem; border:0; background:transparent; color:var(--ink); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.82rem; line-height:1.6; resize:vertical; outline:none; min-height:400px; }

.faq-list{ display:flex; flex-direction:column; gap:.5rem; margin-top:clamp(1.5rem,3vh,2rem); }
.faq-item{ border:1px solid var(--hairline); background:var(--bg); }
.faq-item__q{ padding:1.15rem 1.5rem; cursor:pointer; font-family:var(--serif); font-weight:500; font-size:1.05rem; color:var(--ink); list-style:none; position:relative; padding-right:3rem; }
.faq-item__q::-webkit-details-marker{ display:none; }
.faq-item__q::after{ content:"+"; position:absolute; right:1.5rem; top:1.15rem; font-size:1.4rem; line-height:1; color:var(--muted); transition:transform .2s ease; }
.faq-item[open] .faq-item__q::after{ content:"−"; }
.faq-item__a{ padding:0 1.5rem 1.35rem; font-size:.95rem; line-height:1.65; color:var(--ink); }

/* Checkbox variant of calc__opts (for multi-select modules) */
.calc__opts--check .calc__opt input[type="checkbox"]{ margin-top:.3rem; accent-color:var(--ink); flex-shrink:0; }

/* Website health score display */
.health-loading-bar{ height:4px; background:var(--hairline); overflow:hidden; margin-top:1rem; position:relative; }
.health-loading-bar__fill{ position:absolute; top:0; left:-30%; width:30%; height:100%; background:var(--ink); animation:healthLoading 1.4s ease-in-out infinite; }
@keyframes healthLoading { 0%{ left:-30%; } 100%{ left:100%; } }

.health-grade{ display:flex; align-items:center; gap:1.5rem; padding:1.5rem 0; border-bottom:1px solid var(--hairline); }
.health-grade__letter{ font-family:var(--serif); font-weight:500; font-size:clamp(4rem, 8vw, 6rem); line-height:1; padding:.25rem 1.25rem; border:2px solid var(--ink); color:var(--ink); }
.health-grade__letter[data-grade="A"]{ background:#10371f; color:#fff; border-color:#10371f; }
.health-grade__letter[data-grade="B"]{ background:#1f4d3a; color:#fff; border-color:#1f4d3a; }
.health-grade__letter[data-grade="C"]{ background:#8a7020; color:#fff; border-color:#8a7020; }
.health-grade__letter[data-grade="D"]{ background:#a04d20; color:#fff; border-color:#a04d20; }
.health-grade__letter[data-grade="F"]{ background:#8b1e1e; color:#fff; border-color:#8b1e1e; }
.health-grade__number{ font-family:var(--serif); font-weight:500; font-size:clamp(2rem, 4vw, 3rem); line-height:1; color:var(--ink); }
.health-grade__number small{ font-size:.5em; color:var(--muted); font-weight:400; margin-left:.15rem; }

.health-verdict{ font-family:var(--serif); font-size:1.15rem; line-height:1.5; color:var(--ink); margin:0; padding-bottom:.5rem; }

.health-checks{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.health-check{ padding:1rem 1.15rem; background:var(--bg); border:1px solid var(--hairline); border-left-width:3px; }
.health-check--ok{ border-left-color:#2b8a4a; opacity:.85; }
.health-check--low{ border-left-color:#c08b1e; }
.health-check--medium{ border-left-color:#c07020; }
.health-check--high{ border-left-color:#c04a20; }
.health-check--critical{ border-left-color:#8b1e1e; background:#faf2f2; }
.health-check__head{ display:flex; align-items:center; gap:.75rem; }
.health-check__icon{ width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; font-weight:700; font-size:.85rem; flex-shrink:0; }
.health-check--ok .health-check__icon{ background:#2b8a4a; color:#fff; }
.health-check:not(.health-check--ok) .health-check__icon{ background:#8b1e1e; color:#fff; }
.health-check__label{ flex:1; font-family:var(--serif); font-weight:500; font-size:1rem; color:var(--ink); }
.health-check__sev{ font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); padding:.15rem .55rem; border:1px solid var(--hairline); }
.health-check__detail{ margin-top:.5rem; margin-left:calc(24px + .75rem); font-size:.82rem; color:var(--muted); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.health-check__why{ margin-top:.5rem; margin-left:calc(24px + .75rem); font-size:.9rem; line-height:1.55; color:var(--ink); }

/* Website ROI Calculator stat blocks */
.roi-stats{ display:grid; grid-template-columns:1fr; gap:.85rem; padding-bottom:1rem; border-bottom:1px solid var(--hairline); }
.roi-stat{ display:flex; flex-direction:column; gap:.35rem; padding:1rem 1.15rem; background:var(--bg); border:1px solid var(--hairline); }
.roi-stat--highlight{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.roi-stat--highlight .roi-stat__label{ color:var(--bg); opacity:.75; }
.roi-stat--highlight .roi-stat__value{ color:var(--bg); }
.roi-stat__label{ font-size:.78rem; color:var(--muted); letter-spacing:.04em; text-transform:uppercase; }
.roi-stat__value{ font-family:var(--serif); font-weight:500; font-size:clamp(1.5rem, 3vw, 2rem); line-height:1.1; color:var(--ink); }