/* ===========================================================
   VSR Digital Consulting — Design System
   Palette: ink navy + warm copper accent on warm ivory paper.
   Type: Fraunces (display serif) + IBM Plex Sans (body/UI)
         + IBM Plex Mono (eyebrows / labels / stat figures).
   =========================================================== */

/* ---------- Design tokens ---------- */
:root{
  color-scheme:light; /* stop browsers from auto-dark-styling form controls (buttons/inputs) */

  /* ink (dark) scale */
  --ink-950:#0a0e16;
  --ink-900:#0e1420;
  --ink-800:#151d2c;
  --ink-700:#202a3d;
  --ink-600:#354256;
  --ink-500:#55627a;

  /* paper (light) scale — warm ivory, never pure white */
  --paper-000:#faf8f3;
  --paper-100:#f5f2ea;
  --paper-200:#ece7da;
  --paper-300:#ddd6c4;

  /* accent — burnt copper / amber */
  --copper-300:#e3ab6c;
  --copper-400:#cf8c4c;
  --copper-500:#bd7635;
  --copper-600:#9c5f29;
  --copper-glow:rgba(189,118,53,.16);

  /* supporting */
  --ok-500:#5c7a54;

  /* text */
  --text-on-paper:#181c22;
  --text-on-paper-muted:#565f6c;
  --text-on-ink:#f2efe8;
  --text-on-ink-muted:#a7afc0;

  /* borders */
  --line-on-paper:#ddd6c4;
  --line-on-paper-soft:#e8e3d5;
  --line-on-ink:rgba(242,239,232,.12);
  --line-on-ink-soft:rgba(242,239,232,.07);

  /* type — one professional typeface, used consistently across the site */
  --font-display:'IBM Plex Sans', -apple-system, Segoe UI, Arial, sans-serif;
  --font-body:'IBM Plex Sans', -apple-system, Segoe UI, Arial, sans-serif;
  --font-mono:'IBM Plex Sans', -apple-system, Segoe UI, Arial, sans-serif;

  /* rhythm */
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:14px;
  --container:1240px;
  --container-narrow:840px;

  --shadow-card:0 1px 2px rgba(10,14,22,.04), 0 8px 24px -12px rgba(10,14,22,.12);
  --shadow-card-hover:0 4px 10px rgba(10,14,22,.06), 0 20px 40px -16px rgba(10,14,22,.18);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--paper-000);color:var(--text-on-paper);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
img,svg{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,p,figure{margin:0;}
button{font:inherit;background:none;border:none;cursor:pointer;color:inherit;}
input,textarea,select{font:inherit;}

h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;letter-spacing:-0.015em;color:inherit;}
h1{font-size:clamp(2.4rem,4.4vw,3.9rem);line-height:1.08;font-weight:700;}
h2{font-size:clamp(1.9rem,3vw,2.7rem);line-height:1.12;}
h3{font-size:1.4rem;line-height:1.3;}
h4{font-size:1.1rem;line-height:1.35;}

.lede{font-size:1.2rem;line-height:1.6;color:var(--text-on-paper-muted);}
.on-ink .lede{color:var(--text-on-ink-muted);}

/* ---------- Layout helpers ---------- */
.wrap{max-width:var(--container);margin:0 auto;padding:0 32px;}
.wrap-narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 32px;}
.section{padding:88px 0;}
.section-tight{padding:56px 0;}
.on-ink{background:var(--ink-900);color:var(--text-on-ink);}
.on-ink h1,.on-ink h2,.on-ink h3,.on-ink h4{color:var(--text-on-ink);}
.on-panel{background:var(--paper-100);}
.on-panel-alt{background:var(--paper-200);}

.grid{display:grid;gap:28px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-5{grid-template-columns:repeat(5,1fr);}
.grid-6{grid-template-columns:repeat(6,1fr);}

@media (max-width:980px){
  .grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-5,.grid-6{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:640px){
  .grid-2,.grid-3,.grid-4,.grid-5,.grid-6{grid-template-columns:1fr;}
  .section{padding:60px 0;}
}

/* eyebrow / kicker */
.kicker{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--copper-600);margin-bottom:16px;}
.on-ink .kicker{color:var(--copper-300);}
.kicker::before{content:"";width:22px;height:1px;background:currentColor;opacity:.7;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;letter-spacing:.01em;transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;white-space:nowrap;}
.btn-primary{background:var(--copper-500);color:#fff;border:1px solid var(--copper-500);}
.btn-primary:hover{background:var(--copper-600);border-color:var(--copper-600);transform:translateY(-1px);}
.btn-ghost{background:transparent;color:var(--text-on-paper);border:1px solid var(--line-on-paper);}
.btn-ghost:hover{border-color:var(--ink-900);transform:translateY(-1px);}
.on-ink .btn-ghost{color:var(--text-on-ink);border-color:var(--line-on-ink);}
.on-ink .btn-ghost:hover{border-color:var(--text-on-ink);}
.btn-sm{padding:9px 18px;font-size:.85rem;}
.btn .icon{width:16px;height:16px;}

/* ---------- Header / Nav ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(250,248,243,.92);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line-on-paper-soft);color:var(--text-on-paper);}
.site-header .wrap{max-width:1340px;display:flex;align-items:center;justify-content:space-between;height:78px;gap:18px;}

.brand{display:flex;align-items:center;gap:9px;font-family:var(--font-display);font-weight:700;font-size:1.12rem;color:var(--ink-900);flex:none;}
.brand .mark{width:32px;height:32px;flex:none;}
.brand small{display:block;font-family:var(--font-body);font-weight:500;font-size:.56rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-on-paper-muted);margin-top:1px;white-space:nowrap;}

.nav-main{display:flex;align-items:center;gap:1px;flex-wrap:nowrap;}
.nav-main a{position:relative;padding:9px 11px;font-size:.87rem;font-weight:500;color:var(--ink-700);border-radius:var(--radius-sm);white-space:nowrap;}
.nav-main a:hover{color:var(--copper-600);}
.nav-main a.is-active{color:var(--ink-900);font-weight:600;}
.nav-main a.is-active::after{content:"";position:absolute;left:11px;right:11px;bottom:2px;height:2px;background:var(--copper-500);border-radius:2px;}

.nav-item{position:relative;display:flex;align-items:center;}
.nav-item > a{display:flex;align-items:center;}
.nav-caret{width:12px;height:12px;margin-left:2px;transition:transform .15s ease;}
.nav-item:hover .nav-caret,.nav-item:focus-within .nav-caret{transform:rotate(180deg);}
.nav-dropdown{position:absolute;top:calc(100% + 6px);left:0;min-width:250px;background:var(--paper-000);border:1px solid var(--line-on-paper);border-radius:var(--radius-md);box-shadow:var(--shadow-card-hover);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .15s ease, transform .15s ease, visibility .15s;z-index:5;}
.nav-item:hover .nav-dropdown,.nav-item:focus-within .nav-dropdown{opacity:1;visibility:visible;transform:none;}
.nav-dropdown a{display:block;padding:10px 12px;border-radius:var(--radius-sm);font-size:.88rem;font-weight:500;}
.nav-dropdown a:hover{background:var(--paper-100);color:var(--copper-600);}
.nav-dropdown a::after{display:none;}

.header-actions{display:flex;align-items:center;gap:12px;flex:none;color:var(--text-on-paper);}
.header-actions .btn-primary{padding:10px 18px;font-size:.85rem;}
.nav-toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--ink-900);background:var(--paper-100);}
.nav-toggle:hover{background:var(--paper-200);}
.nav-toggle .icon{width:22px;height:22px;color:inherit;}

@media (max-width:980px){
  .nav-main{position:fixed;inset:78px 0 0 0;background:var(--paper-000);flex-direction:column;align-items:stretch;padding:18px 24px 40px;gap:2px;display:none;overflow-y:auto;border-top:1px solid var(--line-on-paper-soft);}
  .nav-main.is-open{display:flex;}
  .nav-main a{padding:14px 8px;font-size:1.05rem;border-bottom:1px solid var(--line-on-paper-soft);}
  .nav-item{flex-direction:column;align-items:stretch;}
  .nav-item > a{border-bottom:none;padding-bottom:4px;}
  .nav-dropdown{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:0 0 8px 14px;background:transparent;}
  .nav-dropdown a{padding:12px 8px;border-bottom:1px solid var(--line-on-paper-soft);font-size:1rem;}
  .header-actions .btn-primary{display:none;}
  .nav-toggle{display:inline-flex;}
}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink-950);color:var(--text-on-ink-muted);padding:72px 0 0;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:56px;border-bottom:1px solid var(--line-on-ink-soft);}
.footer-brand .brand{color:var(--text-on-ink);}
.footer-brand p{margin-top:16px;max-width:320px;font-size:.94rem;color:var(--text-on-ink-muted);}
.footer-col h4{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-on-ink);font-weight:500;margin-bottom:18px;}
.footer-col ul{display:flex;flex-direction:column;gap:11px;}
.footer-col a{font-size:.9rem;color:var(--text-on-ink-muted);}
.footer-col a:hover{color:var(--copper-300);}
.footer-contact li{display:flex;gap:10px;font-size:.9rem;align-items:flex-start;}
.footer-contact .icon{width:16px;height:16px;flex:none;margin-top:3px;color:var(--copper-300);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;font-size:.82rem;color:var(--ink-500);flex-wrap:wrap;gap:10px;}

@media (max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr;}
}

/* ---------- Hero ---------- */
.hero{position:relative;padding:120px 0 100px;background:var(--ink-900);color:var(--text-on-ink);overflow:hidden;}
.hero::before{content:"";position:absolute;inset:0;background-image:
    linear-gradient(var(--line-on-ink-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-on-ink-soft) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 70% 60% at 70% 20%, black 10%, transparent 72%);
  pointer-events:none;
}
.hero-inner{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:end;}
.hero h1{max-width:640px;}
.hero .lede{max-width:520px;margin-top:22px;}
.hero-actions{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap;}
.hero-figure{align-self:center;}

@media (max-width:900px){
  .hero{padding:80px 0 64px;}
  .hero-inner{grid-template-columns:1fr;}
  .hero-figure{order:-1;}
}

/* Simple hero diagram card */
.diagram-card{background:var(--ink-800);border:1px solid var(--line-on-ink);border-radius:var(--radius-lg);padding:26px;}
.diagram-card .diagram-title{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--copper-300);margin-bottom:18px;}
.diagram-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line-on-ink-soft);}
.diagram-row:first-of-type{border-top:none;}
.diagram-row .icon{width:20px;height:20px;color:var(--copper-300);flex:none;}
.diagram-row span{font-size:.9rem;color:var(--text-on-ink);}
.diagram-row small{display:block;font-size:.78rem;color:var(--text-on-ink-muted);margin-top:2px;}

/* ---------- Stat strip ---------- */
.stat-strip{border-top:1px solid var(--line-on-paper);border-bottom:1px solid var(--line-on-paper);}
.stat-strip .wrap{display:grid;grid-template-columns:repeat(3,1fr);}
.stat{padding:26px 28px;border-left:1px solid var(--line-on-paper);}
.stat:first-child{border-left:none;}
.stat .num{font-family:var(--font-display);font-size:1.8rem;font-weight:700;color:var(--ink-900);line-height:1;}
.stat .num .unit{color:var(--copper-500);}
.stat .label{margin-top:8px;font-size:.84rem;color:var(--text-on-paper-muted);max-width:26ch;}
@media (max-width:640px){.stat-strip .wrap{grid-template-columns:1fr;}.stat{border-left:none;border-top:1px solid var(--line-on-paper);}.stat:first-child{border-top:none;}}

/* ---------- Cards ---------- */
.card{background:var(--paper-000);border:1px solid var(--line-on-paper);border-radius:var(--radius-md);padding:30px;transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;}
.card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-2px);border-color:var(--line-on-paper);}
.card .icon-badge{width:46px;height:46px;border-radius:10px;background:var(--copper-glow);display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.card .icon-badge .icon{width:24px;height:24px;color:var(--copper-600);}
.card h3{margin-bottom:10px;}
.card p{color:var(--text-on-paper-muted);font-size:.95rem;}
.card .card-link{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:.88rem;font-weight:600;color:var(--ink-900);}
.card .card-link .icon{width:14px;height:14px;transition:transform .15s ease;}
.card:hover .card-link .icon{transform:translateX(3px);}

/* Module card (compact, for suite grids) */
.module-card{background:var(--paper-000);border:1px solid var(--line-on-paper);border-radius:var(--radius-md);padding:22px 22px 20px;}
.module-card .icon{width:22px;height:22px;color:var(--copper-600);margin-bottom:14px;}
.module-card h4{margin-bottom:8px;}
.module-card p{font-size:.88rem;color:var(--text-on-paper-muted);margin-bottom:12px;}
.module-card ul{display:flex;flex-direction:column;gap:6px;}
.module-card ul li{font-size:.82rem;color:var(--text-on-paper);display:flex;gap:8px;align-items:flex-start;}
.module-card ul li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--copper-500);margin-top:7px;flex:none;}

/* ---------- Suite section (Connected Smart Worker) ---------- */
.suite-nav{position:sticky;top:78px;z-index:60;background:var(--paper-000);border-bottom:1px solid var(--line-on-paper);}
.suite-nav .wrap{display:flex;gap:8px;overflow-x:auto;padding:14px 32px;scrollbar-width:thin;}
.suite-nav a{flex:none;padding:8px 16px;border-radius:999px;border:1px solid var(--line-on-paper);font-size:.84rem;font-weight:500;color:var(--text-on-paper-muted);}
.suite-nav a:hover{border-color:var(--copper-400);color:var(--ink-900);}
.suite-nav a.is-active{background:var(--ink-900);border-color:var(--ink-900);color:var(--text-on-ink);}

.suite-block{padding:76px 0;border-bottom:1px solid var(--line-on-paper);}
.suite-block:last-child{border-bottom:none;}
.suite-head{display:grid;grid-template-columns:.9fr 1.4fr;gap:48px;margin-bottom:40px;}
.suite-head .icon-badge{width:52px;height:52px;border-radius:12px;background:var(--ink-900);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.suite-head .icon-badge .icon{width:26px;height:26px;color:var(--copper-300);}
@media (max-width:900px){.suite-head{grid-template-columns:1fr;gap:18px;}}

/* ---------- Process / steps ---------- */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;counter-reset:step;}
.step{position:relative;padding:0 22px 0 0;border-left:1px solid var(--line-on-paper);padding-left:22px;}
.step:first-child{border-left:none;padding-left:0;}
.step .step-num{font-family:var(--font-mono);font-size:.78rem;color:var(--copper-500);margin-bottom:14px;}
.step h4{margin-bottom:10px;}
.step p{font-size:.88rem;color:var(--text-on-paper-muted);}
@media (max-width:980px){
  .steps{grid-template-columns:1fr;gap:36px;}
  .step{border-left:none;padding-left:0;border-top:1px solid var(--line-on-paper);padding-top:28px;}
  .step:first-child{border-top:none;padding-top:0;}
}

/* ---------- Case studies ---------- */
.case-tile{background:var(--ink-900);color:var(--text-on-ink);border-radius:var(--radius-lg);padding:36px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:start;}
.case-tile .case-tag{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--copper-300);margin-bottom:14px;}
.case-tile h3{max-width:32ch;margin-bottom:14px;}
.case-tile p{color:var(--text-on-ink-muted);font-size:.94rem;max-width:52ch;}
.case-tile .case-metrics{display:flex;flex-direction:column;gap:18px;text-align:right;}
.case-tile .case-metrics .num{font-family:var(--font-display);font-size:2.1rem;font-weight:600;}
.case-tile .case-metrics .label{font-size:.76rem;color:var(--text-on-ink-muted);max-width:16ch;}
@media (max-width:760px){
  .case-tile{grid-template-columns:1fr;}
  .case-tile .case-metrics{flex-direction:row;text-align:left;flex-wrap:wrap;}
}

/* ---------- Industry cards ---------- */
.industry-card{position:relative;border-radius:var(--radius-md);border:1px solid var(--line-on-paper);padding:28px;background:var(--paper-000);overflow:hidden;}
.industry-card .icon{width:30px;height:30px;color:var(--copper-600);margin-bottom:18px;}
.industry-card h3{margin-bottom:10px;}
.industry-card p{font-size:.9rem;color:var(--text-on-paper-muted);}

/* ---------- Logo / partner strip ---------- */
.partner-strip{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:28px;padding:36px 0;}
.partner-chip{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:.82rem;letter-spacing:.04em;color:var(--text-on-paper-muted);}
.partner-chip .icon{width:20px;height:20px;color:var(--ink-700);}

/* ---------- CTA band ---------- */
.cta-band{background:var(--ink-900);color:var(--text-on-ink);border-radius:var(--radius-lg);padding:56px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.cta-band h2{max-width:520px;}
@media (max-width:700px){.cta-band{padding:36px;text-align:left;}}

/* ---------- Forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field.full{grid-column:1 / -1;}
.field label{font-size:.82rem;font-weight:600;color:var(--ink-800);}
.field input,.field textarea,.field select{padding:13px 15px;border:1px solid var(--line-on-paper);border-radius:var(--radius-sm);background:var(--paper-000);color:var(--text-on-paper);font-size:.95rem;}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--copper-400);outline-offset:1px;border-color:var(--copper-400);}
.field textarea{min-height:130px;resize:vertical;}
@media (max-width:640px){.form-grid{grid-template-columns:1fr;}}

/* ---------- Misc ---------- */
.divider{height:1px;background:var(--line-on-paper);border:none;margin:0;}
.pill{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;background:var(--copper-glow);color:var(--copper-600);font-size:.76rem;font-weight:600;font-family:var(--font-mono);letter-spacing:.04em;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;}
@media (max-width:900px){.two-col{grid-template-columns:1fr;gap:32px;}}
.quote-block{border-left:3px solid var(--copper-500);padding-left:24px;}
.quote-block p{font-family:var(--font-display);font-size:1.4rem;font-weight:500;line-height:1.4;color:var(--ink-900);}
.on-ink .quote-block p{color:var(--text-on-ink);}
.quote-block cite{display:block;margin-top:14px;font-style:normal;font-size:.85rem;color:var(--text-on-paper-muted);}

.breadcrumb{font-family:var(--font-mono);font-size:.78rem;color:var(--text-on-paper-muted);margin-bottom:18px;}
.breadcrumb a:hover{color:var(--copper-600);}

.page-hero{padding:64px 0 56px;border-bottom:1px solid var(--line-on-paper);}
.page-hero .lede{max-width:640px;margin-top:18px;}
.page-hero.on-ink{border-bottom-color:var(--line-on-ink);}
.page-hero .breadcrumb a{color:var(--text-on-paper-muted);}
.page-hero.on-ink .breadcrumb,.page-hero.on-ink .breadcrumb a{color:var(--text-on-ink-muted);}
.page-hero.on-ink .breadcrumb a:hover{color:var(--copper-300);}

.proof-row{display:flex;gap:0;margin-top:28px;border-top:1px solid var(--line-on-paper);}
.proof-row .proof{flex:1;padding:20px 24px 0;border-left:1px solid var(--line-on-paper);}
.proof-row .proof:first-child{border-left:none;}
.proof-row .proof .num{font-family:var(--font-display);font-weight:700;font-size:1.4rem;color:var(--ink-900);}
.proof-row .proof .label{margin-top:4px;font-size:.84rem;color:var(--text-on-paper-muted);}
@media (max-width:700px){.proof-row{flex-direction:column;}.proof-row .proof{border-left:none;border-top:1px solid var(--line-on-paper);padding:16px 0 0;}.proof-row .proof:first-child{border-top:none;}}

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

/* Anchor offset for sticky headers */
.anchor-target{scroll-margin-top:150px;}

/* ---------- Photography ---------- */
.photo-frame{border-radius:var(--radius-lg);overflow:hidden;background:var(--paper-200);}
.photo-frame img{width:100%;height:100%;object-fit:cover;display:block;}

.hero-split{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;}
.hero-split .photo-frame{aspect-ratio:4/5;box-shadow:0 30px 60px -20px rgba(0,0,0,.45);}
@media (max-width:900px){
  .hero-split{grid-template-columns:1fr;}
  .hero-split .photo-frame{order:-1;max-height:320px;}
}

.photo-band{position:relative;height:440px;overflow:hidden;border-radius:var(--radius-lg);}
.photo-band img{width:100%;height:100%;object-fit:cover;display:block;}
.photo-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(10,14,22,.05) 0%, rgba(10,14,22,.15) 45%, rgba(10,14,22,.82) 100%);}
.photo-band-caption{position:absolute;left:0;right:0;bottom:0;padding:40px;z-index:2;}
.photo-band-caption .kicker{color:var(--copper-300);}
.photo-band-caption p.cap-text{max-width:56ch;color:var(--text-on-ink);font-size:1.05rem;}
@media (max-width:640px){.photo-band{height:360px;}.photo-band-caption{padding:26px;}}

.split-photo-figure{display:flex;flex-direction:column;gap:22px;}
.split-photo-figure .photo-frame{aspect-ratio:2;}