/* ============================================================
   Eastern Vintage — Homepage v1
   Ported from the approved Claude Design prototype
   ("Eastern Vintage Pure HTML.html") with client-requested
   additions: round logo mark, hero/films video, mobile cleanup.
   ============================================================ */

:root{
  --paper:#f4efe7; --bone:#e9e2d4; --stone:#bfb6a6;
  --sumi:#1a1614; --ash:#4e4840; --cord:#a85234;
  --line: rgba(26,22,20,0.12);
  --line-strong: rgba(26,22,20,0.28);
  --display:"Italiana","Cormorant Garamond",serif;
  --serif:"Cormorant Garamond","Italiana",serif;
  --jp:"Shippori Mincho","Cormorant Garamond",serif;
  --ui:"Inter Tight",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html,body{ margin:0; padding:0; background:var(--paper); color:var(--sumi); font-family:var(--ui); font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; }
body{ overflow-x:hidden; }
a{ color:inherit; text-decoration:none; cursor:pointer; }
img{ display:block; max-width:100%; }
video{ display:block; max-width:100%; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0; }

.eyebrow{ font-family:var(--mono); font-size:11.5px; font-weight:400; letter-spacing:0.15em; text-transform:uppercase; color:var(--ash); }
.display{ font-family:var(--display); font-weight:400; letter-spacing:-0.005em; line-height:0.95; }
.serif{ font-family:var(--serif); font-weight:300; }
.italic{ font-style:italic; }
.jp{ font-family:var(--jp); letter-spacing:0.08em; }
.mono{ font-family:var(--mono); }

.row{ display:flex; }
.col{ display:flex; flex-direction:column; }
.gap-xs{ gap:6px; } .gap-sm{ gap:12px; } .gap-md{ gap:24px; } .gap-lg{ gap:48px; }
.center{ align-items:center; }
.between{ justify-content:space-between; }
.end{ align-items:flex-end; }

/* placeholder card */
.ph{
  position:relative; overflow:hidden; width:100%;
  background:
    repeating-linear-gradient(135deg, rgba(26,22,20,0.04) 0 1px, transparent 1px 14px),
    linear-gradient(180deg, var(--bone) 0%, #ddd3c0 100%);
  color:var(--ash);
}
.ph .ph-tag{
  position:absolute; left:14px; bottom:12px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--ash);
  background:rgba(244,239,231,0.78); padding:4px 8px;
}
.ph .ph-glyph{
  position:absolute; inset:0; display:grid; place-items:center; font-family:var(--jp);
  font-size:64px; color:rgba(26,22,20,0.16); user-select:none;
}

.btn{
  font-family:var(--ui); font-weight:500; letter-spacing:0.04em; text-transform:uppercase;
  font-size:12.5px; padding:16px 26px; border:1px solid var(--sumi);
  background:var(--sumi); color:var(--paper); transition:all .25s ease;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  text-decoration:none;
}
.btn:hover{ background:var(--cord); border-color:var(--cord); }
.btn.ghost{ background:transparent; color:var(--sumi); border-color:var(--sumi); }
.btn.ghost:hover{ background:var(--sumi); color:var(--paper); border-color:var(--sumi); }
.btn.full{ width:100%; }
.btn.sm{ font-size:11px; padding:10px 16px; }

/* Top bar (static, no JS) */
header.topbar{
  position:sticky; top:0; z-index:30;
  background:rgba(244,239,231,0.92); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.topbar > .row{ padding:14px 28px; }
.topbar a.eyebrow{ color:var(--sumi); }
.topbar a.eyebrow:hover{ color:var(--cord); }
/* Round brand mark — client request #1 */
.brand-mark{ display:inline-flex; align-items:center; }
.brand-mark img{ width:32px; height:32px; }
.wordmark{ text-align:center; }
.wordmark .name{ font-family:var(--display); font-size:24px; letter-spacing:.26em; }
.wordmark .name span{ display:inline-block; width:10px; }
.wordmark .jp{ font-size:10px; color:var(--ash); margin-top:2px; letter-spacing:.4em; }

/* Hero */
.hero-grid{
  display:grid; grid-template-columns:1.05fr 1fr;
  min-height:calc(100vh - 64px); border-bottom:1px solid var(--line);
}
.hero-img{ position:relative; background:var(--bone); overflow:hidden; }
.hero-img img,
.hero-img video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; filter:brightness(.96); }
.hero-frame{ position:absolute; inset:24px; border:1px solid rgba(244,239,231,.32); pointer-events:none; }
.hero-meta-tl{ position:absolute; top:42px; left:42px; color:var(--paper); }
.hero-meta-tl .eyebrow{ color:rgba(244,239,231,.85); }
.hero-meta-br{ position:absolute; bottom:42px; right:42px; text-align:right; color:var(--paper); }
.hero-meta-bl{ position:absolute; bottom:42px; left:42px; color:var(--paper); display:flex; align-items:center; gap:10px; }
.hero-dot{ display:inline-block; width:10px; height:10px; border-radius:99px; background:var(--cord); }
.hero-text{ position:relative; padding:64px 56px; display:flex; flex-direction:column; justify-content:space-between; }
.hero-text h1{ font-size:108px; margin:0; letter-spacing:-.01em; font-family:var(--display); font-weight:400; line-height:.95; }

/* Marquee */
.marquee{ overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper); }
.marquee-track{ display:flex; width:max-content; animation:marquee 40s linear infinite; }
.marquee-track > div{ padding:12px 32px; font-family:var(--mono); font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--ash); white-space:nowrap; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-33.33%); } }

/* Manifesto */
.manifesto{ padding:72px 40px; border-bottom:1px solid var(--line); }
.manifesto-grid{ display:grid; grid-template-columns:150px 1fr 120px; gap:36px; align-items:start; }
.manifesto .display{ font-size:44px; line-height:1.08; margin:0; letter-spacing:-.005em; }
.stat .display{ font-size:36px; }
.stat .l{ font-family:var(--serif); font-style:italic; color:var(--ash); font-size:13px; }
.wabi{ font-family:var(--jp); font-size:26px; color:var(--cord); line-height:1.5; }
.manifesto-stats{ margin-top:36px; padding-top:20px; border-top:1px solid var(--line); flex-wrap:wrap; gap:32px; }
.manifesto-stats .stat{ min-width:140px; }

/* Section heads */
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; padding:0 32px; margin-bottom:28px; }
.section-head .display{ font-size:64px; max-width:780px; }
.section-head .sub{ font-family:var(--serif); font-size:17px; color:var(--ash); max-width:520px; margin-top:4px; font-weight:300; }
.pill-link{ border-bottom:1px solid var(--sumi); padding-bottom:6px; }

/* Featured */
.featured{ padding:96px 0 110px; border-bottom:1px solid var(--line); }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px 28px; padding:0 32px; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding:0 32px; }

/* Product card (CSS-only hover) */
.card{ cursor:pointer; display:flex; flex-direction:column; gap:12px; text-decoration:none; color:inherit; }
.card .img-wrap{ position:relative; aspect-ratio:3/4; width:100%; background:var(--bone); overflow:hidden; }
.card .img-wrap img{ width:100%; height:100%; object-fit:cover; object-position:center top; transition:opacity .35s ease, transform .6s ease; }
.card .img-wrap img.alt{ position:absolute; inset:0; opacity:0; }
.card:hover .img-wrap img.alt{ opacity:1; }
.card:hover .img-wrap img.main{ transform:scale(1.02); }
.card .chip{ position:absolute; top:12px; left:12px; font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; background:rgba(244,239,231,.86); padding:4px 8px; color:var(--sumi); }
.card-meta{ padding:4px 2px; display:flex; flex-direction:column; gap:6px; }
.card-meta .name{ font-family:var(--serif); font-size:18px; font-weight:400; }
.card-meta .price{ font-family:var(--mono); font-size:12px; color:var(--sumi); }
.card-meta .sub{ font-family:var(--serif); font-style:italic; color:var(--ash); font-size:13px; }

/* Film section */
.film{ padding:96px 0 110px; border-bottom:1px solid var(--line); background:var(--sumi); color:var(--paper); }
.film .head{ display:flex; justify-content:space-between; padding:0 56px; margin-bottom:36px; align-items:flex-end; }
.film .head .display{ font-size:64px; margin-top:14px; max-width:780px; }
.film-grid{ display:grid; grid-template-columns:2fr 1fr; gap:24px; padding:0 56px; }
.film-main{ aspect-ratio:16/10; background:linear-gradient(135deg,#2a241f,#14110f); position:relative; overflow:hidden; }
.film-main img,
.film-main video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.film-grad{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(26,22,20,.12), rgba(26,22,20,.6)); }
.film-play{ width:64px; height:64px; border-radius:99px; border:1px solid rgba(244,239,231,.6); display:grid; place-items:center; background:rgba(244,239,231,.08); color:var(--paper); }
.film-play .tri{ width:0; height:0; border-left:12px solid var(--paper); border-top:8px solid transparent; border-bottom:8px solid transparent; margin-left:4px; }
.film-bar{ position:absolute; left:28px; right:28px; bottom:18px; height:1px; background:rgba(244,239,231,.2); }
.film-bar > div{ width:38%; height:100%; background:var(--cord); }
.film-row{ display:flex; justify-content:space-between; align-items:center; padding:14px 16px; border:1px solid rgba(244,239,231,.14); }
.film-row.active{ background:rgba(244,239,231,.06); }

/* Look */
.look{ padding:110px 0; border-bottom:1px solid var(--line); }
.look-grid{ display:grid; grid-template-columns:1fr 1fr; padding:0 32px; align-items:stretch; }
.look-img{ position:relative; background:var(--bone); }
.look-img img{ width:100%; height:100%; max-height:780px; object-fit:cover; object-position:center 30%; }
.look-dot{
  position:absolute; transform:translate(-50%,-50%);
  width:28px; height:28px; border-radius:99px; background:var(--paper); border:1px solid var(--sumi);
  color:var(--sumi); display:grid; place-items:center; font-size:13px; font-family:var(--serif);
  box-shadow:0 8px 20px rgba(26,22,20,.18); transition:all .2s;
}
.look-dot.active{ background:var(--cord); color:var(--paper); }
.look-panel{ padding:40px 48px; background:var(--paper); border:1px solid var(--line); border-left:0; display:flex; flex-direction:column; }
.look-panel .display{ font-size:46px; margin-top:12px; line-height:1.02; }
.look-item{ padding:22px 0; display:flex; justify-content:space-between; align-items:center; transition:all .2s; }
.look-item:first-child{ border-top:1px solid var(--sumi); }
.look-item + .look-item{ border-top:1px solid var(--line); }
.look-item:last-child{ border-bottom:1px solid var(--sumi); }
.look-item.active{ background:rgba(168,82,52,.05); padding-left:16px; }
.look-item:hover{ background:rgba(168,82,52,.05); }

/* Category index */
.cat-index{ padding:110px 32px; border-bottom:1px solid var(--line); }
.cat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.cat-card{
  padding:36px 28px; text-align:left; gap:24px; min-height:280px;
  border-top:1px solid var(--sumi); border-right:1px solid var(--sumi);
  background:var(--paper); cursor:pointer;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative; overflow:hidden; transition:background .25s;
  text-decoration:none; color:inherit;
}
.cat-card:nth-child(4n+1){ border-left:1px solid var(--sumi); }
.cat-grid > .cat-card:nth-last-child(-n+4){ border-bottom:1px solid var(--sumi); }
.cat-card:hover{ background:var(--bone); }
.cat-card .glyph{ font-family:var(--jp); font-size:48px; color:var(--cord); }
.cat-card .display{ font-size:34px; line-height:1; }

/* Shop header */
.shop-head{ padding:80px 32px 36px; border-bottom:1px solid var(--line); }
.shop-head .display{ font-size:96px; margin-top:14px; letter-spacing:-.01em; }
.shop-head .sub{ font-family:var(--serif); font-style:italic; color:var(--ash); font-size:18px; margin-top:10px; max-width:560px; }
.shop-strip{ border-bottom:1px solid var(--line); padding:18px 32px; background:rgba(244,239,231,.94); }
.chip-btn{
  padding:8px 14px; border:1px solid var(--line-strong); background:transparent; color:var(--sumi);
  font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; transition:all .2s;
  text-decoration:none; display:inline-flex; align-items:center; gap:6px;
}
.chip-btn:hover{ border-color:var(--sumi); }
.chip-btn.active{ background:var(--sumi); color:var(--paper); border-color:var(--sumi); }
.chip-btn .num{ opacity:.5; margin-left:2px; }
.shop-grid{ padding:40px 32px 80px; }
.shop-grid .grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:44px 24px; }
.grid-quote{
  grid-column:1 / -1; background:var(--sumi); color:var(--paper);
  padding:36px 40px; display:flex; flex-direction:row; align-items:center;
  justify-content:space-between; gap:32px; flex-wrap:wrap;
}
.grid-quote .display{ font-size:28px; line-height:1.15; }

/* PDP (inline featured product) */
.pdp-grid{ display:grid; grid-template-columns:1.4fr 1fr; border-bottom:1px solid var(--line); }
.pdp-gallery{ position:relative; border-right:1px solid var(--line); background:var(--bone); }
.pdp-gallery .stage{ aspect-ratio:4/5; }
.pdp-gallery .stage img{ width:100%; height:100%; object-fit:cover; object-position:center top; }
.pdp-thumbs{ position:absolute; top:24px; left:24px; display:flex; flex-direction:column; gap:8px; }
.pdp-thumb{ width:54px; height:68px; border:1px solid var(--line-strong); background:var(--paper); padding:2px; display:block; }
.pdp-thumb.active{ border-color:var(--sumi); }
.pdp-thumb img{ width:100%; height:100%; object-fit:cover; }
.pdp-info{ padding:56px 48px; }
.pdp-info .display{ font-size:64px; margin-top:24px; line-height:1; }
.pdp-info .sub{ font-family:var(--serif); font-style:italic; font-size:17px; color:var(--ash); margin-top:8px; }
.pdp-price{ font-family:var(--display); font-size:30px; }
.swatch-row{ display:flex; gap:6px; }
.swatch{ width:22px; height:22px; border:1px solid var(--line-strong); }
.size-row{ display:flex; gap:8px; }
.size-btn{
  flex:1; padding:14px 0; border:1px solid var(--line-strong); background:transparent;
  font-family:var(--mono); font-size:11px; letter-spacing:.14em; position:relative; text-align:center;
}
.size-btn.active{ background:var(--sumi); color:var(--paper); border-color:var(--sumi); }
.size-btn[disabled]{ color:var(--stone); cursor:not-allowed; }
.size-btn[disabled] .strike{ position:absolute; left:0; right:0; top:50%; height:1px; background:var(--stone); transform:rotate(-12deg); }

/* Accordion (HTML-native details) */
.accordion{ border-bottom:1px solid var(--line); }
.accordion summary{ list-style:none; padding:22px 0; display:flex; justify-content:space-between; align-items:center; cursor:pointer; }
.accordion summary::-webkit-details-marker{ display:none; }
.accordion summary .t{ font-family:var(--serif); font-size:18px; }
.accordion summary .pm{ font-family:var(--mono); font-size:18px; color:var(--ash); }
.accordion .pm::before{ content:"+"; }
.accordion[open] .pm::before{ content:"−"; }
.accordion .body{ padding:0 0 24px; }
.accordion p{ font-family:var(--serif); font-size:15px; color:var(--ash); line-height:1.7; font-weight:300; }

/* Size guide (HTML-native details) */
.size-guide{ margin-top:14px; }
.size-guide > summary{ list-style:none; cursor:pointer; }
.size-guide > summary::-webkit-details-marker{ display:none; }
.size-guide[open] .sg-card{ display:block; }
.sg-card{ display:none; padding:16px; background:var(--bone); border:1px solid var(--line-strong); margin-top:8px; }
.sg-card .table{ display:grid; grid-template-columns:1fr 1.4fr 1.4fr 1.4fr 1.6fr; font-family:var(--mono); font-size:11px; letter-spacing:.06em; }
.sg-card .h{ padding:8px 6px; border-bottom:1px solid var(--sumi); text-transform:uppercase; color:var(--ash); }
.sg-card .c{ padding:8px 6px; border-bottom:1px solid var(--line); }
.sg-card .c.avail{ color:var(--cord); }

.wear-it{ padding:110px 32px; border-top:1px solid var(--line); background:var(--bone); }
.wear-grid{ display:grid; grid-template-columns:1fr 1.2fr; gap:60px; align-items:center; }
.wear-it .display{ font-size:58px; margin-top:14px; line-height:1.02; }
.wear-steps{ display:flex; flex-direction:column; gap:24px; margin-top:32px; }
.wear-step{ display:flex; gap:18px; padding-top:18px; border-top:1px solid var(--line); }
.wear-step .n{ font-family:var(--mono); font-size:11px; color:var(--cord); letter-spacing:.18em; padding-top:4px; width:32px; }
.wear-step .t{ font-family:var(--display); font-size:24px; }
.wear-step .d{ font-family:var(--serif); font-style:italic; color:var(--ash); font-size:15px; }
.wear-imgs{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.wear-imgs > div{ aspect-ratio:3/4; overflow:hidden; background:var(--paper); position:relative; }
.wear-imgs img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; }
.wear-imgs .tag{
  position:absolute; left:14px; bottom:12px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--sumi);
  background:rgba(244,239,231,.85); padding:4px 8px;
}

/* Journal */
.journal-head{ padding:80px 32px 40px; border-bottom:1px solid var(--line); }
.journal-head .display{ font-size:108px; margin-top:16px; line-height:.95; }
.journal-feat{ padding:60px 32px; border-bottom:1px solid var(--line); }
.journal-feat .grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:stretch; }
.journal-feat .grid .ph{ aspect-ratio:3/2; }
.journal-cover{ aspect-ratio:3/2; overflow:hidden; background:var(--bone); }
.journal-cover img{ width:100%; height:100%; object-fit:cover; }
.journal-feat .display{ font-size:72px; margin-top:14px; line-height:1; }
.journal-list{ padding:60px 32px 110px; }
.journal-row{ display:flex; justify-content:space-between; padding:28px 0; border-top:1px solid var(--sumi); transition:background .2s; text-decoration:none; color:inherit; }
.journal-row:hover{ background:var(--bone); }
.journal-row .display{ font-size:30px; }
.journal-row .n{ font-family:var(--display); font-size:42px; color:var(--cord); }

/* Footer */
footer{ padding:80px 32px 40px; background:var(--sumi); color:var(--paper); }
footer .grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1.4fr; gap:36px; }
footer .display{ font-size:52px; letter-spacing:-.01em; }
footer .col-title{ color:rgba(244,239,231,.6); }
footer .col-list a{ font-family:var(--serif); font-style:italic; color:rgba(244,239,231,.8); font-size:14px; }
.newsletter{ display:flex; border-bottom:1px solid rgba(244,239,231,.4); }
.newsletter input{ flex:1; background:transparent; border:0; color:var(--paper); padding:10px 0; font-family:var(--ui); outline:none; }
.newsletter button{ color:var(--cord); padding:10px 0; font-family:var(--mono); font-size:11px; letter-spacing:.18em; }
footer .imp{ display:flex; justify-content:space-between; margin-top:60px; padding-top:24px; border-top:1px solid rgba(244,239,231,.18); color:rgba(244,239,231,.45); font-family:var(--mono); font-size:11px; }

/* Section number divider */
.section-anchor{ scroll-margin-top:64px; }

/* ============ Responsive — tablet (client request #2) ============ */
@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-img{ min-height:70vh; }
  .hero-text{ padding:48px 28px; gap:40px; }
  .hero-text h1{ font-size:64px; }
  .manifesto{ padding:80px 28px; }
  .manifesto-grid{ grid-template-columns:1fr; gap:24px; }
  .manifesto .display{ font-size:36px; }
  .manifesto-stats{ gap:24px; }
  .section-head{ flex-direction:column; align-items:flex-start; gap:14px; }
  .section-head .display{ font-size:44px; }
  .grid-3, .grid-4, .shop-grid .grid{ grid-template-columns:repeat(2,1fr); }
  .film .head{ flex-direction:column; align-items:flex-start; gap:18px; padding:0 28px; }
  .film-grid{ grid-template-columns:1fr; padding:0 28px; }
  .look-grid{ grid-template-columns:1fr; }
  .look-panel{ border-left:1px solid var(--line); border-top:0; padding:32px 24px; }
  .cat-grid{ grid-template-columns:repeat(2,1fr); }
  .cat-card{ min-height:220px; padding:28px 22px; }
  .cat-card:nth-child(4n+1){ border-left:0; }
  .cat-card:nth-child(2n+1){ border-left:1px solid var(--sumi); }
  .cat-grid > .cat-card:nth-last-child(-n+4){ border-bottom:0; }
  .cat-grid > .cat-card:nth-last-child(-n+2){ border-bottom:1px solid var(--sumi); }
  .shop-head .display{ font-size:54px; }
  .journal-head .display{ font-size:64px; }
  .pdp-grid{ grid-template-columns:1fr; }
  .pdp-gallery{ border-right:0; }
  .pdp-info{ padding:32px 24px; }
  .pdp-info .display{ font-size:42px; }
  .wear-grid{ grid-template-columns:1fr; gap:40px; }
  .wear-it{ padding:80px 28px; }
  .journal-feat .grid{ grid-template-columns:1fr; gap:28px; }
  .journal-feat .display{ font-size:48px; }
  footer .grid{ grid-template-columns:1fr 1fr; }
  /* Mobile top bar: keep the round mark + Bag; hide text nav */
  .topbar .nav-links, .topbar .nav-extra{ display:none; }
  .topbar > .row{ padding:12px 18px; }
  .wordmark .name{ font-size:19px; }
}

/* ============ Responsive — phone ============ */
@media (max-width:560px){
  .hero-text h1{ font-size:46px; }
  .hero-text{ padding:36px 20px; }
  .hero-meta-tl{ top:30px; left:30px; }
  .hero-meta-br{ bottom:64px; right:30px; }
  .hero-meta-bl{ bottom:30px; left:30px; }
  .manifesto{ padding:64px 20px; }
  .manifesto .display{ font-size:30px; }
  .stat .display{ font-size:32px; }
  .section-head{ padding:0 20px; }
  .section-head .display{ font-size:36px; }
  .grid-3, .grid-4, .shop-grid .grid{ gap:28px 14px; padding:0 20px; }
  .shop-grid{ padding:32px 20px 64px; }
  .shop-head{ padding:64px 20px 28px; }
  .shop-strip{ padding:14px 20px; }
  .grid-quote{ padding:28px 22px; gap:20px; }
  .grid-quote .display{ font-size:22px; }
  .film .head, .film-grid{ padding:0 20px; }
  .film .head .display{ font-size:40px; }
  .film-main .display{ font-size:24px !important; }
  .film-main .eyebrow{ top:16px !important; left:16px !important; }
  .film-main > div[style*="bottom:28px"]{ bottom:16px !important; left:16px !important; right:16px !important; }
  .film-play{ width:44px; height:44px; }
  .look .section-head{ padding:0 20px; }
  .look-grid{ padding:0 20px; }
  .look-panel{ padding:28px 18px; }
  .look-panel .display{ font-size:34px; }
  .cat-index{ padding:72px 20px; }
  .cat-grid{ grid-template-columns:1fr; }
  .cat-card{ min-height:170px; }
  .cat-card:nth-child(n){ border-left:1px solid var(--sumi); border-bottom:0; }
  .cat-grid > .cat-card:last-child{ border-bottom:1px solid var(--sumi); }
  .pdp-info{ padding:28px 18px; }
  .pdp-info .display{ font-size:34px; }
  .pdp-thumbs{ top:14px; left:14px; }
  .sg-card{ overflow-x:auto; }
  .sg-card .table{ min-width:420px; }
  .wear-it{ padding:64px 20px; }
  .wear-it .display{ font-size:38px; }
  .journal-head{ padding:64px 20px 32px; }
  .journal-head .display{ font-size:46px; }
  .journal-feat{ padding:44px 20px; }
  .journal-feat .display{ font-size:38px; }
  .journal-list{ padding:44px 20px 80px; }
  .journal-row{ flex-direction:column; gap:14px; }
  .journal-row .n{ font-size:30px; }
  footer{ padding:64px 20px 32px; }
  footer .grid{ grid-template-columns:1fr; }
  footer .imp{ flex-direction:column; gap:8px; }
}