/* ============================================================
   VAO Care Services — Design tokens
   Navy:  #0B1D33 (ink)  #142B4A (mid)  #1D3A63 (lift)
   Gold:  #C79A45 (base) #E4BD70 (bright) #F4E6C8 (pale)
   Cream: #FAF6EF (bg)   #FFFFFF (card)
   Text:  #1B2333 (ink)  #566078 (muted)
   Type:  Fraunces (display) / Public Sans (body)
   ============================================================ */

:root{
  --navy: #0B1D33;
  --navy-mid: #142B4A;
  --navy-lift: #1D3A63;
  --gold: #C79A45;
  --gold-bright: #E4BD70;
  --gold-pale: #F4E6C8;
  --cream: #FAF6EF;
  --card: #FFFFFF;
  --ink: #1B2333;
  --muted: #5C6577;
  --line: #E7E0D3;
  --radius: 14px;
  --shadow: 0 20px 50px -25px rgba(11,29,51,0.35);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  margin:0;
  font-family:'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,.pull-quote,.commitment-quote{
  font-family:'Fraunces', Georgia, serif;
  line-height:1.08;
  margin:0 0 .5em;
  letter-spacing:-.01em;
  font-weight:600;
}
p{margin:0 0 1em; color:var(--muted); line-height:1.65;}
img{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}
.skip-link{position:absolute; left:-999px; top:0; background:var(--navy); color:#fff; padding:12px 18px; z-index:200; border-radius:0 0 8px 0;}
.skip-link:focus{left:0;}

::selection{background:var(--gold-pale); color:var(--navy);}

/* ---------- Status strip ---------- */
/* status strip removed */

/* ---------- Header ---------- */
.site-header{position:sticky; top:0; z-index:100; background:rgba(250,246,239,.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.header-inner{display:flex; align-items:center; justify-content:space-between; height:76px;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.brand img{display:block; aspect-ratio:1/1;}
.brand-word{font-family:'Fraunces', serif; font-size:1.08rem; color:var(--navy);}
.brand-word strong{color:var(--gold); letter-spacing:.02em;}

.primary-nav{display:flex; align-items:center; gap:30px;}
.primary-nav a{text-decoration:none; font-size:.93rem; font-weight:600; color:var(--navy); position:relative;}
.primary-nav a:not(.nav-cta)::after{content:""; position:absolute; left:0; bottom:-6px; width:0; height:2px; background:var(--gold); transition:width .25s var(--ease);}
.primary-nav a:not(.nav-cta):hover::after{width:100%;}
.nav-cta{background:var(--navy); color:#fff !important; padding:10px 20px; border-radius:999px; transition:background .2s;}
.nav-cta:hover{background:var(--navy-lift);}

.menu-toggle{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px;}
.menu-toggle span{width:22px; height:2px; background:var(--navy); display:block;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 28px; border-radius:999px; font-weight:700; font-size:.94rem; text-decoration:none; border:1px solid transparent; cursor:pointer; transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s;}
.btn-gold{background:var(--gold); color:var(--navy);}
.btn-gold:hover{background:var(--gold-bright); transform:translateY(-2px); box-shadow:0 14px 28px -14px rgba(199,154,69,.6);}
.btn-ghost{background:transparent; border-color:rgba(255,255,255,.35); color:inherit;}
.hero .btn-ghost{border-color:var(--navy); color:var(--navy);}
.hero .btn-ghost:hover{background:var(--navy); color:#fff;}
.btn-full{width:100%;}

/* ---------- Eyebrow / headings ---------- */
.eyebrow{font-family:'Public Sans',sans-serif; text-transform:uppercase; letter-spacing:.16em; font-size:.76rem; font-weight:700; color:var(--gold); margin:0 0 14px;}
.eyebrow--light{color:var(--gold-bright);}
h1{font-size:clamp(2.3rem, 4.6vw, 3.6rem); color:var(--navy);}
h1 em{font-style:normal; color:var(--gold);}
h2{font-size:clamp(1.7rem, 3vw, 2.4rem); color:var(--navy);}
.section-heading{max-width:720px; margin:0 auto 52px;}
.section-heading h2{margin-bottom:.4em;}
.section-sub{font-size:1.05rem;}

/* ---------- Sections ---------- */
.section{padding:92px 0;}
.section-light{background:var(--cream);}
.section-cream{background:#fff;}
.section-navy{background:var(--navy); color:#DCE3EE;}
.section-navy p{color:#B6C1D6;}

/* ---------- Hero ---------- */
.hero{padding:76px 0 100px; background:linear-gradient(180deg, var(--cream) 0%, #F1EAD9 100%); overflow:hidden; position:relative;}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center;}
.hero-lede{font-size:1.12rem; max-width:46ch;}
.hero-actions{display:flex; gap:16px; margin-top:8px; flex-wrap:wrap;}

.hero-photo{position:relative; justify-self:center; width:min(420px, 100%);}
.hero-photo img{border-radius:20px; box-shadow:var(--shadow); position:relative; z-index:2; width:100%; height:auto; aspect-ratio:900/1124; object-fit:contain;}
.ring{position:absolute; border-radius:50%; border:1.5px dashed var(--gold); pointer-events:none;}
.ring--outer{width:112%; height:112%; top:-6%; left:-6%; animation:spin 60s linear infinite;}
.ring--inner{width:96%; height:96%; top:2%; left:2%; border-style:solid; border-color:rgba(199,154,69,.25);}
@keyframes spin{to{transform:rotate(360deg);}}

/* ---------- Story ---------- */
.story-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:60px;}
.story-lead h2{font-size:clamp(1.6rem,2.6vw,2.1rem);}
.pull-quote{font-family:'Fraunces', serif; font-size:1.5rem; color:var(--navy); font-weight:500; margin:1.3em 0; padding-left:22px; border-left:3px solid var(--gold); font-style:italic;}

/* ---------- Feature photo (full-bleed) ---------- */
.feature-photo{position:relative; height:78vh; min-height:460px; max-height:760px; overflow:hidden;}
.feature-photo img{width:100%; height:100%; object-fit:cover; object-position:center 30%;}
.feature-photo__overlay{position:absolute; inset:0; display:flex; align-items:flex-end; background:linear-gradient(0deg, rgba(11,29,51,.92) 0%, rgba(11,29,51,.55) 40%, rgba(11,29,51,.05) 75%);}
.feature-photo__overlay .wrap{padding-bottom:64px;}
.feature-photo__overlay h2{color:#fff; max-width:18ch; font-size:clamp(1.8rem,3.4vw,2.6rem);}
.feature-photo__overlay p{color:#D7DEEA; max-width:52ch; font-size:1.05rem;}

/* ---------- Approach ---------- */
.approach-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.approach-card{background:var(--cream); border:1px solid var(--line); border-radius:var(--radius); padding:34px 28px; transition:transform .25s var(--ease), box-shadow .25s var(--ease);}
.approach-card:hover{transform:translateY(-6px); box-shadow:var(--shadow);}
.approach-icon{width:52px; height:52px; border-radius:50%; background:var(--navy); color:var(--gold-bright); display:flex; align-items:center; justify-content:center; margin-bottom:18px;}
.approach-icon svg{width:24px; height:24px;}
.approach-card h3{font-size:1.15rem; color:var(--navy); margin-bottom:.35em;}
.approach-card p{margin:0; font-size:.96rem;}

/* ---------- Name / emblem section ---------- */
.name-section{position:relative; overflow:hidden;}
.name-grid{display:grid; grid-template-columns:.55fr 1fr; gap:56px; align-items:center;}
.name-emblem{justify-self:center; position:relative; width:min(320px,80%);}
.name-emblem img{width:100%; height:auto; aspect-ratio:1/1; object-fit:contain; box-shadow:0 30px 70px -25px rgba(0,0,0,.6);}
.name-copy h2{color:#fff; font-size:clamp(1.9rem,3.2vw,2.6rem);}
.name-copy p{max-width:56ch;}

/* ---------- Services ---------- */
.services-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.service-tile{background:var(--cream); border:1px solid var(--line); border-radius:var(--radius); padding:26px 22px; transition:transform .25s var(--ease), border-color .25s;}
.service-tile:hover{transform:translateY(-5px); border-color:var(--gold);}
.service-icon{width:44px; height:44px; border-radius:12px; background:var(--gold-pale); color:var(--navy); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.service-icon svg{width:22px; height:22px;}
.service-tile h3{font-size:1rem; font-family:'Public Sans',sans-serif; font-weight:700; color:var(--navy); margin:0; line-height:1.35;}

/* ---------- Uniform guide ---------- */
.uniform-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.uniform-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; text-align:left; box-shadow:var(--shadow); transition:transform .25s var(--ease);}
.uniform-card:hover{transform:translateY(-5px);}
.uniform-swatch{display:block; width:44px; height:44px; border-radius:10px; margin-bottom:18px; border:1px solid var(--line); box-shadow:inset 0 0 0 3px rgba(255,255,255,.4);}
.uniform-swatch--white{background:#FFFFFF; border-color:#D9D2C3;}
.uniform-swatch--navy{background:var(--navy);}
.uniform-swatch--black{background:#15161A;}
.uniform-card h3{font-size:1.08rem; color:var(--navy); margin-bottom:.4em; font-family:'Public Sans',sans-serif; font-weight:700;}
.uniform-card p{margin:0; font-size:.95rem;}

/* ---------- Team gallery ---------- */
.team-gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:end;}
.team-photo{margin:0; border-radius:20px; overflow:hidden; box-shadow:var(--shadow);}
.team-photo img{width:100%; height:100%; object-fit:cover; aspect-ratio:2/3;}
.team-photo--tall{transform:translateY(-24px);}

/* ---------- Commitment ---------- */
.commitment-section{text-align:center; position:relative; overflow:hidden;}
.commitment-inner{max-width:760px; margin:0 auto; position:relative;}
.commitment-quote{font-size:clamp(1.5rem,2.8vw,2.1rem); color:#fff; font-weight:500;}
.commitment-tag{color:var(--gold-bright); font-weight:700; letter-spacing:.02em; margin:0;}
.ring--commitment{width:340px; height:340px; border:1px dashed rgba(228,189,112,.3); top:-90px; left:50%; transform:translateX(-50%); animation:spin 90s linear infinite;}

/* ---------- Contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
.contact-notice{background:var(--gold-pale); border:1px solid var(--gold); border-radius:var(--radius); padding:18px 20px; margin-top:20px;}
.contact-notice p{color:var(--navy); font-size:.92rem; margin:0;}

.contact-form{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:32px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:16px;}
.contact-form label{display:flex; flex-direction:column; gap:6px; font-size:.86rem; font-weight:600; color:var(--navy);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.contact-form input, .contact-form select, .contact-form textarea{
  font-family:inherit; font-size:.96rem; padding:12px 14px; border-radius:9px; border:1px solid var(--line); background:var(--cream); color:var(--ink); width:100%; max-width:100%; box-sizing:border-box;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{outline:2px solid var(--gold); outline-offset:1px; border-color:var(--gold);}
.form-privacy{font-size:.8rem; margin:0;}
.form-message{font-size:.88rem; font-weight:600; color:var(--navy); min-height:1.2em; margin:0;}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy); color:#B6C1D6; padding:56px 0 20px;}
.footer-grid{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.1);}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand img{display:block; aspect-ratio:1/1;}
.footer-brand strong{display:block; color:#fff; font-family:'Fraunces',serif;}
.footer-brand span{font-size:.8rem; color:var(--gold-bright);}
.footer-links{display:flex; gap:22px; flex-wrap:wrap;}
.footer-links a{text-decoration:none; font-size:.9rem; color:#B6C1D6;}
.footer-links a:hover{color:var(--gold-bright);}
.footer-status{font-size:.82rem; max-width:280px; margin:0; color:#8896AC;}
.footer-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:18px; font-size:.8rem; color:#8896AC;}
.footer-bottom p{margin:0;}
.footer-credit{color:#8896AC;}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal.is-visible{opacity:1; transform:none;}

/* ============ Responsive ============ */
@media (max-width:1000px){
  .hero-grid{grid-template-columns:1fr; text-align:left;}
  .hero-photo{order:-1; width:min(320px,70%); margin:0 auto;}
  .story-grid,.name-grid,.contact-grid{grid-template-columns:1fr;}
  .name-emblem{order:-1;}
  .approach-grid{grid-template-columns:1fr 1fr;}
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .team-gallery{grid-template-columns:repeat(3,1fr);}
  .team-photo--tall{transform:none;}
}
@media (max-width:720px){
  .wrap{padding:0 20px;}
  .primary-nav{position:fixed; inset:76px 0 0 0; background:var(--cream); flex-direction:column; align-items:flex-start; padding:28px; gap:22px; transform:translateX(100%); transition:transform .3s var(--ease); overflow-y:auto;}
  .primary-nav[data-open="true"]{transform:translateX(0);}
  .menu-toggle{display:flex;}
  .approach-grid{grid-template-columns:1fr;}
  .services-grid{grid-template-columns:1fr 1fr;}
  .uniform-grid{grid-template-columns:1fr;}
  .team-gallery{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .contact-form{padding:22px;}
  .feature-photo{height:64vh; min-height:420px;}
  .feature-photo__overlay .wrap{padding-bottom:36px;}
  .section{padding:64px 0;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1; transform:none; transition:none;}
  .ring--outer, .ring--commitment{animation:none;}
  .btn, .approach-card, .service-tile{transition:none;}
}