/* Image-led editorial direction: warm paper, forest ink, documentary photography. */
.story-home { --max-width: 1320px; --bg:#f8f6f0; --text:#29382e; --text-secondary:#5f665d; --gold:#354d3b; --border:#d6d8cd; --motion-ease:cubic-bezier(.16,1,.3,1); }
.story-home h1, .story-home h2, .story-home h3 { font-weight:400; letter-spacing:-.045em; text-wrap:balance; }
.story-home h1 em, .story-home h2 em { font-weight:400; }
.story-home .container { padding-inline:52px; }
.story-home .navbar { background:rgba(248,246,240,.97); border-bottom:1px solid #d6d8cd; }
.story-home .navbar__inner { gap:24px; max-width:1600px; padding-inline:52px; }
.story-home .navbar__links { gap:32px; margin-left:auto; margin-right:32px; }
.story-home .navbar__logo { font-size:26px; letter-spacing:-.045em; gap:10px; }
.brand-mark { display:grid; place-items:center; width:30px; height:33px; background:var(--gold); color:var(--bg); border-radius:2px; font:italic 27px Georgia,serif; }
.story-home .btn { border-radius:2px; font-weight:400; letter-spacing:0; }
.eyebrow { font:500 .68rem/1.6 var(--font-sans); letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.story-hero { display:grid; grid-template-columns:44% 56%; max-width:1600px; margin:72px auto 0; min-height:650px; }
.story-hero__copy { align-self:center; padding:64px 32px 64px 52px; }
.story-hero__copy .eyebrow { display:flex; align-items:center; gap:12px; letter-spacing:.12em; }
.little-star { font-size:22px; line-height:1; }
.story-hero h1 { font-size:clamp(3.25rem,5.25vw,5.2rem); line-height:1.04; margin:25px 0; letter-spacing:-.055em; text-wrap:initial; }
.story-hero h1 em { color:#637259; }
.story-intro { max-width:370px; font-size:.98rem; line-height:1.8; color:var(--text-secondary); margin-bottom:28px; }
.story-hero .hero-start { display:inline-flex; gap:22px; font-size:.88rem; padding:16px 22px; }
.ui-arrow { width:20px; height:20px; flex:0 0 auto; transition:transform .35s var(--motion-ease); }
.hero-start:hover .ui-arrow { transform:translateX(4px); }
.hero-example { display:flex; width:fit-content; align-items:center; gap:24px; margin-top:18px; font-size:.85rem; text-decoration:underline; text-underline-offset:5px; text-decoration-color:#96a18c; }
.hero-example:hover { text-decoration-color:var(--text); }
.story-hero__note { margin-top:27px; color:var(--text-secondary); font-size:.73rem; }
.resume-story { display:block; width:fit-content; margin-top:15px; text-decoration:underline; font-size:.85rem; }
.hero-photograph { position:relative; min-width:0; min-height:650px; margin:22px 22px 22px 0; }
.hero-photograph > img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:51% 50%; }
.hero-photograph figcaption { position:absolute; bottom:0; inset-inline:0; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:65px 27px 23px; color:#fffef6; background:linear-gradient(transparent,rgba(18,24,16,.65)); font:italic 1.15rem/1.4 Georgia,serif; }
.hero-photograph .photo-index { font:400 .56rem/1.5 var(--font-sans); letter-spacing:.1em; white-space:nowrap; }
.story-strip { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:26px; border-bottom:1px solid var(--border); font-size:.78rem; }
.story-strip > span { font-size:.64rem; text-transform:uppercase; letter-spacing:.12em; }
.story-strip p { color:var(--text-secondary); }
.story-strip p span { padding-inline:15px; }
.story-strip a { display:flex; gap:20px; }
.story-strip a:hover { text-decoration:underline; text-underline-offset:5px; }
.collection { padding-block:94px 104px; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:36px; margin-bottom:44px; }
.section-heading h2, .process-heading h2, .story-faq h2 { font-size:clamp(2.4rem,3.6vw,3.6rem); line-height:1.12; margin-top:16px; }
.section-heading > p { color:var(--text-secondary); font-size:.94rem; margin-right:35px; line-height:1.8; }
.story-choices { display:grid; grid-template-columns:1.18fr 1fr .9fr; gap:30px; align-items:start; }
.choice-celebration { margin-top:50px; }
.choice-remembrance { margin-top:100px; }
.choice-image { position:relative; overflow:hidden; background:#e3e5dc; }
.choice-image img { width:100%; height:100%; object-fit:cover; transition:transform .8s var(--motion-ease); }
.choice-family .choice-image { aspect-ratio:4/4.5; }
.choice-family img { object-position:50% 42%; }
.choice-celebration .choice-image { aspect-ratio:4/4.7; }
.choice-remembrance .choice-image { aspect-ratio:4/4.8; }
.choice-remembrance img { object-position:22% 50%; }
.image-label { position:absolute; inset:auto 20px 20px; color:white; font:italic 1.6rem Georgia,serif; text-shadow:0 2px 12px #132013; }
.choice-title { position:relative; padding-top:19px; }
.choice-number { font-size:.6rem; letter-spacing:.13em; }
.choice-title h3 { margin:6px 30px 10px 0; font-size:clamp(1.55rem,2.2vw,2.2rem); line-height:1.2; }
.choice-arrow { position:absolute; right:0; bottom:9px; display:grid; place-items:center; width:30px; height:30px; font-size:1.4rem; transition:transform .35s; }
.story-choice > p { color:var(--text-secondary); font-size:.88rem; line-height:1.65; max-width:33ch; }
.story-choice:hover .choice-arrow { transform:translate(3px,-3px); }
@media (hover:hover) { .story-choice:hover img { transform:scale(1.035); } }
.book-feature { display:grid; grid-template-columns:59% 41%; background:#293d30; color:#e8e9db; }
.book-feature__image { position:relative; min-height:660px; }
.book-feature__image img { position:absolute; width:100%; height:100%; object-fit:cover; object-position:48% 50%; }
.book-feature__image figcaption { position:absolute; inset:auto 0 0; padding:50px 28px 20px; background:linear-gradient(transparent,#1d291a99); color:#fff; font-size:.67rem; }
.book-feature__copy { padding:78px clamp(35px,5vw,90px); align-self:center; }
.book-feature__copy .eyebrow { color:#c2c9b5; }
.book-feature h2 { color:#f7f5eb; font-size:clamp(2.5rem,3.8vw,4rem); line-height:1.08; margin:24px 0; }
.book-feature h2 em { color:#ccd4b8; }
.book-feature__copy > p:not(.eyebrow) { max-width:32ch; font-size:.94rem; line-height:1.85; color:#c9d0c3; }
.text-link { display:inline-flex; gap:20px; padding-bottom:8px; margin-top:26px; border-bottom:1px solid #84917e; font-size:.88rem; }
.text-link:hover { border-color:#f7f5eb; }
.feature-footnote { display:block; margin-top:33px; color:#bac5b5; font-size:.68rem; line-height:1.75; }
.process-section { display:grid; grid-template-columns:1fr 1fr; gap:100px; padding-block:105px; }
.process-heading h2 { font-size:clamp(2.3rem,3.2vw,3.1rem); }
.process-heading > p:not(.eyebrow) { max-width:370px; color:var(--text-secondary); font-size:.93rem; margin-top:22px; }
.memory-detail { width:255px; margin-top:36px; }
.memory-detail img { width:100%; aspect-ratio:1.6; object-fit:cover; object-position:15% 50%; }
.memory-detail figcaption { font:italic .85rem/1.5 Georgia,serif; margin-top:12px; color:var(--text-secondary); }
.process-list { margin:0; align-self:center; }
.process-list li { display:grid; grid-template-columns:40px 1fr; gap:22px; padding:30px 0; border-top:1px solid var(--border); }
.process-list li:last-child { border-bottom:1px solid var(--border); }
.step-number { font:italic 1.4rem Georgia,serif; color:#75816a; padding-top:4px; }
.process-list h3 { font-size:1.65rem; letter-spacing:-.025em; margin-bottom:12px; }
.process-list p { color:var(--text-secondary); font-size:.91rem; line-height:1.8; max-width:39ch; }
.story-faq { display:grid; grid-template-columns:1fr 1.2fr; gap:100px; padding-block:25px 100px; }
.story-faq h2 { font-size:2.75rem; }
.story-faq details { border-bottom:1px solid var(--border); }
.story-faq details:first-child { border-top:1px solid var(--border); }
.story-faq summary { position:relative; list-style:none; padding:24px 34px 24px 0; font-size:.94rem; line-height:1.5; cursor:pointer; }
.story-faq summary::-webkit-details-marker { display:none; }
.story-faq summary::after { content:'+'; position:absolute; right:3px; top:20px; font:400 1.5rem var(--font-sans); }
.story-faq details[open] summary::after { content:'−'; }
.story-faq details p { max-width:55ch; padding:0 28px 24px 0; font-size:.88rem; color:var(--text-secondary); line-height:1.8; }
.closing-note { text-align:center; background:#e9ecdf; padding-block:75px; }
.closing-note h2 { font-size:clamp(2.6rem,4.5vw,4.5rem); line-height:1.1; margin:20px 0 28px; }
.closing-note .btn { padding:16px 26px; gap:35px; }
.closing-note .container > p:last-child { color:var(--text-secondary); font-size:.76rem; margin-top:18px; }
.story-footer { padding-block:48px 25px; }
.footer-top { display:flex; align-items:center; gap:50px; padding-bottom:40px; }
.footer-brand { font:400 clamp(2.5rem,4vw,4rem)/1 Georgia,serif; letter-spacing:-.06em; }
.footer-brand span { color:#8a9a78; }
.footer-top > p { color:var(--text-secondary); font-size:.8rem; line-height:1.55; }
.footer-top > div { margin-left:auto; display:flex; gap:25px; font-size:.8rem; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--border); padding-top:24px; font-size:.64rem; color:var(--text-secondary); }
.story-footer a:hover { text-decoration:underline; text-underline-offset:5px; }
@media (prefers-reduced-motion:no-preference) {
  .story-hero__copy { animation:story-arrive .8s var(--motion-ease) both; }
  .hero-photograph { animation:story-arrive 1s var(--motion-ease) .1s both; }
  @keyframes story-arrive { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
}
@media (min-width:1600px) { .story-hero__copy { padding-left:80px; } }
@media (max-width:1100px) {
  .story-home .container,.story-home .navbar__inner { padding-inline:32px; }
  .story-home .navbar__links { gap:20px; margin-right:0; }
  .story-hero__copy { padding-left:32px; }
  .story-hero h1 { font-size:4.9vw; }
  .hero-photograph { min-height:600px; margin-right:16px; }
  .hero-photograph figcaption { padding-inline:20px; font-size:1rem; }
  .hero-photograph .photo-index { display:none; }
  .story-strip { gap:18px; font-size:.7rem; }
  .story-strip p span { padding-inline:8px; }
  .story-choices { gap:22px; }
  .section-heading > p { margin-right:0; }
  .book-feature__copy { padding:50px 32px; }
  .book-feature__image { min-height:590px; }
  .process-section,.story-faq { gap:55px; }
}
@media (max-width:767px) {
  .story-home .container,.story-home .navbar__inner { padding-inline:24px; }
  .story-home .navbar__logo { font-size:24px; }
  .story-hero { grid-template-columns:1fr; margin-top:64px; min-height:0; }
  .story-hero__copy { padding:42px 24px 32px; }
  .story-hero__copy .eyebrow { font-size:.61rem; gap:9px; letter-spacing:.11em; }
  .story-hero h1 { font-size:clamp(2.95rem,9.5vw,4.4rem); margin:19px 0; }
  .story-hero h1 br:first-child { display:none; }
  .story-intro { max-width:470px; font-size:.92rem; line-height:1.7; margin-bottom:24px; }
  .story-hero .hero-start { font-size:.85rem; gap:20px; }
  .hero-example { display:inline-flex; margin:16px 0 0 18px; font-size:.8rem; gap:8px; }
  .story-hero__note { margin-top:20px; font-size:.7rem; }
  .hero-photograph { margin:0 16px; min-height:0; aspect-ratio:1.15; }
  .hero-photograph img { object-position:50% 50%; }
  .hero-photograph figcaption { font-size:.95rem; padding:45px 18px 18px; }
  .story-strip { justify-content:center; flex-wrap:wrap; gap:9px; padding-block:22px; text-align:center; }
  .story-strip > span { flex-basis:100%; font-size:.58rem; }
  .story-strip p { font-size:.7rem; }
  .story-strip > a { display:none; }
  .collection { padding-block:55px 60px; }
  .section-heading { display:block; margin-bottom:30px; }
  .section-heading h2 { font-size:2.55rem; }
  .section-heading > p { font-size:.9rem; margin-top:20px; max-width:31ch; }
  .section-heading > p br { display:none; }
  .story-choices { grid-template-columns:1fr; gap:35px; }
  .choice-celebration,.choice-remembrance { margin-top:0; }
  .choice-family .choice-image { aspect-ratio:1.05; }
  .choice-celebration .choice-image { aspect-ratio:1.1; }
  .choice-remembrance .choice-image { aspect-ratio:1.3; }
  .choice-remembrance img { object-position:50% 45%; }
  .choice-title h3 { font-size:1.9rem; }
  .story-choice > p { max-width:39ch; }
  .book-feature { grid-template-columns:1fr; }
  .book-feature__image { min-height:0; aspect-ratio:1.1; }
  .book-feature__image figcaption { font-size:.6rem; padding-inline:20px; }
  .book-feature__copy { padding:44px 24px 48px; }
  .book-feature h2 { font-size:2.9rem; }
  .book-feature h2 br { display:none; }
  .book-feature h2 em { display:block; }
  .book-feature__copy > p:not(.eyebrow) { max-width:42ch; }
  .feature-footnote { margin-top:24px; }
  .process-section { grid-template-columns:1fr; gap:30px; padding-block:56px; }
  .process-heading h2 { font-size:2.35rem; }
  .memory-detail { display:none; }
  .process-list li { padding-block:25px; gap:15px; grid-template-columns:30px 1fr; }
  .process-list h3 { font-size:1.5rem; }
  .story-faq { grid-template-columns:1fr; gap:28px; padding-block:12px 60px; }
  .story-faq h2 { font-size:2.4rem; }
  .story-faq h2 br { display:none; }
  .story-faq summary { font-size:.9rem; }
  .closing-note { padding-block:55px; }
  .closing-note h2 { font-size:2.65rem; }
  .footer-top { flex-wrap:wrap; gap:25px; padding-bottom:28px; }
  .footer-top > p { margin-left:auto; font-size:.73rem; }
  .footer-top > div { margin-left:0; flex-basis:100%; }
  .footer-bottom { flex-wrap:wrap; gap:10px; }
  .footer-bottom > span:nth-child(2) { margin-left:auto; }
  .footer-bottom > span:last-child { flex-basis:100%; }
}
@media (max-width:420px) {
  .hero-example { margin-left:0; display:flex; }
  .story-hero h1 { font-size:11vw; }
  .story-hero h1 br:first-child { display:block; }
  .story-hero__copy { padding-top:34px; }
  .story-hero__note { display:none; }
  .footer-brand { font-size:2.5rem; }
}
