/* ============================================================
   JB WINE SERVICES - GLOBAL DESIGN SYSTEM v3
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Instrument+Serif:ital@0;1&display=swap');

:root{
  --jb-green:    #384A45;
  --jb-green-dk: #2A3833;
  --linen:       #F4EFEB;
  --white:       #FFFFFF;
  --charcoal:    #2E2E2E;
  --gold:        #C2A969;
  --silver:      #C4C4C4;
  --bordeaux:    #5A2430;

  --rule:       rgba(46,46,46,0.14);
  --rule-light: rgba(244,239,235,0.20);

  --sans:  'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --serif: 'Instrument Serif', Georgia, serif;

  --max: 1280px;
  --gutter: clamp(20px, 5vw, 64px);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--white); color:var(--charcoal);
  font-family:var(--sans); font-size:clamp(16px,.35vw + 15px,17.5px);
  line-height:1.62; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

h1,h2,h3,h4{ font-family:var(--sans); font-weight:600; line-height:1.08; letter-spacing:-0.02em; margin:0 0 .5em; }
h1{ font-size:clamp(2.4rem,4.6vw,4.2rem); letter-spacing:-0.03em; }
h2{ font-size:clamp(1.75rem,2.6vw,2.6rem); letter-spacing:-0.025em; }
h3{ font-size:clamp(1.15rem,1vw + .8rem,1.45rem); }
p{ margin:0 0 1.15em; }
p:last-child{ margin-bottom:0; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.7em;
  font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.3em;
}
.eyebrow::before{ content:''; width:26px; height:1px; background:var(--gold); flex:none; }
.eyebrow--plain::before{ display:none; }
.eyebrow--dark{ color:var(--jb-green); }
.eyebrow--dark::before{ background:var(--gold); }

.lede{ font-size:clamp(1.02rem,.45vw + .92rem,1.2rem); line-height:1.58; }
.muted{ opacity:.82; }

/* ---------- Layout ---------- */
.wrap{ max-width:var(--max); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }
.wrap--narrow{ max-width:840px; }
.section{ padding:clamp(64px,8vw,128px) 0; }
.section--tight{ padding:clamp(48px,6vw,88px) 0; }
.bg-green{ background:var(--jb-green); color:var(--linen); }
.bg-green-dk{ background:var(--jb-green-dk); color:var(--linen); }
.bg-linen{ background:var(--linen); }
.bg-white{ background:var(--white); }
.bg-bordeaux{ background:var(--bordeaux); color:var(--linen); }
.bg-green .eyebrow, .bg-bordeaux .eyebrow, .bg-green-dk .eyebrow{ color:var(--gold); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--sans); font-weight:600; font-size:.92rem;
  padding:1.02em 1.9em; border:1px solid transparent; border-radius:0; cursor:pointer;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.btn svg{ transition:transform .25s var(--ease); }
.btn:hover svg{ transform:translateX(4px); }
.btn--gold{ background:var(--gold); color:var(--jb-green-dk); }
.btn--gold:hover{ background:#d4bd83; }
.btn--green{ background:var(--jb-green); color:var(--linen); }
.btn--green:hover{ background:var(--bordeaux); }
.btn--outline{ border-color:currentColor; background:transparent; color:inherit; }
.btn--outline:hover{ background:var(--charcoal); color:var(--white); border-color:var(--charcoal); }
.bg-green .btn--outline:hover, .bg-bordeaux .btn--outline:hover,
.home-hero .btn--outline:hover, .image-page-hero .btn--outline:hover,
.bg-green-dk .btn--outline:hover{ background:var(--linen); color:var(--jb-green-dk); border-color:var(--linen); }
.btn-row{ display:flex; gap:.8rem; flex-wrap:wrap; margin-top:1.9rem; }
.btn--linkedin{ font-size:.86rem; padding:.85em 1.4em; }

/* ---------- Header ---------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100; padding:14px 0;
  transition:background .35s var(--ease), padding .35s var(--ease);
}
.site-header .wrap{ display:flex; align-items:center; justify-content:space-between; gap:20px; }
.site-header.is-solid{ background:var(--jb-green); padding:10px 0; box-shadow:0 1px 0 rgba(0,0,0,.12); }
.site-header.always-solid{ position:sticky; background:var(--jb-green); }

.brand{ display:block; flex:none; }
.brand img{ height:56px; width:auto; }
.site-header.is-solid .brand img{ height:48px; }
@media (max-width:640px){ .brand img{ height:46px; } }

.nav{ display:flex; align-items:center; gap:clamp(18px,2.2vw,36px); }
.nav a{ color:var(--linen); font-size:.92rem; font-weight:500; position:relative; padding:6px 0; }
.nav a:not(.nav__cta)::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.nav a:not(.nav__cta):hover::after, .nav a.is-current:not(.nav__cta)::after{ transform:scaleX(1); }
.nav__cta{ background:var(--gold); color:var(--jb-green-dk) !important; padding:.72em 1.3em !important; font-weight:600; font-size:.86rem; }
.nav__cta:hover{ background:#d4bd83; }

.nav-toggle{ display:none; background:none; border:0; cursor:pointer; padding:8px; color:var(--linen); }
.nav-toggle span{ display:block; width:24px; height:2px; background:currentColor; margin:5px 0; transition:transform .3s var(--ease), opacity .2s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:900px){
  .nav-toggle{ display:block; }
  .nav{
    position:fixed; inset:0; background:var(--jb-green);
    flex-direction:column; align-items:flex-start; justify-content:center;
    gap:6px; padding:0 var(--gutter); opacity:0; pointer-events:none;
    transition:opacity .3s var(--ease);
  }
  .nav.is-open{ opacity:1; pointer-events:auto; }
  .nav a{ font-size:1.5rem; font-weight:600; padding:12px 0; }
  .nav__cta{ margin-top:16px; font-size:1rem; }
}

/* ============================================================
   HERO COMPONENTS
   ============================================================ */

/* --- 1. Homepage immersive hero --- */
.home-hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  color:var(--linen); overflow:hidden; isolation:isolate;
}
.home-hero__media{ position:absolute; inset:-8% 0 0 0; z-index:-2; }
.home-hero__media img{ width:100%; height:112%; object-fit:cover; object-position:center 40%; }
.home-hero::after{
  content:''; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(180deg, rgba(42,56,51,.70) 0%, rgba(42,56,51,.16) 30%, rgba(42,56,51,.58) 66%, rgba(42,56,51,.93) 100%),
    linear-gradient(90deg, rgba(42,56,51,.55) 0%, rgba(42,56,51,0) 62%);
}
.home-hero__inner{ width:100%; padding-top:170px; padding-bottom:clamp(60px,8vw,120px); }
.home-hero h1{ max-width:14ch; margin-bottom:.4em; }
.home-hero__sub{ max-width:54ch; font-size:clamp(1rem,.45vw + .9rem,1.18rem); color:rgba(244,239,235,.92); }
.home-hero__scroll{
  position:absolute; bottom:24px; right:var(--gutter); z-index:2;
  font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:rgba(244,239,235,.6);
  display:flex; align-items:center; gap:10px;
}
.home-hero__scroll i{ display:block; width:1px; height:32px; background:rgba(244,239,235,.4); animation:drop 2.4s var(--ease) infinite; transform-origin:top; }
@keyframes drop{ 0%,100%{ transform:scaleY(.3); opacity:.3 } 50%{ transform:scaleY(1); opacity:1 } }
@media (max-width:700px){ .home-hero__scroll{ display:none; } }

/* --- 2. Compact secondary-page hero (no image) --- */
.page-hero{
  background:var(--jb-green); color:var(--linen);
  padding:clamp(120px,15vw,168px) 0 clamp(44px,6vw,72px);
  min-height:280px; display:flex; align-items:flex-end;
}
.page-hero .wrap{ width:100%; }
.page-hero h1{ max-width:20ch; margin-bottom:.35em; font-size:clamp(2.1rem,3.6vw,3.4rem); }
.page-hero__sub{ max-width:58ch; font-size:clamp(1rem,.4vw + .9rem,1.15rem); color:rgba(244,239,235,.9); }
.page-hero--linen{ background:var(--linen); color:var(--charcoal); }
.page-hero--linen .eyebrow{ color:var(--jb-green); }
.page-hero--linen .page-hero__sub{ color:rgba(46,46,46,.82); }

/* --- 3. Secondary-page hero with a real background image --- */
.image-page-hero{
  position:relative; color:var(--linen); overflow:hidden; isolation:isolate;
  padding:clamp(130px,16vw,190px) 0 clamp(52px,7vw,86px);
  min-height:340px; max-height:480px; display:flex; align-items:flex-end;
}
.image-page-hero .wrap{ width:100%; }
.image-page-hero__media{ position:absolute; inset:0; z-index:-2; }
.image-page-hero__media img{ width:100%; height:100%; object-fit:cover; }
.image-page-hero::after{
  content:''; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(42,56,51,.78) 0%, rgba(42,56,51,.62) 45%, rgba(42,56,51,.86) 100%);
}
.image-page-hero h1{ max-width:20ch; margin-bottom:.35em; font-size:clamp(2.1rem,3.6vw,3.4rem); }
.image-page-hero__sub{ max-width:58ch; font-size:clamp(1rem,.4vw + .9rem,1.15rem); color:rgba(244,239,235,.94); }

/* ---------- Meet James ---------- */
.james{ display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1fr); gap:clamp(32px,5vw,84px); align-items:center; }
.james__media{ position:relative; }
.james__media img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 20%; }
.james__badge{ position:absolute; right:-16px; bottom:-16px; background:var(--jb-green); color:var(--linen); padding:18px 22px; max-width:225px; }
.james__badge span{ display:block; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-bottom:6px; }
.james__badge strong{ font-size:.95rem; font-weight:600; line-height:1.3; }
.pullquote-box{ border-left:2px solid var(--gold); padding-left:22px; margin-top:2rem; }
.pullquote-box p{ font-family:var(--serif); font-size:clamp(1.15rem,.9vw + .95rem,1.45rem); line-height:1.42; margin-bottom:.7em; }
.pullquote-box cite{ font-style:normal; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--jb-green); opacity:.75; }
.bg-green .pullquote-box cite{ color:var(--gold); opacity:1; }
@media (max-width:860px){
  .james{ grid-template-columns:1fr; }
  .james__media img{ aspect-ratio:3/4; max-height:66vh; }
  .james__badge{ right:0; bottom:-14px; }
}

/* ---------- Brittany origin ---------- */
.origin__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px,4.5vw,76px); align-items:center; }
.origin__media img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.origin__pull{
  font-family:var(--serif); font-size:clamp(1.3rem,1.5vw + .9rem,1.9rem); line-height:1.32;
  color:var(--jb-green); max-width:22ch; margin:0 0 1.3em; padding-bottom:1em; border-bottom:1px solid var(--rule);
}
@media (max-width:860px){ .origin__grid{ grid-template-columns:1fr; } .origin__media img{ aspect-ratio:1/1; } }

/* ---------- Sensory ---------- */
.section-head{ max-width:660px; margin-bottom:clamp(38px,5vw,68px); }
.sensory__strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.6vw,26px); align-items:start; }
.sense img{ width:100%; aspect-ratio:3/4; object-fit:cover; }
.sense:nth-child(odd){ margin-top:clamp(20px,3.4vw,56px); }
.sense__label{ margin-top:14px; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); }
.sense__text{ margin-top:8px; font-size:.93rem; line-height:1.55; color:rgba(244,239,235,.85); }
.sense figcaption{ margin:0; }
@media (max-width:760px){
  .sensory__strip{ grid-template-columns:1fr 1fr; gap:18px; }
  .sense:nth-child(odd){ margin-top:0; }
  .sense:nth-child(2), .sense:nth-child(4){ margin-top:30px; }
}

/* ---------- Home collection (2x2) ---------- */
.collection{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2vw,30px); }
.svc{ position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:clamp(330px,36vw,460px); padding:clamp(26px,2.6vw,38px); overflow:hidden; isolation:isolate; }
.svc__media{ position:absolute; inset:0; z-index:-2; }
.svc__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); }
.svc:hover .svc__media img{ transform:scale(1.05); }
.svc--photo{ color:var(--linen); }
.svc--photo::after{ content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(42,56,51,.28) 0%, rgba(42,56,51,.68) 52%, rgba(42,56,51,.92) 100%); }
.svc--green{ background:var(--jb-green); color:var(--linen); }
.svc--bordeaux{ background:var(--bordeaux); color:var(--linen); }
.svc__no{ font-size:.7rem; letter-spacing:.2em; color:var(--gold); margin-bottom:auto; }
.svc h3{ margin-bottom:.5em; font-size:clamp(1.3rem,1.2vw + .9rem,1.7rem); }
.svc p{ font-size:.94rem; color:rgba(244,239,235,.88); max-width:46ch; }
.svc--offset{ transform:translateY(clamp(0px,3vw,44px)); }
@media (max-width:820px){ .collection{ grid-template-columns:1fr; } .svc--offset{ transform:none; } .svc{ min-height:340px; } }

/* ---------- Testimonials ---------- */
.tstm-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,64px); }
.tstm{ display:flex; flex-direction:column; }
.tstm__mark{ font-family:var(--serif); font-size:3rem; line-height:.6; color:var(--gold); margin-bottom:.35em; }
.tstm__body{ font-size:1rem; line-height:1.62; }
.tstm__attr{ margin-top:1.5em; padding-top:1.1em; border-top:1px solid var(--rule-light); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
@media (max-width:820px){ .tstm-grid{ grid-template-columns:1fr; } }

/* ---------- Editorial service bands (Experiences page) ---------- */
.band{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:0; }
.band__media img{ width:100%; height:100%; aspect-ratio:4/3; object-fit:cover; }
.band__copy{ padding:clamp(32px,5vw,80px) clamp(24px,4vw,72px); }
.band--rev .band__media{ order:2; }
.band__no{ font-size:.72rem; letter-spacing:.22em; color:var(--gold); margin-bottom:1em; }
.band h3{ font-size:clamp(1.5rem,1.7vw + .9rem,2.1rem); margin-bottom:.55em; }
@media (max-width:860px){
  .band{ grid-template-columns:1fr; }
  .band--rev .band__media{ order:0; }
  .band__media img{ aspect-ratio:16/10; }
}

/* ---------- About: credentials & stories ---------- */
.creds{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--rule-light); }
.creds__item{ padding:clamp(28px,3vw,44px) clamp(20px,2.4vw,36px); border-right:1px solid var(--rule-light); }
.creds__item:last-child{ border-right:0; }
.creds__item h3{ font-size:1.1rem; margin-bottom:.6em; }
.creds__item p{ font-size:.94rem; color:rgba(244,239,235,.84); }
.creds__num{ font-size:.7rem; letter-spacing:.2em; color:var(--gold); margin-bottom:1.4em; }
@media (max-width:860px){
  .creds{ grid-template-columns:1fr; }
  .creds__item{ border-right:0; border-bottom:1px solid var(--rule-light); }
  .creds__item:last-child{ border-bottom:0; }
}

.story{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,4.5vw,72px); align-items:center; }
.story__media img{ width:100%; aspect-ratio:3/4; object-fit:cover; }
.story__note{ font-size:.82rem; letter-spacing:.06em; color:rgba(46,46,46,.6); margin-top:1.6em; font-style:italic; }
.bg-green .story__note, .bg-green-dk .story__note{ color:rgba(244,239,235,.6); }
@media (max-width:860px){ .story{ grid-template-columns:1fr; } .story__media img{ aspect-ratio:16/10; } }

.trust{ max-width:760px; }
.trust__quote{ font-family:var(--serif); font-size:clamp(1.5rem,2vw + 1rem,2.4rem); line-height:1.3; color:var(--linen); margin:.6em 0; }
.trust__frame{ font-size:.95rem; color:rgba(244,239,235,.82); }

/* ---------- Contact form ---------- */
.contact-grid{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(32px,5vw,80px); align-items:start; }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:.45em; margin-bottom:1.1rem; }
.field label{ font-size:.76rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.field input, .field textarea, .field select{
  font-family:var(--sans); font-size:1rem; color:var(--charcoal);
  padding:.92em 1.05em; border:1px solid var(--rule); background:var(--white); border-radius:0;
}
.field textarea{ min-height:150px; resize:vertical; }
.field--half{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:560px){ .field--half{ grid-template-columns:1fr; } }
.field__hint{ font-size:.78rem; color:rgba(46,46,46,.6); }
.form-aside{ background:var(--linen); padding:clamp(26px,3vw,40px); }
.form-aside h3{ font-size:1.1rem; }
.form-aside p{ font-size:.94rem; }

/* ---------- Legal pages ---------- */
.legal{ max-width:820px; }
.legal h2{ font-size:clamp(1.2rem,.8vw + 1rem,1.5rem); margin-top:2.2em; }
.legal h2:first-of-type{ margin-top:0; }
.legal ul{ padding-left:1.1em; margin:0 0 1.15em; }
.legal li{ margin-bottom:.5em; }
.legal__meta{ font-size:.85rem; color:rgba(46,46,46,.62); border-bottom:1px solid var(--rule); padding-bottom:1.4em; margin-bottom:2.4em; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--jb-green-dk); color:rgba(244,239,235,.8); padding:clamp(44px,5vw,72px) 0 26px; }
.site-footer a{ color:rgba(244,239,235,.8); transition:color .2s; }
.site-footer a:hover{ color:var(--gold); }
.footer__top{ display:flex; flex-wrap:wrap; gap:32px; justify-content:space-between; align-items:flex-start; padding-bottom:32px; border-bottom:1px solid var(--rule-light); }
.footer__brand img{ height:96px; width:auto; }
.footer__nav{ display:flex; flex-wrap:wrap; gap:clamp(14px,2.2vw,32px); font-size:.92rem; align-items:center; }
.footer__bottom{ display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; padding-top:20px; font-size:.8rem; color:rgba(244,239,235,.5); }
.footer__bottom a{ color:rgba(244,239,235,.5); }
.li-badge{ display:inline-flex; align-items:center; gap:.5em; border:1px solid var(--rule-light); padding:.6em 1em; font-size:.85rem; }
.li-badge:hover{ border-color:var(--gold); }
.li-badge svg{ flex:none; }

/* ---------- Motion ---------- */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .85s var(--ease), transform .85s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.1s }
.reveal[data-delay="2"]{ transition-delay:.2s }
.reveal[data-delay="3"]{ transition-delay:.3s }
.drift{ will-change:transform; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
  .home-hero__scroll i{ animation:none; }
}

/* ---------- Utility ---------- */
.center{ text-align:center; }
.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:12px; top:12px; z-index:200; background:var(--gold); color:var(--jb-green-dk); padding:12px 18px; }

/* ---------- Restrained emphasis line ---------- */
.emphasis-line{
  margin-top:1.6em; padding-left:20px; border-left:2px solid var(--gold);
  font-size:1.05rem; font-weight:600; letter-spacing:-0.005em; color:var(--jb-green);
}
.bg-green .emphasis-line, .bg-green-dk .emphasis-line, .bg-bordeaux .emphasis-line{ color:var(--linen); }

/* ---------- Experience band subheads ---------- */
.band__sub{
  font-family:var(--serif); font-size:clamp(1.05rem,.7vw + .85rem,1.3rem);
  color:var(--gold); margin:-.35em 0 1em;
}

/* ---------- Portrait band (Corporate) ---------- */
.band--portrait{ grid-template-columns:minmax(0,58%) minmax(0,42%); align-items:center; }
.band--portrait .band__media{ order:2; padding:clamp(28px,3.4vw,56px) clamp(28px,3.4vw,56px) clamp(28px,3.4vw,56px) 0; }
.band--portrait .band__media img{ aspect-ratio:4/5; object-fit:cover; object-position:center 18%; height:auto; }
.band--portrait .band__copy{ padding:clamp(36px,5vw,84px) clamp(36px,4.5vw,80px); }
@media (max-width:860px){
  .band--portrait{ grid-template-columns:1fr; }
  .band--portrait .band__media{ order:0; padding:clamp(24px,5vw,40px) clamp(24px,5vw,40px) 0; }
  .band--portrait .band__media img{ aspect-ratio:4/5; max-height:62vh; margin:0 auto; width:auto; max-width:100%; }
}

/* ---------- About: life-in-wine editorial ---------- */
.life{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.72fr); gap:clamp(28px,4.5vw,72px); align-items:start; }
.life__media img{ width:100%; aspect-ratio:3/4; object-fit:cover; }
.life h3{ margin-top:2em; font-size:1.15rem; color:var(--gold); }
.life h3:first-of-type{ margin-top:0; }
.bg-linen .life h3, .bg-white .life h3{ color:var(--jb-green); }
@media (max-width:860px){ .life{ grid-template-columns:1fr; } .life__media img{ aspect-ratio:16/10; } }

.encounter{ padding-top:clamp(32px,4vw,56px); border-top:1px solid var(--rule); margin-top:clamp(32px,4vw,56px); }
.encounter:first-of-type{ border-top:0; padding-top:0; margin-top:0; }
.bg-green .encounter, .bg-green-dk .encounter{ border-color:var(--rule-light); }

/* ---------- Closing invitation quote ---------- */
.closing-quote{ margin:2.2rem auto 0; max-width:34ch; }
.closing-quote blockquote{
  margin:0; font-family:var(--serif); font-size:clamp(1.2rem,1vw + .95rem,1.55rem);
  line-height:1.36; color:var(--jb-green);
}
.closing-quote figcaption{
  margin-top:.9em; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold);
}

/* ---------- Footer location ---------- */
.footer__place{
  margin:.6em 0 0; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(244,239,235,.55);
}