:root{
  --onyx:#1E1E1E;
  --graphite:#4A4A4A;
  --cream:#F8F4EE;
  --linen:#F2EBE0;
  --stone:#E0D8CF;
  --gold:#E8D4AE;
  --burgundy:#9B2438;
  --burgundy-light:#B43D52;
  --max:1152px;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:96px; }
body{
  font-family:'Inter', Arial, sans-serif;
  background-color:var(--cream);
  color:var(--onyx);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
img{ max-width:100%; display:block; -webkit-user-drag:none; user-select:none; -webkit-user-select:none; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; }
input, select, textarea{ font-family:inherit; font-size:14px; }

.font-display{ font-family:'Montserrat', Arial, sans-serif; }
::selection{ background:var(--burgundy); color:#fff; }

::-webkit-scrollbar{ width:6px; }
::-webkit-scrollbar-track{ background:var(--cream); }
::-webkit-scrollbar-thumb{ background:var(--stone); }
::-webkit-scrollbar-thumb:hover{ background:var(--burgundy); }

a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible{
  outline:1px solid var(--burgundy);
  outline-offset:4px;
}

.wrap{ max-width:var(--max); margin:0 auto; padding:0 24px; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

.eyebrow{
  font-family:'Montserrat', Arial, sans-serif;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.4em;
  color:var(--burgundy);
  font-weight:500;
  display:block;
  margin-bottom:24px;
  text-align:center;
}
.eyebrow.gold{ color:var(--gold); }
.eyebrow.left{ text-align:left; }

h2.section-title{
  font-family:'Montserrat', Arial, sans-serif;
  font-weight:300;
  font-size:26px;
  letter-spacing:.2em;
  text-transform:uppercase;
  text-align:center;
  color:var(--onyx);
  margin-bottom:56px;
}
h2.section-title.cream{ color:var(--cream); }

/* Reveal-on-scroll: visible by default, JS only adds the hidden state it can also remove.
   This guarantees content is never trapped invisible if JS fails to run. */
.reveal{ transition:opacity .9s ease-out, transform .9s ease-out; }
.reveal.js-pre{ opacity:0; transform:translateY(24px); }
.reveal.js-in{ opacity:1; transform:translateY(0); }

/* NAV */
header.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(248,244,238,.92);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(224,216,207,.6);
  padding:22px 0;
}
.nav-row{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.brand{ display:flex; align-items:baseline; gap:12px; white-space:nowrap; }
.brand a{ display:flex; align-items:baseline; gap:12px; }
.brand .name{
  font-family:'Montserrat', Arial, sans-serif;
  font-size:11px; letter-spacing:.4em; text-transform:uppercase; font-weight:600;
}
.brand .place{
  font-family:'Montserrat', Arial, sans-serif;
  font-size:9px; letter-spacing:.3em; text-transform:uppercase; color:var(--burgundy); font-weight:500;
}
nav.links{ display:flex; gap:32px; align-items:center; font-size:10px; text-transform:uppercase; letter-spacing:.25em; font-weight:500; }
nav.links a.editorial{ position:relative; padding-bottom:4px; }
nav.links a.editorial::after{
  content:''; position:absolute; left:0; bottom:-2px; width:100%; height:1px;
  background:var(--burgundy); transform:scaleX(0); transform-origin:right;
  transition:transform .4s cubic-bezier(.86,0,.07,1);
}
nav.links a.editorial:hover::after{ transform:scaleX(1); transform-origin:left; }
nav.links a.editorial:hover{ color:var(--burgundy); }
.btn-enquire{ padding:12px 24px; border:1px solid var(--onyx); transition:all .4s; }
.btn-enquire:hover{ background:var(--onyx); color:var(--cream); }

.menu-btn{ display:none; background:none; border:0; padding:8px; }
.menu-btn svg{ width:24px; height:24px; }

#mobile-menu{
  position:fixed; inset:0; background:var(--cream); z-index:60;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  gap:32px; text-align:center;
  opacity:0; visibility:hidden;
  transition:opacity .35s ease, visibility .35s ease;
}
#mobile-menu.open{ opacity:1; visibility:visible; }
#mobile-menu a{ font-size:18px; text-transform:uppercase; letter-spacing:.2em; font-weight:500; }
#mobile-menu a.cta{ padding:14px 32px; border:1px solid var(--onyx); margin-top:8px; }
body.menu-open{ overflow:hidden; }

/* HERO */
.hero{ padding:96px 0; }
.hero-grid{ display:grid; grid-template-columns:1fr; gap:56px; align-items:center; }
.hero h1{
  font-family:'Montserrat', Arial, sans-serif;
  font-weight:400;
  font-size:38px; line-height:1.18; margin-bottom:32px;
}
.hero h1 em{ color:var(--burgundy); font-style:italic; font-weight:300; }
.hero-meta{
  display:flex; flex-wrap:wrap; gap:10px; font-size:10px; text-transform:uppercase;
  letter-spacing:.15em; color:var(--graphite); font-weight:600; border-left:1px solid var(--gold);
  padding-left:16px; margin-bottom:32px;
}
.hero p.lede{ font-size:17px; color:var(--graphite); font-weight:300; line-height:1.7; margin-bottom:40px; max-width:520px; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:24px; align-items:center; }
.btn-primary{
  display:inline-block; padding:16px 36px; border:1px solid var(--burgundy);
  font-size:10px; text-transform:uppercase; letter-spacing:.25em; color:var(--cream);
  background:var(--burgundy); transition:all .4s;
}
.btn-primary:hover{ background:transparent; color:var(--burgundy); }
.link-underline{
  font-size:10px; text-transform:uppercase; letter-spacing:.25em; font-weight:500;
  border-bottom:1px solid var(--stone); padding-bottom:4px; transition:border-color .3s, color .3s;
}
.link-underline:hover{ color:var(--burgundy); border-color:var(--burgundy); }

.hero-image{ aspect-ratio:4/5; background:rgba(224,216,207,.2); border:1px solid var(--stone); position:relative; overflow:hidden; }
.hero-image img{ width:100%; height:100%; object-fit:cover; filter:grayscale(25%); transition:filter 1s, transform 1s; }
.hero-image:hover img{ filter:grayscale(0%); transform:scale(1.04); }

/* ABOUT */
section.about{ background:#fff; padding:96px 0; border-top:1px solid rgba(224,216,207,.4); border-bottom:1px solid rgba(224,216,207,.4); }
.about-inner{ max-width:880px; margin:0 auto; }
.about-grid{ display:grid; grid-template-columns:1fr; gap:48px; align-items:start; }
.about-text{ color:var(--graphite); font-weight:300; line-height:1.85; font-size:15px; }
.about-text p{ margin-bottom:24px; }
.quote-card{ background:var(--linen); border:1px solid var(--stone); padding:36px; position:relative; }
.quote-mark{ position:absolute; top:8px; left:16px; font-size:60px; color:rgba(232,212,174,.5); font-family:Georgia,serif; }
.quote-card p{ font-family:'Montserrat', Arial, sans-serif; font-style:italic; font-size:15px; line-height:1.7; font-weight:300; position:relative; z-index:1; margin-top:16px; }
.quote-attr{ display:block; margin-top:28px; font-size:9px; text-transform:uppercase; letter-spacing:.3em; color:var(--burgundy); font-weight:600; }

/* EXPERTISE */
section.expertise{ padding:96px 0; }
.card-grid{ display:grid; grid-template-columns:1fr; gap:24px; }
.card{ background:#fff; padding:36px; border:1px solid var(--stone); transition:border-color .5s; }
.card:hover{ border-color:var(--burgundy); }
.card h3{ font-family:'Montserrat', Arial, sans-serif; font-size:12px; text-transform:uppercase; letter-spacing:.2em; font-weight:600; margin-bottom:16px; }
.card p{ color:var(--graphite); font-size:14px; font-weight:300; line-height:1.7; margin-bottom:20px; }
.card ul{ font-size:11px; color:var(--graphite); border-top:1px solid var(--stone); padding-top:16px; letter-spacing:.02em; }
.card ul li{ margin-bottom:8px; }

/* METHODOLOGY */
section.method{ padding:96px 0; background:var(--onyx); color:var(--cream); border-top:1px solid var(--onyx); border-bottom:1px solid var(--onyx); }
.method-grid{ display:grid; grid-template-columns:1fr; gap:48px; position:relative; }
.method-step{ text-align:center; position:relative; z-index:1; }
.method-circle{
  width:88px; height:88px; margin:0 auto 24px; border-radius:50%; border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center; font-family:'Montserrat', Arial, sans-serif;
  font-size:26px; color:var(--gold);
}
.method-step h4{ font-size:12px; text-transform:uppercase; letter-spacing:.2em; font-weight:600; margin-bottom:14px; }
.method-step p{ font-size:13px; color:var(--stone); font-weight:300; line-height:1.7; }

/* CASE STUDY */
section.work{ background:var(--linen); padding:96px 0; }
.work-grid{ display:grid; grid-template-columns:1fr; gap:40px; align-items:center; }
.work-shot{ border:1px solid var(--stone); padding:6px; background:var(--cream); }
.work-shot img{ filter:grayscale(8%); transition:filter .6s; }
.work-shot:hover img{ filter:grayscale(0%); }
.work-copy h3{ font-family:'Montserrat', Arial, sans-serif; font-size:30px; font-weight:300; margin-bottom:20px; }
.work-copy p{ color:var(--graphite); font-weight:300; line-height:1.7; margin-bottom:20px; font-size:15px; }
.work-link{ display:inline-flex; align-items:center; gap:10px; color:var(--burgundy); font-size:10px; text-transform:uppercase; letter-spacing:.25em; font-weight:600; }
.work-link .bar{ display:block; width:24px; height:1px; background:var(--burgundy); transition:width .3s; }
.work-link:hover .bar{ width:32px; }
.work-link:hover{ color:var(--onyx); }

/* GAINS */
section.gains{ background:#fff; padding:72px 0; border-top:1px solid rgba(224,216,207,.4); border-bottom:1px solid rgba(224,216,207,.4); }
.gains-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(224,216,207,.4);
  border:1px solid rgba(224,216,207,.4); text-align:center; font-size:11px; text-transform:uppercase;
  letter-spacing:.18em; font-weight:600;
}
.gains-grid li{ background:var(--cream); padding:28px 16px; min-height:88px; display:flex; align-items:center; justify-content:center; transition:background .4s; }
.gains-grid li:hover{ background:#fff; }

/* CREDENTIALS */
section.credentials{ padding:96px 0; }
.cred-inner{ max-width:700px; margin:0 auto; }
.timeline{ border-left:1px solid var(--gold); margin-left:16px; padding-left:0; }
.tl-item{ position:relative; padding:0 0 40px 32px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{ content:''; position:absolute; left:-5px; top:4px; width:10px; height:10px; background:var(--burgundy); }
.tl-tag{ display:block; font-size:10px; text-transform:uppercase; letter-spacing:.3em; color:var(--burgundy); font-weight:600; margin-bottom:6px; }
.tl-item h4{ font-size:13px; text-transform:uppercase; letter-spacing:.15em; font-weight:500; }
.tl-item p{ font-size:14px; color:var(--graphite); font-weight:300; margin-top:8px; line-height:1.7; }
.tl-item--badge{ display:flex; gap:20px; align-items:flex-start; }
.tl-item--badge .cim-badge{ width:88px; height:auto; flex-shrink:0; margin-top:2px; }
.tl-item--badge .tl-text{ flex:1; min-width:0; }
@media(max-width:479px){
  .tl-item--badge .cim-badge{ width:72px; }
}

/* FAQ */
section.faq{ padding:96px 0; border-top:1px solid rgba(224,216,207,.5); }
.faq-grid{ display:grid; grid-template-columns:1fr; gap:20px; }
.faq-card{ background:#fff; border:1px solid var(--stone); padding:28px; transition:border-color .5s; }
.faq-card:hover{ border-color:var(--burgundy); }
.faq-card h3{ font-size:12px; text-transform:uppercase; letter-spacing:.15em; font-weight:600; margin-bottom:14px; border-bottom:1px solid var(--stone); padding-bottom:12px; }
.faq-card p{ font-size:14px; color:var(--graphite); font-weight:300; line-height:1.7; }

/* CONTACT */
section.contact{ background:var(--onyx); color:var(--cream); padding:96px 0; }
.contact-inner{ max-width:760px; margin:0 auto; }
.contact-lede{ text-align:center; font-size:15px; color:var(--stone); font-weight:300; max-width:600px; margin:0 auto 56px; line-height:1.7; }
.form-box{ background:rgba(248,244,238,.05); border:1px solid var(--stone); padding:36px; }
.form-row{ display:grid; grid-template-columns:1fr; gap:28px; margin-bottom:28px; }
.field input, .field select, .field textarea{
  width:100%; background:transparent; border:0; border-bottom:1px solid var(--stone);
  padding:12px 0; color:var(--cream); font-size:13px;
}
.field input::placeholder, .field textarea::placeholder{ color:var(--stone); font-size:10px; text-transform:uppercase; letter-spacing:.15em; }
.field select{ color:var(--stone); font-size:10px; text-transform:uppercase; letter-spacing:.15em; appearance:none; cursor:pointer; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--gold); outline:none; }
.field option{ color:var(--onyx); }
.submit-btn{
  width:100%; border:1px solid var(--burgundy); padding:18px; font-weight:600; letter-spacing:.25em;
  text-transform:uppercase; font-size:10px; background:var(--burgundy); color:var(--cream);
  transition:all .5s; margin-bottom:20px;
}
.submit-btn:hover{ background:transparent; color:var(--burgundy); }
.form-note{ font-size:9px; color:var(--stone); text-transform:uppercase; letter-spacing:.15em; text-align:center; }

/* FOOTER */
footer{ background:var(--onyx); color:var(--stone); padding:64px 0 0; border-top:1px solid #000; }
.footer-grid{ display:grid; grid-template-columns:1fr; gap:40px; text-align:center; font-size:9px; text-transform:uppercase; letter-spacing:.2em; font-weight:500; }
.footer-grid p{ margin-bottom:10px; }
.footer-grid .brand-name{ color:var(--cream); font-weight:600; margin-bottom:18px; font-size:11px; }
.footer-grid a:hover{ color:var(--gold); }
.footer-links{ display:flex; flex-direction:column; gap:14px; align-items:center; }
.li-btn{ border:1px solid var(--stone); color:var(--stone); padding:12px 28px; transition:all .3s; }
.li-btn:hover{ border-color:var(--gold); color:var(--gold); }
.legal-links{ display:flex; flex-direction:column; gap:12px; }
.footer-newsletter{
  max-width:480px; margin:48px auto 0; padding-top:40px; border-top:1px solid rgba(224,216,207,.18);
  text-align:center;
}
.footer-newsletter-label{
  font-size:11px; color:var(--stone); text-transform:none; letter-spacing:.01em; font-weight:400;
  line-height:1.6; margin-bottom:18px; text-align:center;
}
.newsletter-form{ display:flex; gap:10px; }
.newsletter-form input{
  flex:1; background:rgba(248,244,238,.05); border:1px solid var(--stone); border-radius:2px;
  padding:13px 16px; color:var(--cream); font-size:13px; font-family:inherit;
}
.newsletter-form input::placeholder{ color:rgba(224,216,207,.55); }
.newsletter-form input:focus{ outline:none; border-color:var(--gold); }
.newsletter-form button{
  border:0; border-radius:2px; background:var(--gold); color:var(--onyx); padding:13px 22px;
  font-size:11px; text-transform:uppercase; letter-spacing:.1em; font-weight:600; cursor:pointer;
  transition:background .3s; white-space:nowrap;
}
.newsletter-form button:hover{ background:var(--cream); }
@media(max-width:479px){
  .newsletter-form{ flex-direction:column; }
}
.footer-bottom{
  max-width:var(--max); margin:48px auto 0; padding:28px 24px 64px; border-top:1px solid rgba(224,216,207,.18);
  display:flex; flex-direction:column; gap:14px; align-items:center; text-align:center;
  font-size:8px; text-transform:uppercase; letter-spacing:.18em;
}

/* COOKIE BANNER */
#cookie-banner{
  position:fixed; left:0; bottom:0; width:100%; background:var(--onyx); color:var(--cream);
  border-top:1px solid rgba(224,216,207,.25); padding:18px 24px; z-index:70;
  display:flex; flex-direction:column; gap:14px; align-items:center; text-align:center;
  transform:translateY(0); transition:transform .5s;
}
#cookie-banner p{ font-size:11px; font-weight:300; color:var(--stone); max-width:600px; }
#cookie-banner p a{ color:var(--gold); border-bottom:1px solid var(--gold); }
#cookie-banner p a:hover{ color:var(--cream); border-color:var(--cream); }
#cookie-banner button{
  border:0; padding:12px 28px; background:var(--burgundy); color:var(--cream); font-size:9px;
  text-transform:uppercase; letter-spacing:.25em; font-weight:600; flex-shrink:0;
}
#cookie-banner button:hover{ background:var(--cream); color:var(--onyx); }
#cookie-banner.is-hidden{ transform:translateY(100%); }

/* LEGAL / UTILITY PAGES */
.legal-header{ padding:28px 0; border-bottom:1px solid rgba(224,216,207,.6); }
.legal-back{ font-size:10px; text-transform:uppercase; letter-spacing:.2em; font-weight:600; color:var(--burgundy); }
.legal-main{ max-width:740px; margin:0 auto; padding:80px 24px 120px; }
.legal-main .eyebrow{ text-align:left; margin-bottom:12px; }
.legal-main h1{
  font-family:'Montserrat', Arial, sans-serif; font-weight:300; font-size:30px;
  letter-spacing:.05em; margin-bottom:8px; text-transform:uppercase;
}
.legal-main .updated{ font-size:11px; color:var(--graphite); text-transform:uppercase; letter-spacing:.15em; margin-bottom:48px; display:block; }
.legal-main h2{
  font-family:'Montserrat', Arial, sans-serif; font-weight:500; font-size:14px;
  text-transform:uppercase; letter-spacing:.1em; margin:40px 0 14px; color:var(--onyx);
}
.legal-main p{ color:var(--graphite); font-size:14.5px; line-height:1.85; font-weight:300; margin-bottom:16px; }
.legal-main p:first-of-type{ margin-top:0; }
.legal-main ul{ color:var(--graphite); font-size:14.5px; line-height:1.85; font-weight:300; margin-bottom:16px; padding-left:20px; }
.legal-main ul li{ list-style:disc; margin-bottom:8px; }
.legal-main a{ color:var(--burgundy); border-bottom:1px solid var(--stone); }
.legal-main a:hover{ border-color:var(--burgundy); }
.footer-legal-text{ max-width:560px; }
.footer-legal-text p{ margin-bottom:6px; }
.footer-legal-text p:last-child{ margin-bottom:0; }
.footer-legal-text a{ color:var(--stone); border-bottom:1px solid rgba(224,216,207,.4); }
.footer-legal-text a:hover{ color:var(--gold); border-color:var(--gold); }

/* RESPONSIVE */
@media(min-width:640px){
  .gains-grid{ grid-template-columns:repeat(3,1fr); }
  .method-grid{ grid-template-columns:repeat(2,1fr); }
}
@media(min-width:768px){
  .hero h1{ font-size:48px; }
  .hero{ padding:140px 0; }
  .hero-grid{ grid-template-columns:1fr 1fr; gap:80px; }
  .about-grid{ grid-template-columns:1fr 1fr; gap:64px; }
  section.about, section.expertise, section.work, section.credentials, section.faq, section.contact, section.method{ padding:140px 0; }
  .card-grid{ grid-template-columns:repeat(2,1fr); gap:32px; }
  .work-grid{ grid-template-columns:1fr 1fr; gap:80px; }
  .faq-grid{ grid-template-columns:repeat(2,1fr); gap:32px; }
  .form-row{ grid-template-columns:repeat(2,1fr); }
  .form-row.three{ grid-template-columns:repeat(3,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr 1fr; text-align:left; }
  .footer-grid > div:nth-child(2){ align-items:center; }
  .footer-grid > div:nth-child(3){ align-items:flex-end; text-align:right; }
  .footer-links, .legal-links{ align-items:inherit; }
  .footer-bottom{ flex-direction:row; justify-content:space-between; }
  #cookie-banner{ flex-direction:row; justify-content:space-between; text-align:left; }
  h2.section-title{ font-size:30px; }
  .legal-main{ padding:120px 24px 160px; }
}
@media(min-width:1024px){
  nav.links{ display:flex; }
  .menu-btn{ display:none; }
  .card-grid{ grid-template-columns:repeat(4,1fr); }
  .method-grid{ grid-template-columns:repeat(4,1fr); }
  .hero h1{ font-size:58px; }
}
@media(max-width:1023px){
  nav.links{ display:none; }
  .menu-btn{ display:block; }
}