/* =========================================================
   RESET
========================================================= */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%;}
html,body{height:100%;}
body{
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:1.6;
  color:var(--ink);
  background:var(--warm-white);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
ul{list-style:none;}
input,textarea,select{font:inherit;color:inherit;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.05;letter-spacing:-.01em;}
::selection{background:var(--accent);color:var(--white);}

/* Reduced motion baseline */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

/* Focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:2px;
}

/* Custom scrollbar — brand accent colour. Scoped to the document root only,
   so it never overrides the quote-modal's own neutral scrollbar styling
   (that targets .quote-modal specifically and stays untouched). */
html{scrollbar-width:thin;scrollbar-color:var(--accent) var(--off-white);}
html::-webkit-scrollbar{width:11px;height:11px;}
html::-webkit-scrollbar-track{background:var(--off-white);}
html::-webkit-scrollbar-thumb{background:var(--accent);border-radius:8px;border:3px solid var(--off-white);}
html::-webkit-scrollbar-thumb:hover{background:var(--accent-dark);}

/* Skip link */
.skip-link{
  position:fixed;top:-100px;left:1rem;z-index:9999;
  background:var(--navy-900);color:var(--white);
  padding:.85rem 1.5rem;border-radius:var(--radius-sm);
  transition:top .25s var(--ease-out);
  font-size:var(--fs-small);font-weight:600;letter-spacing:.04em;
}
.skip-link:focus{top:1rem;}

/* =========================================================
   LAYOUT HELPERS
========================================================= */
.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
section{position:relative;}
.section-pad{padding-block:var(--space-xl);}
.bg-navy{background:var(--navy-900);color:var(--white);}
.bg-charcoal{background:var(--charcoal);color:var(--white);}
.bg-white{background:var(--white);color:var(--ink);}
.bg-warm{background:var(--warm-white);color:var(--ink);}
.bg-grey{background:var(--grey-light);color:var(--ink);}
.on-dark .eyebrow,.bg-navy .eyebrow,.bg-charcoal .eyebrow{color:var(--accent-light);}
.on-dark{color:var(--white);}

/* Eyebrow / kicker */
.eyebrow{
  display:flex;align-items:center;gap:.75rem;
  font-size:var(--fs-micro);font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent-dark);margin-bottom:1.1rem;
}
.eyebrow::before{content:"";width:32px;height:1px;background:currentColor;opacity:.7;}
.eyebrow .num{font-variant-numeric:tabular-nums;opacity:.7;}

.section-head{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;
  gap:1.5rem;margin-bottom:var(--space-md);
}
.section-head h2{max-width:14ch;}
.section-head .section-sub{max-width:34ch;font-size:var(--fs-lead);opacity:.72;}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.9rem 1.75rem;
  font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  border-radius:3px;
  position:relative;overflow:hidden;
  transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  white-space:nowrap;
}
.btn svg,.btn .arrow{transition:transform var(--dur-fast) var(--ease-out);}
.btn:hover svg,.btn:hover .arrow{transform:translateX(5px);}
.btn-accent{background:var(--accent);color:var(--white);}
.btn-accent:hover{background:var(--accent-dark);box-shadow:var(--shadow-md);transform:translateY(-2px);}
.btn-outline-light{border:1px solid rgba(255,255,255,.45);color:var(--white);}
.btn-outline-light:hover{background:rgba(255,255,255,.12);border-color:var(--white);}
.btn-outline-dark{border:1px solid var(--line);color:var(--ink);}
.btn-outline-dark:hover{background:var(--navy-900);border-color:var(--navy-900);color:var(--white);}
.btn-ghost{color:var(--navy-900);font-weight:700;}
.btn-ghost .arrow{display:inline-block;}
.btn-sm{padding:.8rem 1.5rem;font-size:.78rem;}

/* Placeholder image system — used until real photography is supplied */
.ph-media{
  position:relative;overflow:hidden;background:var(--navy-800);
  isolation:isolate;
}
.ph-media img{width:100%;height:100%;object-fit:cover;}
.ph-media .ph-surface{
  position:absolute;inset:0;
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(11,132,214,.30), transparent 55%),
    linear-gradient(160deg, var(--navy-800) 0%, var(--navy-900) 55%, var(--charcoal) 100%);
}
.ph-media .ph-strokes{
  position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;
  background-image:
    repeating-linear-gradient(115deg, rgba(255,255,255,.08) 0 2px, transparent 2px 34px),
    repeating-linear-gradient(25deg, rgba(255,255,255,.05) 0 1px, transparent 1px 46px);
}
.ph-media .ph-grain{
  position:absolute;inset:0;opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
.ph-media .ph-tag{
  position:absolute;right:.9rem;bottom:.8rem;z-index:2;
  font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.55);
  background:rgba(14,38,66,.55);
  border:1px solid rgba(255,255,255,.18);
  padding:.35rem .6rem;border-radius:2px;
  backdrop-filter:blur(4px);
  pointer-events:none;
}
.ph-media.light .ph-surface{
  background:
    radial-gradient(120% 140% at 85% 90%, rgba(11,132,214,.14), transparent 55%),
    linear-gradient(160deg, var(--grey-light) 0%, #E7EAED 100%);
}
.ph-media.light .ph-tag{color:rgba(18,24,31,.55);background:rgba(255,255,255,.7);border-color:rgba(18,24,31,.1);}

/* Small caps label */
.label-caps{font-size:var(--fs-micro);font-weight:700;letter-spacing:.16em;text-transform:uppercase;}

/* Visually hidden */
.visually-hidden{
  position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* Scroll reveal base states (activated by JS/ScrollTrigger) */
[data-reveal]{opacity:0;}
.js-ready [data-reveal="fade-up"]{transform:translateY(40px);}
.js-ready [data-reveal="fade"]{transform:none;}
.js-ready [data-reveal="scale"]{transform:scale(1.06);}
.no-js [data-reveal],.reduced-motion [data-reveal]{opacity:1 !important;transform:none !important;}
