:root{--ink:#1d201d;--paper:#f2f0e8;--cream:#e7e0d2;--moss:#415848;--wood:#8a5e3c;--line:rgba(29,32,29,.22);--pad:clamp(24px,5vw,78px);--page-max:1440px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Noto Sans KR",sans-serif;letter-spacing:-.025em}a{color:inherit;text-decoration:none}img,video{display:block;width:100%;object-fit:cover}p{margin:0;line-height:1.75}.site-header{position:absolute;z-index:20;top:0;left:0;width:100%;height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);color:white;border-bottom:1px solid rgba(255,255,255,.3);font-size:12px;text-transform:uppercase;letter-spacing:.12em}.wordmark{font-weight:800;letter-spacing:.04em;font-size:16px}.site-header nav{display:flex;gap:32px}.site-header nav a,.quiet-link{opacity:.75;transition:.25s}.site-header nav a:hover,.quiet-link:hover{opacity:1}.quiet-link span{padding-left:8px}.hero{height:100svh;min-height:680px;position:relative;background:#242923;color:white;overflow:hidden}.hero video{height:100%;filter:saturate(.72) contrast(1.02)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,12,9,.58),rgba(7,12,9,.05) 62%),linear-gradient(0deg,rgba(5,8,6,.38),transparent 45%)}.hero-copy{position:absolute;left:var(--pad);bottom:11vh;display:grid;grid-template-columns:minmax(380px,56vw) 240px;align-items:end}.eyebrow{grid-column:1/-1;text-transform:uppercase;letter-spacing:.18em;font-size:11px;margin-bottom:22px}.hero h1{font-family:Georgia,serif;font-size:clamp(76px,13vw,190px);font-weight:400;letter-spacing:-.07em;line-height:.68;margin:0}.hero-lead{font-size:14px;line-height:1.7;padding-bottom:8px}.scroll-cue{position:absolute;right:var(--pad);bottom:42px;display:flex;align-items:center;gap:14px;font-size:11px;text-transform:uppercase;letter-spacing:.18em}.scroll-cue i{display:block;width:54px;height:1px;background:white}.section-pad{padding:120px var(--pad)}.section-index{font-size:11px;letter-spacing:.14em;text-transform:uppercase;border-top:1px solid var(--line);padding-top:14px;margin-bottom:82px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw}.intro h2,.concept h2,.ways h2,.material h2,.collection h2,.package h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-.055em;line-height:.96;margin:0;font-size:clamp(52px,7vw,108px)}.specs{display:flex;gap:60px;margin:72px 0 0}.specs div{min-width:150px}.specs dt{font-size:10px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:10px;opacity:.55}.specs dd{margin:0;font-size:13px;line-height:1.65}.body-copy{padding-top:12px}.body-copy .ko{font-size:clamp(19px,2vw,29px);line-height:1.8}.body-copy .en{font-family:Georgia,serif;font-size:18px;line-height:1.75;max-width:600px;margin-top:48px;color:#5d625c}.cinema{height:88vh;min-height:620px;position:relative;background:#171a17;overflow:hidden}.cinema video{height:100%;opacity:.9}.cinema p{position:absolute;left:var(--pad);bottom:50px;color:white;font-family:Georgia,serif;font-size:clamp(34px,5vw,74px)}.concept{background:#e8e5dc}.concept-heading{text-align:center;margin-bottom:100px}.concept-heading p{font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:18px}.film-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}.film-pair figure{margin:0}.film-pair video{aspect-ratio:3/4;background:#cddcc9}.film-pair figcaption{display:flex;justify-content:space-between;padding:14px 2px;font-size:11px;letter-spacing:.1em;text-transform:uppercase}.statement{display:grid;grid-template-columns:1fr 1fr;gap:10vw;margin:110px 0 0 25vw}.statement .ko{font-size:20px}.statement .en{font-family:Georgia,serif;font-size:17px;color:#62665e}.poetic-film{height:90vh;min-height:650px;position:relative;background:#d9d0bc}.poetic-film video{height:100%;filter:saturate(.7)}.poetic-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;text-shadow:0 2px 22px rgba(0,0,0,.25)}.poetic-copy span{text-transform:uppercase;letter-spacing:.2em;font-size:11px}.poetic-copy strong{font:400 clamp(62px,10vw,150px)/1 Georgia,serif;letter-spacing:-.055em}.ways{background:#253329;color:#f3f0e7}.section-index.light{border-color:rgba(255,255,255,.28)}.ways-title{display:flex;align-items:end;justify-content:space-between;margin-bottom:80px}.ways-title p{font-size:14px;color:#cbd3cc}.ways-media{display:grid;grid-template-columns:1fr 1.34fr;gap:18px;align-items:stretch}.ways-media video{height:72vh;max-height:900px;min-height:540px}.ways-labels{display:grid;grid-template-columns:1fr 1.34fr auto;gap:20px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin-top:16px;color:#cbd3cc}.gallery{padding:14vw var(--pad);display:grid;grid-template-columns:1.3fr .8fr;gap:8vw;position:relative}.gallery-main img{aspect-ratio:1.5/1}.gallery figure{margin:0}.gallery-copy{display:flex;flex-direction:column;justify-content:center}.gallery-copy span{font:400 clamp(38px,5vw,72px)/1.05 Georgia,serif;letter-spacing:-.045em}.gallery-copy p{font-size:13px;margin-top:38px;color:#62655f}.gallery-side{grid-column:2;margin-top:-6vw!important}.gallery-side img{aspect-ratio:4/3}.material{background:#e5ddd0}.material-intro{display:grid;grid-template-columns:1fr .7fr;align-items:end;margin-bottom:90px}.material-intro p{max-width:350px;color:#5a5a51}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.detail-grid figure{margin:0}.detail-grid img{aspect-ratio:1/1.12}.detail-grid figcaption{display:grid;grid-template-columns:36px 1fr;padding-top:17px;border-top:1px solid var(--line);margin-top:14px}.detail-grid figcaption b{font-size:10px;font-weight:400}.detail-grid figcaption span{font:22px Georgia,serif}.detail-grid figcaption small{grid-column:2;margin-top:6px;color:#68665e}.collection{padding:130px var(--pad);background:#f8f7f2;display:grid;grid-template-columns:.42fr 1fr;gap:7vw;align-items:start}.collection-copy{position:sticky;top:40px}.collection img{mix-blend-mode:multiply}.collection .section-index{margin-bottom:65px}.collection h2{font-size:clamp(48px,6vw,90px)}.collection-copy>p{margin-top:30px;font-size:12px;letter-spacing:.12em}.package{display:grid;grid-template-columns:1.3fr .7fr;gap:8vw;align-items:center}.package img{aspect-ratio:1.32/1}.eyebrow.dark{color:#686860;margin-bottom:22px}.package h2{font-size:clamp(45px,5vw,74px)}.package div>p:not(.eyebrow){margin:34px 0;color:#686860}.outline-button{display:flex;justify-content:space-between;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:18px 2px;font-size:11px;text-transform:uppercase;letter-spacing:.13em}footer{background:#1b201d;color:#eceae3;padding:65px var(--pad);display:grid;grid-template-columns:1fr auto auto;gap:40px;align-items:end}footer p{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#aeb4ad}.reveal{opacity:0;transform:translateY(35px);transition:opacity 1s ease,transform 1s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:800px){.site-header{height:68px}.site-header nav{display:none}.quiet-link{font-size:0}.quiet-link span{font-size:17px}.hero-copy{grid-template-columns:1fr;bottom:90px}.hero h1{font-size:23vw;line-height:.75}.hero-lead{margin-top:32px}.section-pad{padding:82px 22px}.section-index{margin-bottom:55px}.intro-grid,.film-pair,.statement,.material-intro,.detail-grid,.collection,.package{grid-template-columns:1fr}.intro-grid{gap:70px}.specs{gap:20px;justify-content:space-between}.body-copy .ko{font-size:18px}.body-copy .en{font-size:16px}.cinema{height:70vh}.film-pair{gap:60px}.statement{margin:75px 0 0;gap:30px}.poetic-film{height:72vh}.ways{padding-left:22px;padding-right:22px}.ways-title{display:block}.ways-title p{margin-top:35px}.ways-media{grid-template-columns:1fr;gap:14px}.ways-media video{height:auto;min-height:0;aspect-ratio:4/5}.ways-labels{display:none}.gallery{padding:90px 22px;grid-template-columns:1fr;gap:60px}.gallery-copy{grid-row:1}.gallery-side{grid-column:1;margin-top:0!important}.material-intro{gap:35px}.detail-grid{gap:55px}.detail-grid img{aspect-ratio:4/3}.collection{padding:90px 22px}.collection-copy{position:static}.collection img{margin-top:30px}.package{gap:55px}.package img{aspect-ratio:1/1.15}footer{grid-template-columns:1fr;gap:18px}.site-header{padding:0 22px}.scroll-cue{right:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

/* White, media-first revision */
:root{--paper:#fff;--cream:#fff}
body,.concept,.ways,.material,.collection{background:#fff;color:var(--ink)}
.hero{background:#fff;color:var(--ink)}
.hero video{filter:none}
.cinema{background:#fff}
.cinema video{opacity:1}
.poetic-film{background:#fff}
.poetic-film video{filter:none}
.section-index.light{border-color:var(--line)}
.ways-title p,.ways-labels{color:#62655f}

/* Preserve complete media frames at every viewport size */
img,video{object-fit:contain;height:auto}
.hero{height:auto;min-height:0;display:block}
.hero video{width:100%;height:auto;aspect-ratio:1916/1080;background:#fff}
.cinema{height:auto;min-height:0;background:#fff}
.cinema video{width:100%;height:auto;aspect-ratio:1916/1080}
.poetic-film{height:auto;min-height:0;background:#fff}
.poetic-film video{width:100%;height:auto;aspect-ratio:1920/1080}
.film-pair video{width:100%;height:auto;object-fit:contain;background:#fff}
.film-pair figure:first-child video{aspect-ratio:1080/1916}
.film-pair figure:last-child video{aspect-ratio:1244/1664}
.ways-media video{width:100%;height:auto;min-height:0;max-height:none;object-fit:contain;background:#fff}
.ways-media video:first-child{aspect-ratio:1080/1440}
.ways-media video:last-child{aspect-ratio:1440/1080}
.gallery-main img,.gallery-side img,.detail-grid img,.package img{height:auto;object-fit:contain}
.gallery-main img{aspect-ratio:auto}
.gallery-side img{aspect-ratio:auto}
.detail-grid img{aspect-ratio:auto}
.package img{aspect-ratio:auto}

@media(max-width:800px){
  .hero video,.cinema video,.poetic-film video{height:auto;min-height:0;object-fit:contain}
  .ways-media video{height:auto;min-height:0;max-height:none;object-fit:contain}
  .gallery-main img,.gallery-side img,.detail-grid img,.package img{aspect-ratio:auto;height:auto}
}

/* Full-width production layout */
html,body{width:100%;max-width:100%;overflow-x:hidden}
main,main>section,footer{width:100%;max-width:100%}
img,video{max-width:100%}
.intro-grid>*,.film-pair>*,.ways-media>*,.gallery>*,.material-intro>*,.detail-grid>*,.collection>*,.package>*{min-width:0}

/* Align paired media and captions to shared horizontal baselines */
.film-pair{align-items:start}
.film-pair figure{display:grid;grid-template-rows:auto auto;align-content:start}
.film-pair figure:first-child video,
.film-pair figure:last-child video{width:100%;height:clamp(520px,62vw,1040px);aspect-ratio:auto;object-fit:contain;background:#fff}
.film-pair figcaption{width:100%;min-height:44px;margin:0;align-items:center}

.ways-media{align-items:start}
.ways-media video,
.ways-media video:first-child,
.ways-media video:last-child{width:100%;height:clamp(440px,52vw,820px);min-height:0;max-height:none;aspect-ratio:auto;object-fit:contain;background:#fff}
.ways-labels{display:grid;grid-template-columns:1fr 1.34fr;gap:18px;width:100%;align-items:center}
.ways-labels>div{display:flex;justify-content:space-between;gap:20px}
.ways-labels>span{text-align:right}

@media(max-width:800px){
  .film-pair figure:first-child video,
  .film-pair figure:last-child video{height:auto;aspect-ratio:auto}
  .ways-media video,
  .ways-media video:first-child,
  .ways-media video:last-child{height:auto;aspect-ratio:auto}
  .ways-labels{display:none}
}

/* Present each film independently at full width */
.film-pair{grid-template-columns:1fr;gap:96px}
.film-pair figure:first-child video,
.film-pair figure:last-child video{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}

.ways-media{grid-template-columns:1fr;gap:96px}
.ways-media figure{margin:0;width:100%}
.ways-media video,
.ways-media video:first-child,
.ways-media video:last-child{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
.ways-media figcaption{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:44px;padding:14px 2px 0;border-top:1px solid var(--line);margin-top:14px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#62655f}
.ways-media figure:last-child figcaption{justify-content:flex-end}

@media(max-width:800px){
  .film-pair,.ways-media{gap:64px}
}

/* One shared maximum width for the complete product page */
body{background:#fff}
main,footer{width:min(100%,var(--page-max));max-width:var(--page-max);margin-inline:auto}
main>section{width:100%;max-width:var(--page-max);margin-inline:auto}
.top-overview-image{padding:0 var(--pad) clamp(64px,18vw,260px);background:#fff}
.top-overview-image img{display:block;width:100%;height:auto;object-fit:contain}
img,video{width:100%;max-width:100%}

/* Full-width film sections use the same content edges as padded sections */
.hero,.poetic-film{padding-inline:var(--pad)}
.hero video,.poetic-film video{width:100%;max-width:100%;margin-inline:auto}

/* Continuous vertical composition: remove gaps between page blocks */
main>section{margin-block:0}
.section-pad{padding-top:0;padding-bottom:0}
.intro-grid{padding-block:0}
.concept-heading{margin-bottom:0}
.film-pair{gap:0}
.film-pair figcaption{min-height:0;padding:8px 2px}
.statement{margin:0;padding:0}
.ways-title{margin-bottom:0}
.ways-media{gap:0}
.ways-media figcaption{min-height:0;margin-top:0;padding:8px 2px;border-top:0}
.gallery{padding-top:0;padding-bottom:0;gap:0}
.gallery-side{margin-top:0!important}
.material-intro{margin-bottom:0}
.detail-grid{gap:0}
.detail-grid figcaption{margin-top:0}
.collection{padding-top:0;padding-bottom:0;gap:0}
.package{gap:0}

@media(max-width:800px){
  .film-pair,.ways-media,.detail-grid,.gallery,.collection,.package{gap:0}
}

/* Media-only final flow */
.film-pair,.ways-media,.gallery,.detail-grid,.collection,.package{display:grid;grid-template-columns:1fr;gap:0;padding-top:0;padding-bottom:0}
.film-pair figure,.ways-media figure,.gallery figure,.detail-grid figure{margin:0}
.gallery-side{grid-column:1;margin:0!important}
.collection img,.package img{grid-column:1;width:100%}

/* Prevent sub-pixel seams between consecutive media */
main>section+section{margin-top:-1px}
.film-pair figure+figure,
.ways-media figure+figure,
.gallery figure+figure,
.detail-grid figure+figure{margin-top:-1px}
main img,main video{vertical-align:top}

/* Stagger the two product films like the approved reference */
@media(min-width:801px){
  .film-pair{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:0}
  .film-pair figure:first-child{grid-column:1;grid-row:1}
  .film-pair figure:last-child{grid-column:2;grid-row:2;margin-top:-1px}
  .film-pair figure video{display:block;width:100%;height:auto;object-fit:contain}
  .film-copy-one{grid-column:2;grid-row:1}
  .film-copy-two{grid-column:1;grid-row:2}
}

.film-copy{display:flex;align-self:stretch;min-width:0;min-height:100%;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:clamp(32px,6vw,92px);background:#fff}
.film-copy-mark{display:block;width:clamp(150px,16vw,280px);max-width:42%;height:auto;margin:0 0 clamp(22px,2.6vw,38px);object-fit:contain}
.film-copy h2{margin:0;color:#3f494f;font:400 clamp(38px,5vw,72px)/.98 Constantia,Georgia,serif;letter-spacing:-.055em}
.film-copy p{margin-top:clamp(22px,3vw,42px);color:#3f494f;font-size:clamp(11px,1vw,14px);line-height:1.75;letter-spacing:0}

@media(max-width:800px){
  .film-copy{padding:54px 24px}
  .film-pair figure:first-child{order:1}
  .film-copy-one{order:2}
  .film-pair figure:last-child{order:3}
  .film-copy-two{order:4}
}

/* Two-film sequence with a two-second title card */
.sequence-stage{position:relative;aspect-ratio:16/9;overflow:hidden;background:#3f494f}
.sequence-stage .sequence-film,
.sequence-stage .sequence-card{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;visibility:hidden;transition:opacity .28s ease;pointer-events:none}
.sequence-stage .sequence-film{object-fit:contain;background:#3f494f}
.sequence-stage .sequence-card{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#3f494f;color:#f7f7f4;text-align:center}
.sequence-stage .sequence-card h2{margin:0;font:400 clamp(40px,6vw,88px)/1.02 Constantia,Georgia,serif;letter-spacing:-.045em}
.sequence-stage .sequence-card p{margin:clamp(18px,2.4vw,34px) 0 0;font:400 clamp(13px,1.3vw,18px)/1.65 Arial,"Noto Sans",sans-serif;letter-spacing:.01em;color:rgba(247,247,244,.8)}
.sequence-stage .sequence-card h2,.sequence-stage .sequence-card p{transition:opacity .6s ease}
.sequence-stage .sequence-card.is-leaving h2,.sequence-stage .sequence-card.is-leaving p{opacity:0}
.sequence-stage .is-active{opacity:1;visibility:visible}

/* Keep the sequence at the same width as every other film */
.poetic-film.sequence-stage{width:calc(100% - (var(--pad) * 2));max-width:calc(var(--page-max) - (var(--pad) * 2));margin-inline:var(--pad);padding-inline:0;aspect-ratio:1916/1080}
.sequence-stage .sequence-film{inset:0;width:100%;height:100%;max-width:none;object-fit:cover;background:#3f494f}
.sequence-stage .sequence-card{inset:0;width:100%;height:100%}

@media(max-width:800px){
  .poetic-film.sequence-stage{width:calc(100% - (var(--pad) * 2));margin-inline:var(--pad);padding-inline:0}
}

/* Mandatory: keep the inserted film aligned to the bird sequence width */
.light-shadow-film{
  width:calc(100% - (var(--pad) * 2));
  max-width:calc(var(--page-max) - (var(--pad) * 2));
  margin-inline:var(--pad);
  padding-inline:0;
}
.light-shadow-film video{
  display:block;
  width:100%;
  max-width:none;
  height:auto;
  aspect-ratio:auto;
  object-fit:contain;
}

/* Bottom section: bird rows with option captions (ref. Option layout) */
.bird-options{
  display:flex;
  flex-direction:column;
  gap:clamp(28px,5vw,64px);
  padding:clamp(40px,8vw,110px) var(--pad);
  background:#fff;
}
.bird-row{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:clamp(10px,1.6vw,18px);
}
.bird-row-image{margin:0;width:100%}
.bird-row-image img{display:block;width:100%;height:auto;object-fit:contain}
.bird-option{
  margin:0;
  text-align:center;
}
.bird-option b,
.bird-option span{
  font-family:Arial,"Noto Sans KR",sans-serif;
  font-size:clamp(15px,1.5vw,18px);
  letter-spacing:-.01em;
  line-height:1.5;
  color:#62655f;
}
.bird-option b{font-weight:700}
.bird-option span{font-weight:400}

/* Wide: image left at 90%, caption stacked to the right (ref. image 2) */
@media(min-width:1401px){
  .bird-row{
    display:grid;
    grid-template-columns:1fr minmax(160px,.3fr);
    gap:clamp(20px,3vw,48px);
    align-items:center;
  }
  .bird-row-image img{width:90%}
  .bird-option{text-align:left}
  .bird-option b,
  .bird-option span{display:block}
  .bird-option span{margin-top:8px}
}
