:root{
    --color-primary:#10161C;
    --color-primary-dark:#0D2740;
    --color-ink:#0A1E30;
    --color-accent:#B9873C;
    --color-accent-dark:#8C6428;
    --color-accent-light:#DAB876;
    --color-accent-soft:#F1E6D2;
    --color-accent-soft-text:#855F25;
    --color-bg:#F4EFE2;
    --color-surface:#FFFFFF;
    --color-muted:#69717C;
    --color-muted-2:#454C55;
    --color-border:#E4DCC9;
    --color-on-dark:#F4EFE2;
    --color-on-dark-muted:#B9C3CC;
    --font-heading:'Lexend', system-ui, sans-serif;
    --font-body:'Source Sans 3', system-ui, sans-serif;
    --space-1:8px;
    --space-2:16px;
    --space-3:24px;
    --space-4:32px;
    --space-5:48px;
    --space-6:64px;
    --space-7:96px;
    --radius-sm:8px;
    --radius-md:14px;
    --radius-lg:20px;
    --shadow-sm:0 1px 2px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.08);
    --shadow-md:0 8px 24px -8px rgba(15,23,42,.18);
    --shadow-lg:0 24px 48px -16px rgba(15,23,42,.28);
    --ease:cubic-bezier(.22,1,.36,1);
  }

  *,*::before,*::after{ box-sizing:border-box; }
  html{ -webkit-text-size-adjust:100%; }
  @media (prefers-reduced-motion: no-preference){
    html{ scroll-behavior:smooth; }
  }
  body{
    margin:0;
    font-family:var(--font-body);
    background:var(--color-bg);
    color:var(--color-primary);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  img,svg{ display:block; max-width:100%; }
  a{ color:inherit; }
  h1,h2,h3,h4{
    font-family:var(--font-heading);
    color:var(--color-ink);
    line-height:1.15;
    margin:0;
    font-weight:700;
  }
  p{ margin:0; }
  ul{ margin:0; padding:0; list-style:none; }
  button{ font:inherit; }

  .icon{
    width:24px;
    height:24px;
    flex-shrink:0;
    fill:none;
    stroke:currentColor;
    stroke-width:1.75;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

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

  .skip-link{
    position:absolute;
    left:var(--space-2);
    top:-100px;
    background:var(--color-ink);
    color:#fff;
    padding:12px 20px;
    border-radius:var(--radius-sm);
    z-index:1000;
    transition:top .2s var(--ease);
    font-weight:600;
  }
  .skip-link:focus{ top:var(--space-2); }

  .container{
    width:100%;
    max-width:1200px;
    margin-inline:auto;
    padding-inline:var(--space-2);
  }
  @media (min-width:768px){
    .container{ padding-inline:var(--space-4); }
  }

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-family:var(--font-heading);
    font-size:13px;
    font-weight:600;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--color-accent-dark);
  }
  .eyebrow::before{
    content:"";
    width:22px;
    height:2px;
    background:var(--color-accent);
    border-radius:2px;
  }

  .section{ padding-block:var(--space-6); }
  @media (min-width:1024px){ .section{ padding-block:var(--space-7); } }
  .section-head{
    max-width:640px;
    margin-bottom:var(--space-4);
  }
  @media (min-width:1024px){ .section-head{ margin-bottom:var(--space-5); } }
  .section-head h2{ font-size:clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); margin-top:12px; }
  .section-head p{ margin-top:14px; color:var(--color-muted-2); font-size:1.05rem; }
  .section--muted{ background:var(--color-surface); border-block:1px solid var(--color-border); }

  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 26px;
    border-radius:999px;
    font-family:var(--font-heading);
    font-weight:600;
    font-size:15px;
    text-decoration:none;
    border:1.5px solid transparent;
    cursor:pointer;
    min-height:48px;
    transition:transform .18s var(--ease), background-color .18s var(--ease), box-shadow .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
  }
  .btn:hover{ transform:translateY(-2px); }
  .btn:active{ transform:translateY(0); }
  .btn-accent{ background:var(--color-accent); color:var(--color-ink); box-shadow:var(--shadow-sm); }
  .btn-accent:hover{ background:var(--color-accent-light); box-shadow:var(--shadow-md); }
  .btn-ghost-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.35); }
  .btn-ghost-light:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.6); }
  .btn-outline{ background:transparent; color:var(--color-ink); border-color:var(--color-border); }
  .btn-outline:hover{ background:var(--color-bg); border-color:var(--color-muted); }
  .btn-block{ width:100%; }

  /* ---------- HEADER ---------- */
  .site-header{
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(248,250,252,.86);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid transparent;
    transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
  }
  .site-header.is-scrolled{ border-color:var(--color-border); box-shadow:var(--shadow-sm); }
  .nav-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--space-3);
    padding-block:16px;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    font-family:var(--font-heading);
    font-weight:700;
    color:var(--color-ink);
    font-size:16px;
    letter-spacing:.01em;
  }
  .brand-mark{
    width:38px;
    height:38px;
    border-radius:50%;
    background:var(--color-ink);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    overflow:hidden;
  }
  .brand-mark img{ width:100%; height:100%; object-fit:cover; display:block; }
  .brand-text{ display:flex; flex-direction:column; line-height:1.15; }
  .brand-text small{ font-family:var(--font-body); font-weight:600; font-size:11px; letter-spacing:.06em; color:var(--color-muted); text-transform:uppercase; }

  .nav-links{
    display:none;
    align-items:center;
    gap:var(--space-4);
    font-family:var(--font-heading);
    font-weight:500;
    font-size:15px;
  }
  .nav-links a{
    text-decoration:none;
    color:var(--color-primary);
    padding:8px 2px;
    position:relative;
  }
  .nav-links a::after{
    content:"";
    position:absolute;
    left:0; right:0; bottom:0;
    height:2px;
    background:var(--color-accent);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .2s var(--ease);
  }
  .nav-links a:hover::after{ transform:scaleX(1); }

  .nav-actions{ display:flex; align-items:center; gap:var(--space-2); }
  .nav-cta{ display:none; }

  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border-radius:10px;
    border:1.5px solid var(--color-border);
    background:var(--color-surface);
    color:var(--color-ink);
    cursor:pointer;
  }
  .menu-toggle .icon-close{ display:none; }
  .menu-toggle[aria-expanded="true"] .icon-menu{ display:none; }
  .menu-toggle[aria-expanded="true"] .icon-close{ display:block; }

  .mobile-menu{
    display:grid;
    grid-template-rows:0fr;
    transition:grid-template-rows .25s var(--ease);
    border-top:1px solid transparent;
  }
  .mobile-menu.is-open{ grid-template-rows:1fr; border-color:var(--color-border); }
  .mobile-menu-inner{ overflow:hidden; }
  .mobile-menu ul{ display:flex; flex-direction:column; padding-block:var(--space-2); gap:2px; }
  .mobile-menu a{
    display:block;
    padding:12px 4px;
    text-decoration:none;
    color:var(--color-primary);
    font-family:var(--font-heading);
    font-weight:500;
    font-size:16px;
    border-radius:8px;
  }
  .mobile-menu a:hover{ background:var(--color-bg); }
  .mobile-menu .btn{ margin-top:8px; }

  @media (min-width:1024px){
    .nav-links{ display:flex; }
    .nav-cta{ display:inline-flex; }
    .menu-toggle{ display:none; }
    .mobile-menu{ display:none; }
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    overflow:hidden;
    background:
      linear-gradient(180deg, rgba(248,250,252,0) 55%, var(--color-bg) 100%),
      repeating-linear-gradient(0deg, rgba(51,65,85,.06) 0 1px, transparent 1px 56px),
      repeating-linear-gradient(90deg, rgba(51,65,85,.06) 0 1px, transparent 1px 56px),
      var(--color-bg);
  }
  .hero-inner{
    padding-block:var(--space-6) var(--space-5);
    display:grid;
    gap:var(--space-5);
  }
  @media (min-width:1024px){
    .hero-inner{
      padding-block:var(--space-7) var(--space-6);
      grid-template-columns:1.05fr .95fr;
      align-items:center;
      gap:var(--space-5);
    }
  }
  .hero-copy h1{
    font-size:clamp(2.2rem, 1.6rem + 2.8vw, 3.6rem);
    margin-top:16px;
    letter-spacing:-.01em;
  }
  .hero-copy h1 em{ color:var(--color-accent); font-style:normal; }
  .hero-copy p.lede{
    margin-top:20px;
    font-size:1.15rem;
    color:var(--color-muted-2);
    max-width:52ch;
  }
  .hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:var(--space-4);
  }
  .hero-tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:var(--space-4);
  }
  .hero-tags span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--color-surface);
    border:1px solid var(--color-border);
    padding:8px 14px;
    border-radius:999px;
    font-size:13.5px;
    font-weight:600;
    color:var(--color-muted-2);
  }
  .hero-tags .icon{ width:16px; height:16px; color:var(--color-accent); }

  .hero-art{ position:relative; }
  .hero-art-card{
    background:var(--color-ink);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
    box-shadow:var(--shadow-lg);
    position:relative;
    overflow:hidden;
  }
  .hero-art-card::before{
    content:"";
    position:absolute; inset:0;
    background-image:repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 22px), repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 22px);
  }
  .hero-art-card svg{ position:relative; width:100%; height:auto; }
  .hero-stat-float{
    position:absolute;
    left:-14px; bottom:-18px;
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-md);
    padding:14px 18px;
    box-shadow:var(--shadow-md);
    display:flex;
    align-items:center;
    gap:12px;
  }
  @media (max-width:420px){ .hero-stat-float{ left:8px; } }
  .hero-stat-float .icon{ color:var(--color-accent); width:26px; height:26px; }
  .hero-stat-float strong{ display:block; font-family:var(--font-heading); font-size:18px; color:var(--color-ink); }
  .hero-stat-float span{ font-size:12.5px; color:var(--color-muted); }

  /* ---------- STAT BAR ---------- */
  .stat-bar{
    background:var(--color-ink);
    color:#fff;
  }
  .stat-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:var(--space-4);
    padding-block:var(--space-4);
  }
  @media (min-width:768px){ .stat-grid{ grid-template-columns:repeat(4,1fr); } }
  .stat-item strong{
    display:block;
    font-family:var(--font-heading);
    font-size:clamp(1.5rem, 1.2rem + 1vw, 2rem);
    color:#fff;
  }
  .stat-item span{ font-size:13.5px; color:var(--color-on-dark-muted); }

  /* ---------- ABOUT / PRINCIPLES ---------- */
  .about-grid{
    display:grid;
    gap:var(--space-4);
  }
  @media (min-width:900px){ .about-grid{ grid-template-columns:1fr 1fr; gap:var(--space-5); } }
  .mv-card{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
  }
  .mv-card h3{ font-size:1.1rem; display:flex; align-items:center; gap:10px; }
  .mv-card h3 .icon{ color:var(--color-accent); }
  .mv-card p{ margin-top:12px; color:var(--color-muted-2); }
  .mv-card + .mv-card{ margin-top:var(--space-3); }

  .mv-grid{
    display:grid;
    gap:var(--space-3);
    margin-bottom:var(--space-5);
  }
  @media (min-width:640px){ .mv-grid{ grid-template-columns:1fr 1fr; } }
  .mv-grid .mv-card{ margin-top:0; }

  .principles{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:var(--space-2);
  }
  @media (min-width:560px){ .principles{ grid-template-columns:repeat(3,1fr); } }
  @media (min-width:1024px){ .principles{ grid-template-columns:repeat(5,1fr); } }
  .principle-card{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-md);
    padding:var(--space-3);
  }
  .principle-card .icon-badge{
    width:40px; height:40px;
    border-radius:10px;
    background:var(--color-accent-soft);
    color:var(--color-accent-soft-text);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:12px;
  }
  .principle-card h3{ font-size:15.5px; }
  .principle-card p{ margin-top:6px; font-size:13.5px; color:var(--color-muted); line-height:1.5; }

  /* ---------- PHILOSOPHY ---------- */
  .philosophy{
    background:var(--color-primary-dark);
    color:var(--color-on-dark);
  }
  .philosophy .eyebrow{ color:var(--color-accent-light); }
  .philosophy .eyebrow::before{ background:var(--color-accent-light); }
  .philosophy .section-head h2{ color:#fff; }
  .philosophy .section-head p{ color:var(--color-on-dark-muted); }
  .philosophy-quote{
    font-family:var(--font-heading);
    font-size:clamp(1.15rem, 1rem + .8vw, 1.5rem);
    color:#fff;
    max-width:60ch;
    padding-left:var(--space-3);
    border-left:3px solid var(--color-accent-light);
    margin-bottom:var(--space-5);
  }
  .pillars{
    display:grid;
    gap:var(--space-3);
    counter-reset:pillar;
  }
  @media (min-width:768px){ .pillars{ grid-template-columns:repeat(3,1fr); gap:var(--space-4); } }
  .pillar{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.12);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
    position:relative;
  }
  .pillar-order{
    font-family:var(--font-heading);
    font-weight:700;
    font-size:13px;
    letter-spacing:.08em;
    color:var(--color-accent-light);
    text-transform:uppercase;
  }
  .pillar .icon-badge{
    width:44px; height:44px;
    border-radius:12px;
    background:rgba(185,135,60,.18);
    color:var(--color-accent-light);
    display:flex; align-items:center; justify-content:center;
    margin:14px 0 16px;
  }
  .pillar h3{ color:#fff; font-size:1.15rem; }
  .pillar p{ margin-top:10px; color:var(--color-on-dark-muted); font-size:14.5px; }

  /* ---------- SERVICES ---------- */
  .services-grid{
    display:grid;
    gap:var(--space-3);
  }
  @media (min-width:640px){ .services-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (min-width:1024px){ .services-grid{ grid-template-columns:repeat(3,1fr); } }
  .service-card{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
    display:flex;
    flex-direction:column;
    transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
  }
  .service-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:#F3C6A5; }
  .service-card .icon-badge{
    width:48px; height:48px;
    border-radius:12px;
    background:var(--color-ink);
    color:var(--color-accent);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:var(--space-3);
  }
  .service-card .num{
    font-family:var(--font-heading);
    font-size:12px;
    font-weight:700;
    color:var(--color-muted);
    letter-spacing:.08em;
  }
  .service-card h3{ font-size:1.15rem; margin-top:6px; }
  .service-card p.desc{ margin-top:10px; color:var(--color-muted-2); font-size:14.5px; }
  .service-card ul{ margin-top:var(--space-2); display:flex; flex-direction:column; gap:8px; flex-grow:1; }
  .service-card li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    font-size:13.5px;
    color:var(--color-primary);
  }
  .service-card li .icon{ width:16px; height:16px; color:var(--color-accent); margin-top:3px; flex-shrink:0; }
  .service-note{
    margin-top:var(--space-4);
    background:var(--color-surface);
    border:1px dashed var(--color-border);
    border-radius:var(--radius-md);
    padding:var(--space-3);
    display:flex;
    gap:14px;
    align-items:flex-start;
    color:var(--color-muted-2);
    font-size:14.5px;
  }
  .service-note .icon{ color:var(--color-accent); margin-top:2px; }

  /* ---------- PROCESS ---------- */
  .process-steps{
    display:grid;
    gap:var(--space-3);
    counter-reset:step;
  }
  @media (min-width:768px){ .process-steps{ grid-template-columns:repeat(3,1fr); gap:var(--space-4); } }
  .process-step{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
    position:relative;
  }
  .process-step .step-index{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px; height:34px;
    border-radius:999px;
    background:var(--color-accent);
    color:var(--color-ink);
    font-family:var(--font-heading);
    font-weight:700;
    font-size:14px;
  }
  .process-step h3{ margin-top:var(--space-3); font-size:1.05rem; }
  .process-step p{ margin-top:8px; color:var(--color-muted-2); font-size:14.5px; }

  .process-panels{
    display:grid;
    gap:var(--space-3);
    margin-top:var(--space-4);
  }
  @media (min-width:768px){ .process-panels{ grid-template-columns:1fr 1fr; } }
  .process-panel{
    background:var(--color-ink);
    color:#fff;
    border-radius:var(--radius-lg);
    padding:var(--space-4);
  }
  .process-panel h4{ color:#fff; font-size:1.05rem; display:flex; align-items:center; gap:10px; }
  .process-panel h4 .icon{ color:var(--color-accent-light); }
  .process-panel ul{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
  .process-panel li{ display:flex; gap:10px; font-size:14px; color:var(--color-on-dark-muted); align-items:flex-start; }
  .process-panel li .icon{ width:16px; height:16px; color:var(--color-accent-light); margin-top:3px; flex-shrink:0; }

  /* ---------- QHSE ---------- */
  .qhse-grid{ display:grid; gap:var(--space-3); }
  @media (min-width:768px){ .qhse-grid{ grid-template-columns:repeat(3,1fr); } }
  .qhse-card{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-top:3px solid var(--color-accent);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
  }
  .qhse-card .icon-badge{
    width:44px; height:44px; border-radius:12px;
    background:var(--color-accent-soft); color:var(--color-accent-soft-text);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:14px;
  }
  .qhse-card h3{ font-size:1.05rem; }
  .qhse-card ul{ margin-top:12px; display:flex; flex-direction:column; gap:9px; }
  .qhse-card li{ display:flex; gap:9px; font-size:13.5px; color:var(--color-muted-2); align-items:flex-start; }
  .qhse-card li .icon{ width:15px; height:15px; color:var(--color-accent); margin-top:3px; flex-shrink:0; }

  /* ---------- LEADERSHIP ---------- */
  .leader-grid{
    display:grid;
    gap:var(--space-4);
    align-items:start;
  }
  @media (min-width:900px){ .leader-grid{ grid-template-columns:.8fr 1.2fr; gap:var(--space-5); } }
  .leader-photo{
    aspect-ratio:4/5;
    border-radius:var(--radius-lg);
    background:linear-gradient(160deg, var(--color-ink), var(--color-primary-dark));
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--color-accent);
    position:relative;
    overflow:hidden;
  }
  .leader-photo::before{
    content:"";
    position:absolute; inset:0;
    background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.04) 0 2px, transparent 2px 18px);
    z-index:1;
    pointer-events:none;
  }
  .leader-photo img{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
    object-position:top center;
  }
  .leader-photo .photo-caption{
    position:absolute; left:0; right:0; bottom:0;
    z-index:2;
    padding:20px;
    background:linear-gradient(0deg, rgba(10,30,48,.85), transparent);
  }
  .leader-photo .photo-caption strong{
    display:block;
    font-family:var(--font-heading);
    color:#fff;
    font-size:15px;
    letter-spacing:.02em;
  }
  .leader-photo .photo-caption span{
    font-size:12.5px;
    color:var(--color-on-dark-muted);
  }
  .leader-photo .initials{
    font-family:var(--font-heading);
    font-weight:800;
    font-size:clamp(3rem,2.4rem + 2vw,4.5rem);
    color:#fff;
    letter-spacing:.02em;
    position:relative;
  }
  .leader-photo .initials small{
    display:block;
    font-family:var(--font-body);
    font-weight:600;
    font-size:14px;
    color:var(--color-on-dark-muted);
    letter-spacing:.04em;
    text-transform:uppercase;
    margin-top:8px;
  }
  .leader-copy h3{ font-size:1.5rem; }
  .leader-copy .role{ margin-top:6px; color:var(--color-accent-dark); font-weight:600; font-family:var(--font-heading); font-size:14.5px; }
  .leader-copy p.bio{ margin-top:14px; color:var(--color-muted-2); }
  .leader-list{ margin-top:var(--space-3); display:flex; flex-direction:column; gap:10px; }
  .leader-list li{ display:flex; gap:10px; font-size:14.5px; color:var(--color-primary); align-items:flex-start; }
  .leader-list li .icon{ width:17px; height:17px; color:var(--color-accent); margin-top:3px; flex-shrink:0; }
  .leader-stats{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
    margin-top:var(--space-4);
  }
  @media (min-width:560px){ .leader-stats{ grid-template-columns:repeat(4,1fr); } }
  .leader-stats .stat{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-md);
    padding:14px;
    text-align:center;
  }
  .leader-stats .stat strong{ display:block; font-family:var(--font-heading); font-size:1.15rem; color:var(--color-ink); }
  .leader-stats .stat span{ font-size:12px; color:var(--color-muted); }

  /* ---------- PORTFOLIO ---------- */
  .portfolio-grid{
    display:grid;
    gap:var(--space-3);
  }
  @media (min-width:640px){ .portfolio-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (min-width:1024px){ .portfolio-grid{ grid-template-columns:repeat(3,1fr); } }
  .portfolio-card{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-lg);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    transition:box-shadow .2s var(--ease), transform .2s var(--ease);
  }
  .portfolio-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-4px); }
  .portfolio-media{
    aspect-ratio:16/10;
    background:
      repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 2px, transparent 2px 14px),
      linear-gradient(135deg, var(--color-primary-dark), var(--color-ink));
    display:flex;
    align-items:center;
    justify-content:center;
    color:rgba(218,184,118,.85);
    overflow:hidden;
  }
  .portfolio-media .icon{ width:34px; height:34px; }
  .portfolio-media img{ width:100%; height:100%; object-fit:cover; display:block; }
  .portfolio-body{ padding:var(--space-3); display:flex; flex-direction:column; flex-grow:1; }
  .portfolio-tag{
    display:inline-flex;
    align-self:flex-start;
    font-size:11.5px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--color-accent-soft-text);
    background:var(--color-accent-soft);
    padding:5px 10px;
    border-radius:999px;
  }
  .portfolio-body h3{ font-size:1.05rem; margin-top:10px; }
  .portfolio-body .loc{ font-size:12.5px; color:var(--color-muted); margin-top:4px; }
  .portfolio-body p.desc{ margin-top:10px; color:var(--color-muted-2); font-size:13.5px; flex-grow:1; }
  .portfolio-link{
    display:flex;
    flex-direction:column;
    height:100%;
    color:inherit;
    text-decoration:none;
  }
  .portfolio-more{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-top:14px;
    font-family:var(--font-heading);
    font-weight:600;
    font-size:13px;
    color:var(--color-accent-dark);
  }
  .portfolio-more .icon{ width:15px; height:15px; transition:transform .18s var(--ease); }
  .portfolio-link:hover .portfolio-more .icon{ transform:translateX(3px); }

  /* ---------- CAROUSEL ---------- */
  .carousel{ position:relative; }
  .carousel-track{
    display:flex;
    gap:var(--space-3);
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    padding-bottom:4px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .carousel-track::-webkit-scrollbar{ display:none; }
  @media (prefers-reduced-motion: no-preference){
    .carousel-track{ scroll-behavior:smooth; }
  }
  .carousel-item{
    scroll-snap-align:start;
    flex:0 0 82%;
  }
  @media (min-width:640px){ .carousel-item{ flex:0 0 calc(50% - var(--space-3) / 2); } }
  @media (min-width:1024px){ .carousel-item{ flex:0 0 calc(33.333% - var(--space-3) * 2 / 3); } }
  .carousel-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:var(--space-3);
    margin-top:var(--space-4);
  }
  .carousel-btn{
    width:44px; height:44px;
    border-radius:50%;
    border:1.5px solid var(--color-border);
    background:var(--color-surface);
    color:var(--color-ink);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer;
    flex-shrink:0;
    transition:border-color .18s var(--ease), background-color .18s var(--ease);
  }
  .carousel-btn:hover{ border-color:var(--color-accent); background:var(--color-accent-soft); }
  .carousel-btn .icon{ width:18px; height:18px; }
  .carousel-dots{ display:flex; align-items:center; }
  .carousel-dots button{
    width:24px; height:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    border:none;
    padding:0;
    background:transparent;
    cursor:pointer;
  }
  .carousel-dots button::before{
    content:"";
    width:9px; height:9px;
    border-radius:50%;
    background:var(--color-border);
    transition:background-color .18s var(--ease), transform .18s var(--ease);
  }
  .carousel-dots button[aria-selected="true"]::before{ background:var(--color-accent); transform:scale(1.25); }
  .carousel-cta{ display:flex; justify-content:center; margin-top:var(--space-5); }

  /* ---------- CTA / CONTACT ---------- */
  .cta-section{
    background:var(--color-ink);
    color:#fff;
    position:relative;
    overflow:hidden;
  }
  .cta-section::before{
    content:"";
    position:absolute; inset:0;
    background-image:repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 48px), repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 48px);
  }
  .cta-inner{ position:relative; }
  .cta-head{ max-width:620px; }
  .cta-head .eyebrow{ color:var(--color-accent-light); }
  .cta-head .eyebrow::before{ background:var(--color-accent-light); }
  .cta-head h2{ color:#fff; font-size:clamp(1.7rem,1.3rem+1.6vw,2.5rem); margin-top:14px; }
  .cta-head p{ margin-top:14px; color:var(--color-on-dark-muted); font-size:1.05rem; }
  .cta-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:var(--space-4); }

  .contact-grid{
    display:grid;
    gap:var(--space-2);
    margin-top:var(--space-6);
  }
  @media (min-width:768px){ .contact-grid{ grid-template-columns:repeat(4,1fr); } }
  .contact-card{
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.14);
    border-radius:var(--radius-md);
    padding:var(--space-3);
    text-decoration:none;
    color:#fff;
    display:flex;
    flex-direction:column;
    gap:12px;
    transition:background-color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
  }
  .contact-card:hover{ background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.28); transform:translateY(-3px); }
  .contact-card .icon-badge{
    width:40px; height:40px; border-radius:10px;
    background:rgba(218,184,118,.18);
    color:var(--color-accent-light);
    display:flex; align-items:center; justify-content:center;
  }
  .contact-card strong{ font-family:var(--font-heading); font-size:14.5px; }
  .contact-card span{ font-size:13px; color:var(--color-on-dark-muted); word-break:break-word; }

  /* ---------- FOOTER ---------- */
  .site-footer{ background:var(--color-primary-dark); color:var(--color-on-dark-muted); padding-block:var(--space-4); }
  .footer-inner{
    display:flex;
    flex-direction:column;
    gap:var(--space-2);
    font-size:13.5px;
  }
  @media (min-width:768px){
    .footer-inner{ flex-direction:row; align-items:center; justify-content:space-between; }
  }
  .footer-brand{ display:flex; align-items:center; gap:10px; color:#fff; font-family:var(--font-heading); font-weight:600; }
  .footer-meta{ display:flex; flex-wrap:wrap; gap:6px 16px; }
  .footer-meta span{ white-space:nowrap; }

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

  @media (prefers-reduced-motion: reduce){
    *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
  }

  /* ---------- PROJECTS LIST PAGE ---------- */
  .page-hero{
    background:var(--color-ink);
    color:#fff;
    padding-block:calc(var(--space-6) + 48px) var(--space-5);
    position:relative;
    overflow:hidden;
  }
  .page-hero::before{
    content:"";
    position:absolute; inset:0;
    background-image:repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 48px), repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 48px);
  }
  .page-hero .container{ position:relative; }
  .page-hero .eyebrow{ color:var(--color-accent-light); }
  .page-hero .eyebrow::before{ background:var(--color-accent-light); }
  .page-hero h1{ color:#fff; font-size:clamp(2rem, 1.6rem + 1.6vw, 3rem); margin-top:14px; max-width:26ch; }
  .page-hero p{ margin-top:16px; color:var(--color-on-dark-muted); font-size:1.05rem; max-width:60ch; }

  .breadcrumb{
    display:flex; align-items:center; gap:8px;
    font-family:var(--font-heading); font-weight:600; font-size:13.5px;
    text-decoration:none;
    color:var(--color-on-dark-muted);
    margin-bottom:var(--space-3);
  }
  .breadcrumb:hover{ color:var(--color-accent-light); }
  .breadcrumb .icon{ width:15px; height:15px; }
  .breadcrumb--light{ color:var(--color-muted-2); }
  .breadcrumb--light:hover{ color:var(--color-accent-dark); }

  .project-list{ display:flex; flex-direction:column; }
  .project-row{
    display:grid;
    grid-template-columns:1fr;
    gap:var(--space-3);
    padding-block:var(--space-4);
    border-bottom:1px solid var(--color-border);
    text-decoration:none;
    color:inherit;
  }
  .project-row:first-child{ border-top:1px solid var(--color-border); }
  @media (min-width:768px){
    .project-row{ grid-template-columns:280px 1fr; align-items:center; gap:var(--space-4); }
  }
  .project-row-media{
    aspect-ratio:4/3;
    border-radius:var(--radius-md);
    overflow:hidden;
    background:linear-gradient(135deg, var(--color-primary-dark), var(--color-ink));
  }
  .project-row-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s var(--ease); }
  .project-row:hover .project-row-media img{ transform:scale(1.04); }
  .project-row-body h3{ font-size:1.3rem; }
  .project-row-body .loc{ font-size:13px; color:var(--color-muted); margin-top:4px; }
  .project-row-body p.desc{ margin-top:10px; color:var(--color-muted-2); font-size:14.5px; max-width:65ch; }
  .project-row-foot{ display:flex; align-items:center; gap:14px; margin-top:14px; flex-wrap:wrap; }
  .project-row-more{
    display:inline-flex; align-items:center; gap:6px;
    font-family:var(--font-heading); font-weight:600; font-size:13.5px;
    color:var(--color-accent-dark);
  }
  .project-row-more .icon{ width:15px; height:15px; transition:transform .18s var(--ease); }
  .project-row:hover .project-row-more .icon{ transform:translateX(3px); }

  /* ---------- GALLERY PAGE ---------- */
  .gallery-intro{ display:grid; gap:var(--space-4); }
  @media (min-width:900px){ .gallery-intro{ grid-template-columns:1.3fr .7fr; gap:var(--space-5); } }
  .gallery-intro p{ margin-top:14px; color:var(--color-muted-2); font-size:1.02rem; }
  .gallery-info-card{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-lg);
    padding:var(--space-4);
    align-self:start;
  }
  .gallery-info-card .row{
    display:flex; justify-content:space-between; gap:12px;
    padding-block:10px;
    border-bottom:1px dashed var(--color-border);
    font-size:13.5px;
  }
  .gallery-info-card .row:last-child{ border-bottom:none; }
  .gallery-info-card .row span:first-child{ color:var(--color-muted); }
  .gallery-info-card .row span:last-child{ font-weight:600; color:var(--color-ink); text-align:right; }

  .gallery-featured{
    margin-top:var(--space-5);
    border-radius:var(--radius-lg);
    overflow:hidden;
    aspect-ratio:16/9;
  }
  .gallery-featured img{ width:100%; height:100%; object-fit:cover; display:block; }

  .gallery-section-head{ margin-top:var(--space-6); margin-bottom:var(--space-3); display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-2); flex-wrap:wrap; }
  .gallery-section-head h2{ font-size:1.4rem; }
  .gallery-section-head span{ font-size:13px; color:var(--color-muted); }

  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:var(--space-2);
  }
  @media (min-width:640px){ .gallery-grid{ grid-template-columns:repeat(3,1fr); } }
  @media (min-width:1024px){ .gallery-grid{ grid-template-columns:repeat(4,1fr); } }
  .gallery-tile{
    aspect-ratio:4/3;
    border-radius:var(--radius-md);
    overflow:hidden;
    background:var(--color-surface);
    border:1px solid var(--color-border);
  }
  .gallery-tile img{ width:100%; height:100%; object-fit:cover; display:block; }
  .gallery-placeholder{
    aspect-ratio:4/3;
    border-radius:var(--radius-md);
    border:1.5px dashed var(--color-border);
    background:var(--color-surface);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:8px;
    color:var(--color-muted);
  }
  .gallery-placeholder .icon{ width:26px; height:26px; }
  .gallery-placeholder span{ font-size:12px; font-weight:600; letter-spacing:.02em; }

  .gallery-back-cta{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:var(--space-6); }

  /* ---------- LEGAL / PROSE PAGES ---------- */
  .prose{ max-width:72ch; }
  .prose h2{ font-size:1.3rem; margin-top:var(--space-5); margin-bottom:12px; }
  .prose h2:first-child{ margin-top:0; }
  .prose p{ color:var(--color-muted-2); margin-bottom:14px; }
  .prose ul{ margin:0 0 14px; padding-left:1.2em; list-style:disc; }
  .prose li{ color:var(--color-muted-2); margin-bottom:6px; }
  .prose strong{ color:var(--color-ink); }
  .prose .updated{ font-size:13px; color:var(--color-muted); margin-bottom:var(--space-4); }

  .related-projects{ margin-top:var(--space-6); }
  .related-projects h2{ font-size:1.3rem; margin-bottom:var(--space-3); }
  .related-links{ display:flex; flex-wrap:wrap; gap:10px; }
  .related-links a{
    display:inline-flex; align-items:center; gap:8px;
    padding:10px 16px;
    border:1px solid var(--color-border);
    border-radius:999px;
    text-decoration:none;
    color:var(--color-ink);
    font-family:var(--font-heading);
    font-weight:600;
    font-size:13.5px;
    transition:border-color .18s var(--ease), background-color .18s var(--ease);
  }
  .related-links a:hover{ border-color:var(--color-accent); background:var(--color-accent-soft); }