/* ========================================
   SUN OCEAN HACHIJO ─ LP Sample Stylesheet
   Concept: Tokyo Blue, 55 min.
   Palette : Hachijo Blue + 太平洋 + 八丈富士の緑
   ======================================== */

:root{
  --blue-fv: #0a5cb8;
  --blue-deep: #073d80;
  --blue-bright: #1576d6;
  --blue-coast: #5fc8ff;
  --blue-pale: #e6f3ff;
  --ink: #0c2240;
  --night: #050a1a;
  --sand: #f6efe2;
  --wood: #2b1c12;
  --cream: #fbf8f1;
  --line: rgba(255,255,255,.4);
  --maxw: 1100px;
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin:0; padding:0;
  width:100%; max-width:100%;
  overflow-x: hidden;
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word;
  background: var(--night);
  color: #fff;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  font-family: "Shippori Mincho","Hiragino Mincho ProN",serif;
}

* { max-width: 100%; }
img, video, iframe { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4, h5, h6,
.scene-title, .fv-title, .info-title {
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word;
  margin: 0;
  font-weight: 400;
}

a { color: inherit; text-decoration: none; }

.nobreak { display: inline-block; white-space: nowrap; }

/* ========================================
   HEADER
   ======================================== */
.site-header{
  position: fixed; top:0; left:0; right:0;
  z-index: 100;
  display:flex; justify-content:space-between; align-items:center;
  padding: 14px 22px;
  background: linear-gradient(180deg, rgba(7,61,128,.65), rgba(7,61,128,0));
  pointer-events: none;
}
.brand{
  display:flex; align-items:center; gap:10px;
  pointer-events: auto;
}
.brand-mark{
  width:38px; height:38px;
  border:1.5px solid #fff;
  display:flex; align-items:center; justify-content:center;
  font-family:"Cormorant Garamond",serif;
  font-size:16px; letter-spacing:1px;
  color:#fff;
}
.brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.brand-en{
  font-family:"Cormorant Garamond",serif;
  font-size:14px; letter-spacing:.22em; color:#fff;
}
.brand-ja{
  font-size:10px; letter-spacing:.18em; color:#dceaff; margin-top:2px;
}
.lang-switcher{
  pointer-events:auto;
  display:flex; gap:4px;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.25);
}
.lang-btn{
  appearance:none; border:none; background:transparent;
  color:#fff; font-family:"Inter",sans-serif;
  font-size:11px; letter-spacing:.06em;
  padding: 6px 10px;
  border-radius: 999px;
  cursor: pointer;
  transition: all .25s;
}
.lang-btn.active{
  background:#fff; color: var(--blue-deep);
  font-weight:600;
}
.lang-btn:not(.active):hover{ background: rgba(255,255,255,.18); }

/* ========================================
   SCENE  base
   ======================================== */
.scene{
  position: relative;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  display: flex; align-items: center;
  padding: 80px 24px;
}
.bg-img{
  position:absolute; inset:0;
  background-position: center; background-size: cover; background-repeat: no-repeat;
  z-index: 0;
  transform: scale(1.06);
  transition: transform 1.4s ease, opacity 1.2s ease;
  opacity: .92;
}
.scene.in-view .bg-img{ transform: scale(1); opacity:1; }
.bg-tint{
  position:absolute; inset:0; z-index:1;
}

/* Tints */
.fv-tint{
  background: linear-gradient(180deg, rgba(7,61,128,.35) 0%, rgba(7,61,128,.55) 65%, rgba(5,15,38,.85) 100%);
}
.blue-deep-tint{
  background: linear-gradient(180deg, rgba(7,61,128,.55), rgba(5,30,80,.75) 70%, rgba(5,15,38,.85));
}
.blue-bright-tint{
  background: linear-gradient(180deg, rgba(21,118,214,.35), rgba(7,61,128,.55) 70%, rgba(7,61,128,.85));
}
.wood-tint{
  background: linear-gradient(180deg, rgba(20,8,2,.6), rgba(43,28,18,.7) 60%, rgba(7,61,128,.6));
}
.sky-tint{
  background: linear-gradient(180deg, rgba(95,200,255,.25) 0%, rgba(7,61,128,.55) 75%, rgba(5,15,38,.75));
}
.night-tint{
  background: linear-gradient(180deg, rgba(5,10,26,.78) 0%, rgba(5,10,26,.62) 50%, rgba(5,10,26,.88) 100%);
}
.info-tint{
  background: linear-gradient(180deg, rgba(7,61,128,.78), rgba(5,15,38,.92));
}

.scene-inner{
  position:relative; z-index:2;
  width:100%; max-width: var(--maxw);
  margin: 0 auto;
  opacity: 0; transform: translateY(40px);
  transition: opacity 1.1s ease .15s, transform 1.1s ease .15s;
}
.scene.in-view .scene-inner{ opacity: 1; transform: translateY(0); }

.align-left .scene-inner{ margin-left: 4%; margin-right: auto; max-width: 720px; }
.align-right .scene-inner{ margin-right: 4%; margin-left: auto; max-width: 720px; text-align: right; }
.align-right .scene-inner .mini-gallery{ justify-content: flex-end; }
.align-right .scene-inner .key-line,
.align-right .scene-inner .house-stat,
.align-right .scene-inner .sauna-line,
.align-right .scene-inner .whale-line{ justify-content: flex-end; }
.align-center .scene-inner{ text-align: center; }
.align-center .house-stat,
.align-center .whale-line{ justify-content: center; }

.scene-no{
  font-family:"Cormorant Garamond",serif;
  font-size: 13px; letter-spacing: .35em;
  color: rgba(255,255,255,.7);
  margin-bottom: 14px;
}
.scene-label{
  font-family:"Inter",sans-serif;
  font-size: 11px; letter-spacing: .3em;
  color: var(--blue-coast);
  margin-bottom: 30px;
  text-transform: uppercase;
}
.scene-title{
  font-size: clamp(28px, 4.6vw, 50px);
  line-height: 1.55;
  letter-spacing: .04em;
  color:#fff;
  margin-bottom: 30px;
  text-shadow: 0 2px 30px rgba(0,0,0,.3);
}
.scene-body{
  font-size: 15px;
  line-height: 2.1;
  letter-spacing: .04em;
  color: #f0f6ff;
  margin: 0 0 30px;
  max-width: 540px;
}
.align-right .scene-body{ margin-left: auto; }
.align-center .scene-body{ margin: 0 auto 30px; }

.num{
  font-family:"Cormorant Garamond",serif;
  font-size: 1.4em;
  color: var(--blue-coast);
  font-weight: 500;
  padding: 0 4px;
}

/* ========================================
   FV
   ======================================== */
.fv{
  align-items: stretch;
  padding: 0;
}
.fv .bg-img{ opacity: 1; transform: scale(1.08); animation: kenburns 24s ease-out infinite alternate; }
@keyframes kenburns{
  from{ transform: scale(1.08); }
  to{ transform: scale(1.18); }
}
.fv-inner{
  position:relative; z-index:2;
  width:100%; max-width: var(--maxw);
  margin: auto;
  padding: 110px 28px 60px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  color:#fff;
}
.fv-eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Inter",sans-serif;
  font-size: 11px; letter-spacing:.3em;
  color: #fff;
  margin-bottom: 28px;
  opacity: 0;
  animation: fadeUp 1.4s .3s forwards;
}
.fv-eyebrow .line{ width: 50px; height:1px; background: rgba(255,255,255,.6); display:inline-block; }
.fv-title{
  font-size: clamp(34px, 6.5vw, 76px);
  line-height: 1.45;
  letter-spacing: .06em;
  color:#fff;
  text-shadow: 0 4px 40px rgba(0,0,0,.4);
  margin-bottom: 26px;
  opacity:0; animation: fadeUp 1.6s .55s forwards;
}
.fv-jp{ display:block; }
.fv-en{
  display:block;
  font-family:"Cormorant Garamond",serif;
  font-weight: 300;
  font-style: italic;
  font-size: .42em;
  letter-spacing: .18em;
  color: var(--blue-coast);
  margin-top: 18px;
}
.fv-sub{
  font-size: 14px;
  line-height: 2.1;
  letter-spacing: .06em;
  color: #f0f6ff;
  margin: 0 0 44px;
  opacity:0; animation: fadeUp 1.6s .8s forwards;
}
.fv-sub .num{ font-size: 1.6em; }
.fv-meta{
  display:flex; gap: 30px;
  font-family:"Inter",sans-serif;
  font-size: 11px;
  color: #fff;
  letter-spacing:.06em;
  opacity:0; animation: fadeUp 1.6s 1s forwards;
  flex-wrap: wrap; justify-content: center;
}
.fv-meta > div{ display:flex; flex-direction:column; align-items:center; gap:4px; }
.fv-meta span{ font-size:9px; letter-spacing:.3em; color: var(--blue-coast); }
.scroll-cue{
  position:absolute; bottom: 28px; left:50%; transform: translateX(-50%);
  font-family:"Inter",sans-serif;
  font-size: 10px; letter-spacing:.4em;
  color: rgba(255,255,255,.85);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  opacity:0; animation: fadeUp 1.6s 1.3s forwards;
}
.scroll-cue span{
  width:1px; height: 36px;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,0));
  display:block;
  animation: scrollLine 2.4s ease-in-out infinite;
}
@keyframes scrollLine{
  0%{ transform: scaleY(0); transform-origin: top;}
  50%{ transform: scaleY(1); transform-origin: top;}
  51%{ transform: scaleY(1); transform-origin: bottom;}
  100%{ transform: scaleY(0); transform-origin: bottom;}
}
@keyframes fadeUp{
  from{ opacity:0; transform: translateY(20px); }
  to{ opacity:1; transform: translateY(0); }
}

/* ========================================
   01 ARRIVAL key line
   ======================================== */
.key-line, .house-stat, .sauna-line, .whale-line{
  display:flex; gap:24px;
  flex-wrap:wrap;
  font-family:"Inter",sans-serif;
  color:#fff;
  margin-top: 10px;
}
.key-line > div{
  display:flex; flex-direction:column; gap:4px;
  font-size: 13px;
  letter-spacing: .03em;
  border-left: 1px solid var(--blue-coast);
  padding: 4px 0 4px 14px;
}
.key-line span{
  font-size:9px; letter-spacing:.3em; color: var(--blue-coast);
}

/* HOUSE STAT */
.house-stat{
  gap: 38px;
}
.house-stat > div{
  display:flex; flex-direction:column; align-items:center; gap: 4px;
}
.house-stat b{
  font-family:"Cormorant Garamond",serif;
  font-weight: 400;
  font-size: 46px;
  color: var(--blue-coast);
  line-height: 1;
}
.house-stat span{
  font-size: 11px; letter-spacing:.22em; color:#fff;
}

/* SAUNA LINE */
.sauna-line{
  gap: 24px; margin-top: 8px;
}
.sauna-line > div{
  background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);
  padding: 14px 22px;
  display:flex; flex-direction:column; gap:6px;
}
.sauna-line b{
  font-family:"Cormorant Garamond",serif;
  font-size: 24px; color: var(--blue-coast); font-weight:500;
}
.sauna-line span{
  font-size: 11px; letter-spacing:.18em; color:#fff;
}

/* WHALE LINE */
.whale-line{
  gap: 36px; margin-top: 8px;
}
.whale-line > div{
  display:flex; flex-direction:column; align-items:center; gap:6px;
}
.whale-line b{
  font-family:"Cormorant Garamond",serif;
  font-size: 28px; color: var(--blue-coast); font-weight:500;
}
.whale-line span{
  font-size: 10px; letter-spacing:.22em; color:#fff;
}

/* ========================================
   #01 THREE BLUES — 三つの強み
   ======================================== */
.s-three{
  background: linear-gradient(180deg, #03081a 0%, #062c5e 50%, #073d80 100%);
  min-height: auto;
  padding: 100px 24px 120px;
}
.s-three .bg-solid{ display:none; }
.three-inner{
  text-align: center;
  max-width: 1200px;
}
.three-title{
  font-size: clamp(28px, 4.4vw, 46px);
  margin-bottom: 18px;
}
.three-lead{
  font-family:"Shippori Mincho",serif;
  font-size: 14px;
  line-height: 2;
  color: #cfe1f7;
  margin: 0 auto 56px;
}
.three-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}
.three-card{
  display:block;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.14);
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  text-align: left;
  transition: transform .5s ease, box-shadow .5s ease, border-color .5s ease;
}
.three-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 18px 50px rgba(0,0,0,.45);
  border-color: var(--blue-coast);
}
.tc-img{
  width: 100%;
  aspect-ratio: 4/3;
  background-size: cover;
  background-position: center;
}
.tc-body{
  padding: 22px 22px 26px;
}
.tc-no{
  font-family:"Cormorant Garamond",serif;
  font-size: 14px;
  letter-spacing: .3em;
  color: var(--blue-coast);
  margin-bottom: 12px;
}
.tc-title{
  font-family:"Shippori Mincho",serif;
  font-size: 22px;
  line-height: 1.55;
  letter-spacing: .04em;
  color: #fff;
  margin-bottom: 14px;
}
.tc-text{
  font-family:"Shippori Mincho",serif;
  font-size: 13px;
  line-height: 1.95;
  color: #cfe1f7;
  margin: 0 0 18px;
}
.tc-text .num{ font-size: 1.2em; padding: 0 2px; }
.tc-cta{
  font-family:"Inter",sans-serif;
  font-size: 11px;
  letter-spacing: .25em;
  color: var(--blue-coast);
  border-top: 1px solid rgba(255,255,255,.14);
  padding-top: 14px;
}
.three-foot{
  font-family:"Inter",sans-serif;
  font-size: 11px;
  letter-spacing: .25em;
  color: rgba(255,255,255,.55);
  margin: 30px 0 0;
}

/* ========================================
   SINGLE PHOTO panel (full-bleed inside scene)
   ======================================== */
.single-photo{
  margin-top: 30px;
  max-width: 640px;
  position: relative;
}
.align-right .single-photo{ margin-left: auto; }
.align-center .single-photo{ margin-left: auto; margin-right: auto; }
.single-photo img{
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 14px 40px rgba(0,0,0,.45);
}
.single-photo .caption{
  display:block;
  font-family:"Inter",sans-serif;
  font-size: 10px;
  letter-spacing: .25em;
  color: rgba(255,255,255,.7);
  margin-top: 10px;
  text-transform: uppercase;
}

/* ========================================
   MINI GALLERY (03/04)
   ======================================== */
.mini-gallery{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 24px;
  max-width: 640px;
}
.mini-gallery.two{
  grid-template-columns: repeat(2, 1fr);
  max-width: 540px;
}
.align-right .mini-gallery{ margin-left: auto; }
.mg{
  aspect-ratio: 4/3;
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(255,255,255,.18);
  transition: transform .6s ease;
}
.mini-gallery.six .mg{ aspect-ratio: 1/1; }
.mg:hover{ transform: scale(1.03); }

/* ========================================
   06 NIGHT — stars
   ======================================== */
.s-night .bg-img{ filter: blur(2px) brightness(.55); }
.stars{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:
    radial-gradient(1px 1px at 12% 18%, #fff, transparent 60%),
    radial-gradient(1px 1px at 22% 72%, #fff, transparent 60%),
    radial-gradient(1.2px 1.2px at 38% 32%, #fff, transparent 60%),
    radial-gradient(1px 1px at 52% 14%, #fff, transparent 60%),
    radial-gradient(1.4px 1.4px at 66% 56%, #fff, transparent 60%),
    radial-gradient(1px 1px at 76% 22%, #fff, transparent 60%),
    radial-gradient(1.2px 1.2px at 84% 78%, #fff, transparent 60%),
    radial-gradient(1px 1px at 92% 42%, #fff, transparent 60%),
    radial-gradient(1px 1px at 6% 88%, #fff, transparent 60%),
    radial-gradient(1.5px 1.5px at 44% 84%, #fff, transparent 60%),
    radial-gradient(1px 1px at 28% 48%, #fff, transparent 60%),
    radial-gradient(1.2px 1.2px at 70% 88%, #fff, transparent 60%);
  animation: twinkle 4s ease-in-out infinite alternate;
}
@keyframes twinkle{
  from{ opacity: .5; }
  to{ opacity: 1; }
}

/* ========================================
   07 INFO / CTA
   ======================================== */
.s-info .bg-img{ filter: brightness(.45); }
.info-inner{ text-align:center; max-width: 980px; }
.info-title{
  font-size: clamp(28px, 4.2vw, 44px);
  line-height: 1.6;
  letter-spacing: .05em;
  color:#fff;
  margin: 14px 0 50px;
}
.info-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 50px;
}
.info-card{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  padding: 28px 22px;
  text-align: left;
  color: #fff;
}
.info-card h3{
  font-family:"Inter",sans-serif;
  font-size: 11px; letter-spacing: .3em;
  color: var(--blue-coast);
  margin: 0 0 14px;
  font-weight: 500;
}
.info-card p{
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.9;
}
.info-card p.big{
  font-family:"Cormorant Garamond",serif;
  font-size: 36px;
  line-height: 1.2;
  color:#fff;
  margin-bottom: 14px;
  font-weight:400;
}
.info-card p.big span{
  font-family:"Shippori Mincho",serif;
  font-size: 13px;
  color: #dceaff;
  margin-left: 6px;
}
.info-card p.small{
  font-size: 12px;
  color: #b8cfe8;
  line-height: 1.8;
  margin-top: 8px;
}
.info-card a{
  color:#fff;
  border-bottom: 1px solid rgba(255,255,255,.3);
  padding-bottom: 2px;
}

.cta-row{
  display:flex; gap: 14px; justify-content:center;
  margin-bottom: 36px;
  flex-wrap: wrap;
}
.cta-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 240px;
  padding: 18px 28px;
  font-family:"Inter",sans-serif;
  font-size: 13px; letter-spacing:.18em;
  border-radius: 0;
  transition: all .3s;
}
.cta-btn.primary{
  background: var(--blue-coast);
  color: var(--blue-deep);
  font-weight: 600;
}
.cta-btn.primary:hover{ background: #fff; }
.cta-btn.ghost{
  border: 1px solid #fff;
  color: #fff;
}
.cta-btn.ghost:hover{ background: rgba(255,255,255,.12); }

.facility-line{
  display:flex; gap: 8px; flex-wrap: wrap; justify-content: center;
  font-family:"Inter",sans-serif;
  font-size: 11px;
  letter-spacing: .12em;
}
.facility-line span{
  border: 1px solid rgba(255,255,255,.3);
  padding: 6px 12px;
  color: #fff;
}

/* ========================================
   FOOTER
   ======================================== */
.site-footer{
  background: #03081a;
  color: #6e87b0;
  text-align: center;
  padding: 60px 24px 40px;
  font-family:"Inter",sans-serif;
}
.foot-brand{ display:flex; flex-direction:column; align-items:center; gap: 6px; margin-bottom: 18px; }
.foot-brand .brand-en{ font-size: 16px; color: #fff; letter-spacing:.3em; }
.foot-brand .brand-ja{ font-family:"Shippori Mincho",serif; font-size: 11px; letter-spacing:.2em; color: #94b0d8; }
.foot-copy{ font-size: 11px; letter-spacing:.1em; margin: 6px 0; }
.foot-note{
  font-size: 10px; letter-spacing:.05em;
  color: #4d6388;
  margin-top: 14px;
  font-family:"Shippori Mincho",serif;
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 900px){
  .info-grid{ grid-template-columns: 1fr; }
  .three-grid{ grid-template-columns: 1fr; gap: 16px; }
  .three-inner{ text-align: left; }
  .three-lead{ text-align: center; }
  .three-foot{ text-align: center; }
  .align-left .scene-inner, .align-right .scene-inner{
    margin: 0 auto; text-align: left;
    max-width: 540px;
  }
  .align-right .scene-inner .mini-gallery,
  .align-right .scene-inner .key-line,
  .align-right .scene-inner .house-stat,
  .align-right .scene-inner .sauna-line,
  .align-right .scene-inner .whale-line{ justify-content: flex-start; }
  .align-right .scene-body{ margin-left: 0; }
}

@media (max-width: 600px){
  .site-header{ padding: 12px 14px; }
  .brand-mark{ width: 32px; height: 32px; font-size: 13px; }
  .brand-en{ font-size: 12px; }
  .brand-ja{ font-size: 9px; }
  .lang-btn{ font-size: 10px; padding: 5px 7px; }

  .scene{
    padding: 70px 18px;
    min-height: 100vh; min-height: 100svh;
  }
  .fv-inner{ padding: 90px 18px 70px; }
  .fv-eyebrow{ font-size: 9px; gap: 8px; }
  .fv-eyebrow .line{ width: 24px; }
  .fv-title{ font-size: 32px; line-height: 1.5; letter-spacing: .04em; }
  .fv-en{ font-size: .45em; letter-spacing:.12em; }
  .fv-sub{ font-size: 13px; line-height: 2; }
  .fv-meta{ gap: 18px; font-size: 10px; }
  .fv-meta span{ font-size: 8px; }
  .scroll-cue{ font-size: 9px; bottom: 18px; }
  .scroll-cue span{ height: 26px; }

  .scene-no{ font-size: 11px; margin-bottom: 10px; }
  .scene-label{ font-size: 10px; letter-spacing:.22em; margin-bottom: 20px; }
  .scene-title{
    font-size: 24px; line-height: 1.6; letter-spacing: .03em;
    margin-bottom: 22px;
  }
  .scene-body{ font-size: 13.5px; line-height: 2.05; }

  .key-line, .house-stat, .sauna-line, .whale-line{ gap: 16px; }
  .house-stat{ gap: 22px; }
  .house-stat b{ font-size: 34px; }
  .house-stat span{ font-size: 10px; letter-spacing:.18em; }
  .key-line > div{ font-size: 12px; padding-left: 10px; }
  .sauna-line > div{ padding: 12px 16px; flex: 1 1 100%; }
  .sauna-line b{ font-size: 20px; }
  .whale-line b{ font-size: 22px; }

  .mini-gallery{
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
  }

  .info-title{ font-size: 22px; line-height: 1.7; margin: 10px 0 32px; }
  .info-card{ padding: 22px 18px; }
  .info-card p.big{ font-size: 28px; }
  .cta-btn{ width: 100%; min-width: 0; padding: 16px 20px; font-size: 12px; }
  .cta-row{ flex-direction: column; gap: 10px; }
  .facility-line{ font-size: 10px; gap: 6px; }
  .facility-line span{ padding: 5px 9px; }

  .site-footer{ padding: 40px 20px 28px; }
}

@media (max-width: 380px){
  .lang-switcher{ display:none; }
}

/* ========================================
   PRINT
   ======================================== */
@media print{
  .scene{ break-inside: avoid; }
}

/* Prefers reduced motion */
@media (prefers-reduced-motion: reduce){
  .bg-img, .scene-inner, .fv-title, .fv-sub, .fv-meta, .fv-eyebrow, .scroll-cue{
    animation: none !important; transition: none !important;
    opacity: 1 !important; transform: none !important;
  }
}