:root {
  --paper:#f7f2ed; --warm:#ece3d8; --ink:#3e332f; --rose:#a67a74;
  --muted:#75665e; --line:#d7c9bd; --copper:#a77f6b;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth}
body {margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}
img {display:block;width:100%;height:100%;object-fit:cover}
a {color:inherit;text-decoration:none}
p,h1,h2,figure {margin:0}
h1,h2 {font-family:'Cormorant Garamond',serif;font-weight:400}
em {font-weight:300}
::selection {background:#d5b5a8;color:#352923}
.skip {position:absolute;left:12px;top:-80px;background:#fff;padding:12px;z-index:30}
.skip:focus {top:12px}
:focus-visible {outline:2px solid #a47c72;outline-offset:5px}

/* Quiet editorial masthead */
.site-nav {height:79px;display:flex;align-items:center;justify-content:space-between;padding:0 5.4%;border-bottom:1px solid var(--line)}
.brand {display:flex;align-items:center;gap:17px;font-size:10px;letter-spacing:2px;font-weight:500}
.brand-symbol {font:italic 48px/.75 'Cormorant Garamond',serif;letter-spacing:-3px}
.header-center {font:italic 23px 'Cormorant Garamond',serif;color:#87756b}
.header-right {display:flex;align-items:center;gap:18px;font-size:9px;letter-spacing:1.8px;font-weight:500}
.botanical-mark {width:31px;height:38px;color:#a68071}

/* A short opening like the first page of a personal photo album */
.hero {position:relative;max-width:1680px;margin:0 auto;display:grid;grid-template-columns:47% 53%;min-height:760px;padding:60px 6% 84px}
.hero-words {align-self:center;position:relative;z-index:3;padding-right:0}
.eyebrow {font-size:10px;letter-spacing:2.3px;font-weight:500;color:#956f64}
.rule {width:27px;height:1px;background:#a07b6c;margin-right:13px;display:inline-block;vertical-align:middle}
.hero h1 {font-size:clamp(83px,8.4vw,135px);line-height:.80;letter-spacing:-4px;margin:47px 0 37px;white-space:nowrap}
.hero h1 em {color:var(--rose)}
.hero-description {display:flex;gap:16px;align-items:start;max-width:440px}
.description-line {width:29px;height:1px;background:var(--copper);flex:none;margin-top:12px}
.hero-description p {font-size:13px;font-weight:300;line-height:1.95;color:var(--muted)}
.hero-description strong {font-weight:500;color:#5b4944}
.watch-cta {display:inline-flex;align-items:center;gap:30px;margin:30px 0 0 44px;padding:0 0 10px;border-bottom:1px solid #a68977;font-size:10px;letter-spacing:1.9px;font-weight:500;transition:border-color .2s,color .2s}
.watch-cta:hover {color:#9b6d66;border-color:#9b6d66}
.cta-arrow {width:36px;height:20px;transition:transform .3s}
.watch-cta:hover .cta-arrow {transform:translateX(6px)}
.written-by {margin:32px 0 0 44px;max-width:395px;font:italic 25px/1.15 'Cormorant Garamond',serif;color:#a27b70}
.hero-collage {height:640px;position:relative;align-self:center;min-width:0}
.photo-main,.photo-hike,.photo-stand {position:absolute;background:#fffcf8;padding:7px;box-shadow:0 16px 38px #5f483e27}
.photo-main {top:1%;left:10%;width:57%;height:80%;z-index:2;transform:rotate(-2.6deg)}
.photo-main img {object-position:center 48%}
.photo-main figcaption {position:absolute;bottom:14px;left:21px;color:#fff;text-shadow:0 1px 8px #271e1da6;font:italic 29px 'Cormorant Garamond',serif}
.photo-hike {top:16%;right:1%;width:45%;height:58%;z-index:3;transform:rotate(4.8deg)}
.photo-hike img {object-position:center 43%}
.photo-hike figcaption {position:absolute;bottom:13px;left:17px;color:#fff;text-shadow:0 1px 7px #271e1d99;font:italic 22px 'Cormorant Garamond',serif}
.photo-stand {bottom:0;left:22%;height:40%;width:34%;transform:rotate(3deg);z-index:4}
.photo-stand img {object-position:50% 40%}
.editorial-tag {position:absolute;right:0;bottom:5%;width:152px;z-index:5;display:flex;flex-direction:column;align-items:center;text-align:center;padding:16px 8px 10px;background:var(--paper);box-shadow:0 6px 18px #5842370f;transform:rotate(-3deg)}
.tag-small {font-size:8px;letter-spacing:2px;color:#8d7062}
.tag-script {font:italic 28px/.92 'Cormorant Garamond',serif;color:#886c63;margin:9px 0 11px}
.tag-line {width:30px;height:1px;background:#ad9082}
.hero-side-note {position:absolute;right:-31px;top:11%;writing-mode:vertical-rl;letter-spacing:2px;font-size:8px;color:#ab8b7f}
.hero-bottom-rule {position:absolute;left:6%;right:6%;bottom:34px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:15px;border-top:1px solid #d8c9bb;color:#988273;font-size:9px;letter-spacing:1.6px}
.section-ornament {width:46px;height:21px;color:#b48b78;flex:none}

/* The film is the second and final chapter — vertical, never letterboxed in a horizontal iframe */
.video-section {background:var(--warm);padding:94px 6% 70px;text-align:center}
.video-header {max-width:790px;margin:0 auto 49px}
.video-header h2 {font-size:clamp(58px,7.1vw,105px);line-height:.88;letter-spacing:-2px;margin:20px 0 21px}
.video-header h2 em {color:var(--rose)}
.video-header>p:last-child {max-width:560px;margin:auto;font:25px/1.35 'Cormorant Garamond',serif;color:#756359}
.film-wrap {max-width:1020px;margin:auto;display:grid;grid-template-columns:1fr 430px 1fr;align-items:center;column-gap:26px}
.film-side-note {display:flex;flex-direction:column;align-self:stretch;justify-content:center;align-items:end;gap:19px;color:#9c8678;font-size:9px;letter-spacing:2px}
.film-side-note>i {height:91px;width:1px;background:#bda596}
.video-portrait-frame {width:100%;padding:13px 13px 15px;background:#fbf8f3;border:1px solid #ddcec0;box-shadow:0 25px 58px #57493d21}
.portrait-topline,.portrait-bottomline {display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;color:#88766b;font-size:8px;font-weight:500;letter-spacing:1.4px}
.portrait-topline {padding:3px 5px 13px}
.portrait-bottomline {padding:15px 5px 2px}
.video-ratio {position:relative;aspect-ratio:9 / 16;background:#211f1e;overflow:hidden}
.video-ratio iframe {position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.film-margin-copy {font:24px/1.08 'Cormorant Garamond',serif;text-align:left;color:#8b7569}
.film-margin-copy em {display:inline-block;font-size:34px;color:#a07871;margin-top:6px}
.goodbye {max-width:700px;margin:64px auto 0}
.goodbye-line {height:1px;width:45px;background:#ab8c7b;margin:0 auto 22px}
.goodbye>p:first-of-type {font:37px/1.16 'Cormorant Garamond',serif}
.goodbye em {color:#a47970}
.goodbye .closing-micro {max-width:480px;margin:20px auto 0;font:21px/1.28 'Cormorant Garamond',serif;color:#806d61}

/* Tablet */
@media(max-width:1120px) {
  .hero {grid-template-columns:49% 51%;padding:60px 4% 84px;min-height:720px}
  .hero h1 {font-size:clamp(72px,8.2vw,108px);letter-spacing:-3px}
  .hero-collage {height:578px}
  .hero-side-note {right:-20px}
  .editorial-tag {width:132px;bottom:4%}
  .tag-script {font-size:25px}
  .hero-bottom-rule {left:4%;right:4%}
  .film-wrap {grid-template-columns:1fr 400px 1fr;gap:12px}
}
/* Mobile is composed, not merely scaled */
@media(max-width:740px) {
  .site-nav {height:69px;padding:0 6%}
  .brand {gap:10px;letter-spacing:1.4px;font-size:9px}
  .brand-symbol {font-size:43px}
  .header-center {display:none}
  .header-right {gap:8px;font-size:8px;letter-spacing:.6px}
  .botanical-mark {width:27px;height:30px}
  .hero {display:block;min-height:0;padding:65px 7% 69px}
  .hero-words {padding-right:0}
  .hero h1 {font-size:clamp(66px,13.4vw,101px);letter-spacing:-2.5px;margin:27px 0 34px;white-space:normal}
  .hero-description {max-width:100%;gap:12px}
  .hero-description p {font-size:12px;line-height:1.8}
  .description-line {width:19px}
  .watch-cta {margin:28px 0 0 31px;font-size:9px;gap:24px}
  .cta-arrow {width:30px}
  .written-by {margin:24px 0 0 31px;font-size:23px}
  .hero-collage {height:440px;margin-top:48px;max-width:100%}
  .photo-main {top:1%;left:5%;width:61%;height:82%}
  .photo-main figcaption {font-size:21px}
  .photo-hike {top:13%;right:0;width:47%;height:58%}
  .photo-hike figcaption {font-size:16px}
  .photo-stand {left:21%;height:38%;width:36%;bottom:0}
  .editorial-tag {right:0;bottom:3%;width:99px;padding:9px 5px}
  .tag-small {font-size:7px;letter-spacing:1px}
  .tag-script {font-size:22px}
  .hero-side-note {display:none}
  .hero-bottom-rule {left:7%;right:7%;bottom:22px;gap:5px;font-size:7px;letter-spacing:.5px}
  .section-ornament {width:28px}
  .video-section {padding:69px 5% 51px}
  .video-header {margin-bottom:33px}
  .video-header h2 {font-size:clamp(57px,10.8vw,76px);letter-spacing:-1px}
  .video-header>p:last-child {font-size:21px}
  .film-wrap {display:flex;justify-content:center}
  .film-side-note,.film-margin-copy {display:none}
  .video-portrait-frame {max-width:410px;padding:10px 10px 12px}
  .portrait-topline,.portrait-bottomline {font-size:7px;letter-spacing:1px}
  .portrait-topline {padding:3px 4px 10px}
  .portrait-bottomline {padding:12px 4px 1px}
  .goodbye {margin-top:48px}
  .goodbye>p:first-of-type {font-size:32px}
  .goodbye .closing-micro {font-size:20px}
}
@media(max-width:390px) {
  .hero h1 {font-size:clamp(55px,13.1vw,68px);letter-spacing:-1.9px}
  .hero-collage {height:395px}
  .editorial-tag {width:89px}
  .tag-script {font-size:20px}
  .hero-bottom-rule {font-size:6px}
  .header-right span {max-width:110px}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {scroll-behavior:auto!important;transition:none!important}
}