.looks-page { background: var(--paper); }
.looks-page .wrap { width: min(1200px,calc(100% - 96px)); }
.looks-page img { display: block; max-width: 100%; }
.looks-page figure { margin: 0; }
.looks-masthead { padding-top: 35px; }
.looks-kicker,.looks-edition { display: flex; justify-content: space-between; align-items: center; gap: 20px; font-size: 8px; letter-spacing: 2px; color: #787f6a; }
.looks-title-row { display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.looks-title-row h1 { font-size: clamp(65px,8.5vw,120px); line-height: 1.1; letter-spacing: -5px; font-weight: 400; margin: 15px 0 22px; }
.looks-title-row h1 i { color: #778364; }
.looks-title-row p { font-size: 12px; color: var(--muted); line-height: 2; border-left: 1px solid var(--line); padding-left: 24px; }
.looks-edition { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 13px 0; }
.looks-edition a { color: var(--ink); font-size: 10px; letter-spacing: 0; }
.looks-edition a span { margin-left: 20px; }
.looks-cover { display: grid; grid-template-columns: .85fr 1.25fr .7fr; gap: 38px; align-items: center; padding: 43px 0 65px; }
.cover-story .eyebrow { font-size: 8px; letter-spacing: 1.8px; }
.cover-story h2 { font-size: clamp(43px,4.4vw,66px); line-height: 1.04; font-weight: 400; letter-spacing: -1.5px; margin: 28px 0; }
.cover-story h2 i { color: #758263; }
.cover-story>p { color: #7b806f; font-size: 12px; line-height: 2.1; margin-bottom: 25px; }
.cover-story .text-link { font-size: 11px; }
.cover-story .text-link span { margin-left: 27px; }
.cover-signature { border-top: 1px solid var(--line); margin-top: 60px; padding-top: 20px; font-size: 25px; line-height: 1.15; color: #8b927c; }
.cover-main { position: relative; overflow: hidden; display: block; }
.cover-main>img { width: 100%; aspect-ratio: 1848/2500; object-fit: cover; object-position: center bottom; transition: transform .6s; }
.cover-image-label { position: absolute; bottom: 0; left: 0; right: 0; display: flex; justify-content: space-between; padding: 34px 20px 17px; color: #fff; font-size: 8px; letter-spacing: 1.4px; background: linear-gradient(transparent,#1f2a2099); }
.cover-aside { padding-top: 35px; }
.cover-aside img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: center; }
.cover-aside figcaption { display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 8px; letter-spacing: 1.4px; }
.cover-aside figcaption>span:last-child { font-size: 17px; line-height: 1; }
.cover-aside>p { font-size: 34px; line-height: 1.1; font-weight: 400; color: #778265; margin: 25px 0 12px; }
.cover-small-note { color: #858978; font-size: 10px; }
.looks-cover { transition: grid-template-columns 650ms cubic-bezier(.22,1,.36,1); }
.looks-cover.is-aside-featured { grid-template-columns: .85fr .7fr 1.25fr; }
.looks-cover.is-aside-featured .cover-aside { padding-top: 0; }
.looks-cover.is-aside-featured .cover-aside>p,
.looks-cover.is-aside-featured .cover-small-note { display: none; }
.looks-cover.is-aside-featured .cover-main .cover-image-label { font-size: 7px; padding-inline: 12px; letter-spacing: .6px; }
.looks-cover.is-aside-featured .cover-main .cover-image-label>span:last-child { display: none; }
.looks-cover [role="button"] { cursor: zoom-in; }
.looks-collection { padding: 50px 0 35px; border-top: 1px solid var(--line); scroll-margin-top: 25px; }
.collection-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 28px; }
.collection-heading h2 { font-size: 34px; line-height: 1.5; font-weight: 400; margin: 12px 0 0; letter-spacing: -.8px; }
.collection-heading em { font-style: normal; color: #879079; }
.collection-heading>p { font-size: 11px; color: var(--muted); }
.looks-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-block: 1px solid var(--line); padding: 12px 0; margin-bottom: 30px; }
.looks-filters { display: flex; gap: 7px; flex-wrap: wrap; }
.looks-filters button { border: 0; border-radius: 30px; padding: 9px 19px; background: transparent; color: #747c67; font-size: 11px; transition: background .2s,color .2s; }
.looks-filters button:hover { background: #e8eadf; }
.looks-filters button[aria-pressed="true"] { background: #414e35; color: #fffaf0; }
.looks-filters button>span { margin-left: 14px; font-size: 9px; opacity: .7; }
#looks-count { flex: none; font-size: 8px; letter-spacing: 2px; color: #888d7c; }
.looks-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.diary-card { min-width: 0; }
.diary-card[hidden] { display: none; }
.diary-card>a { display: block; }
.diary-card-photo { position: relative; overflow: hidden; background: #e7e9de; }
.diary-card-photo>img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: center; transition: transform .5s; }
.diary-card[data-slug="soft-garden"] .diary-card-photo>img { object-position: center bottom; }
.diary-card-number { position: absolute; top: 14px; left: 14px; color: #fff; font-size: 9px; letter-spacing: 1.5px; background: #2a352a70; padding: 5px 9px; }
.diary-card-open { position: absolute; right: 13px; bottom: 13px; display: grid; place-items: center; width: 38px; height: 38px; background: #faf7f0ed; border-radius: 50%; font-size: 22px; }
.diary-card-meta { display: flex; justify-content: space-between; font-size: 8px; letter-spacing: 1.4px; color: #828974; margin-top: 20px; }
.diary-card h3 { font-size: 20px; font-weight: 400; margin: 9px 0 4px; }
.diary-card-subtitle { font-size: 22px; font-style: italic; color: #868e78; margin: 0 0 15px; }
.diary-card-tags { font-size: 9px; color: #7c836e; border-top: 1px solid var(--line); padding-top: 12px; }
.product-parade { padding: 42px 0 48px; margin-top: 25px; background: #eeeee3; }
.parade-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 30px!important; }
.parade-heading h2 { font-size: clamp(36px,4vw,52px); font-weight: 400; line-height: 1.1; margin: 12px 0; }
.parade-heading h2 i { color: #7e896d; }
.parade-heading p { font-size: 11px; color: var(--muted); margin: 0; }
#parade-toggle { background: transparent; border: 1px solid #cdd2c0; border-radius: 25px; color: #646e55; font-size: 10px; padding: 9px 15px; flex: none; }
.parade-window { overflow: hidden; }
.parade-track { display: flex; width: max-content; animation: parade-drift 100s linear infinite; }
.parade-group { display: flex; gap: 20px; padding-right: 20px; flex: none; }
.parade-item { display: block; width: 170px; flex: none; padding: 16px 15px 13px; border: 1px solid #dfdfd2; border-radius: 12px; background: #faf8f0; text-align: center; }
.parade-item img { width: 100%; height: 140px; object-fit: contain; mix-blend-mode: multiply; transition: transform .3s; }
.parade-item span { display: block; font-size: 11px; margin-top: 13px; }
.parade-item:hover img { transform: translateY(-4px); }
.product-parade:hover .parade-track,.product-parade:focus-within .parade-track,.product-parade.is-paused .parade-track { animation-play-state: paused; }
@keyframes parade-drift { to { transform: translateX(-50%); } }
@media(max-width:700px) {
  .product-parade { padding: 30px 0; }
  .parade-heading { gap: 10px; }
  #parade-toggle { font-size: 9px; padding: 8px 10px; }
  .parade-item { width: 140px; padding: 12px; }
  .parade-item img { height: 115px; }
  .parade-group { gap: 14px; padding-right: 14px; }
}
@media(prefers-reduced-motion:reduce) {
  .parade-track { animation: none; }
  .parade-window { overflow-x: auto; }
  .parade-group[aria-hidden="true"] { display: none; }
  .parade-item img { transition: none; }
  #parade-toggle { display: none; }
}
.looks-closing { padding: 65px 0 80px; text-align: center; }
.looks-closing>p { font-size: clamp(40px,5vw,65px); font-weight: 400; line-height: 1.1; letter-spacing: -1.4px; margin: 20px 0; }
.looks-closing>p i { color: #839074; }
.looks-closing>span:last-child { font-size: 11px; color: var(--muted); }
/* Detail landing uses the existing look-layout product presentation. */
.look-detail-page .detail-wrap { width: min(1100px,calc(100% - 96px)); margin: 0 auto; padding: 32px 0 65px; }
.detail-back { font-size: 11px; color: var(--muted); }
.detail-heading { padding: 35px 0; }
.detail-heading h1 { font-size: clamp(28px,4vw,45px); font-weight: 400; margin: 12px 0; }
.detail-heading>p { color: var(--muted); font-size: 12px; }
.detail-cover { position: relative; border-radius: 18px; overflow: hidden; background: #e7e9de; }
.detail-cover>img { display: block; width: 100%; height: 100%; object-fit: cover; }
.detail-cover .hotspot { width: 32px; height: 32px; padding: 0; }
.detail-cover .hotspot>span { width: 29px; height: 29px; font-size: 11px; }
.detail-side { min-width: 0; }
.related-looks { margin-top: 70px; padding-top: 38px; border-top: 1px solid var(--line); }
.related-heading { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-bottom: 30px; }
.related-heading h2 { font-size: 32px; font-weight: 400; margin: 12px 0 5px; }
.related-heading h2 em { font-style: normal; color: #879079; }
.related-heading p { font-size: 27px; color: #80896f; margin: 0; }
.related-heading .text-link { flex: none; font-size: 11px; }
.related-grid { grid-template-columns: repeat(auto-fit,minmax(0,1fr)); }
.related-grid .diary-card-photo>img { height: 390px; aspect-ratio: auto; }
@media(max-width:700px) {
  .related-looks { margin-top: 45px; padding-top: 27px; }
  .related-heading { gap: 15px; align-items: end; }
  .related-heading h2 { font-size: 25px; }
  .related-heading p { font-size: 21px; }
  .related-heading .text-link { font-size: 9px; }
  .related-grid .diary-card-photo>img { height: auto; aspect-ratio: 3/4; }
}
@media(hover:hover) { .cover-main:hover>img,.diary-card>a:hover .diary-card-photo>img { transform: scale(1.025); } }
@media(max-width:1050px) {
  .looks-page .wrap { width: calc(100% - 56px); }
  .looks-cover { gap: 23px; grid-template-columns: .8fr 1.2fr .7fr; }
  .looks-cover.is-aside-featured { grid-template-columns: .8fr .7fr 1.2fr; }
  .cover-story h2 { font-size: 45px; }
  .cover-signature { margin-top: 30px; }
  .cover-aside>p { font-size: 26px; }
  .looks-title-row h1 { font-size: 85px; }
  .looks-grid { gap: 20px; }
}
@media(max-width:700px) {
  .looks-page .wrap,.look-detail-page .detail-wrap { width: calc(100% - 40px); }
  .looks-masthead { padding-top: 24px; }
  .looks-kicker { font-size: 7px; letter-spacing: 1.2px; }
  .looks-kicker>span:last-child { display: none; }
  .looks-title-row { display: block; }
  .looks-title-row h1 { font-size: clamp(49px,12.5vw,80px); letter-spacing: -2.6px; margin: 16px 0 12px; }
  .looks-title-row p { border: 0; padding: 0; font-size: 11px; margin: 0 0 20px; }
  .looks-title-row p br { display: none; }
  .looks-edition { font-size: 6px; letter-spacing: 1px; gap: 10px; }
  .looks-edition a { font-size: 9px; }
  .looks-edition a span { margin-left: 4px; }
  .looks-cover { grid-template-columns: 1fr 1fr; gap: 22px 15px; padding: 26px 0 40px; align-items: center; }
  .looks-cover.is-aside-featured { grid-template-columns: 1fr 1fr; }
  .looks-cover.is-aside-featured .cover-aside { grid-column: 1/-1; grid-row: 1; }
  .looks-cover.is-aside-featured .cover-main { grid-column: 2; grid-row: 2; }
  .looks-cover.is-aside-featured .cover-story { grid-column: 1; grid-row: 2; }
  .cover-main { grid-column: 1/-1; grid-row: 1; }
  .cover-main>img { aspect-ratio: 1848/2350; }
  .cover-story h2 { font-size: 38px; margin: 16px 0; }
  .cover-story .eyebrow { font-size: 6px; letter-spacing: 1px; }
  .cover-story>p { font-size: 10px; margin: 0 0 18px; }
  .cover-story .text-link { font-size: 10px; }
  .cover-signature { display: none; }
  .cover-aside { padding: 0; }
  .cover-aside figcaption { font-size: 6px; letter-spacing: .5px; padding: 10px 0; }
  .cover-aside>p { font-size: 25px; margin: 15px 0 0; }
  .cover-small-note { display: none; }
  .looks-collection { padding-top: 30px; }
  .collection-heading { display: block; }
  .collection-heading h2 { font-size: 29px; }
  .collection-heading>p { font-size: 10px; margin: 10px 0 0; }
  .looks-toolbar { gap: 6px; align-items: start; }
  .looks-filters { gap: 3px; }
  .looks-filters button { font-size: 10px; padding: 8px 10px; }
  .looks-filters button>span { display: none; }
  #looks-count { font-size: 7px; letter-spacing: 1px; }
  .looks-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px 15px; }
  .diary-card-meta { font-size: 6px; letter-spacing: .5px; margin-top: 12px; }
  .diary-card h3 { font-size: 15px; margin-top: 7px; }
  .diary-card-subtitle { font-size: 18px; line-height: 1.2; min-height: 43px; }
  .diary-card-open { width: 29px; height: 29px; font-size: 18px; right: 8px; bottom: 8px; }
  .diary-card-number { top: 8px; left: 8px; font-size: 7px; }
  .diary-card-tags { font-size: 8px; }
  .looks-closing { padding: 35px 0 55px; }
  .looks-closing>p { font-size: 39px; }
  .looks-closing>span:last-child { font-size: 10px; }
}
@media(prefers-reduced-motion:reduce) { .cover-main>img,.diary-card-photo>img,.looks-filters button { transition: none; } }
@media(prefers-reduced-motion:reduce) { .looks-cover { transition: none; } }

/* Live Look states and original-image hotspot coordinates. */
.looks-page [hidden],.look-detail-page [hidden] { display:none!important; }
.look-state { grid-column:1/-1; padding:48px 0; border-bottom:1px solid var(--line); }
.look-state>.en { font-size:38px; font-style:italic; margin:16px 0; }
.look-state>p:not(.en) { font-size:13px; color:var(--muted); }
.look-retry { appearance:none; background:var(--olive); color:var(--paper); border:1px solid var(--olive); border-radius:40px; min-height:46px; padding:11px 24px; font:inherit; font-size:13px; cursor:pointer; }
.look-retry:hover { transform:translateY(-2px); }
.look-missing-photo { display:grid; place-items:center; min-height:180px; padding:24px; color:var(--muted); background:var(--paper); font-size:12px; }
.diary-card-photo>.look-missing-photo { aspect-ratio:3/4; }
.looks-cover.single-cover { grid-template-columns:.85fr 1.25fr; max-width:960px; }
.looks-cover .cover-main>img { object-position:center; }
.look-detail-page .detail-cover { align-self:start; }
.look-detail-page .detail-cover>img { width:100%; height:auto; object-fit:contain; }
.look-detail-page .look-options { grid-template-columns:repeat(auto-fit,minmax(85px,1fr)); }
.look-without-products { display:block; max-width:720px; margin-inline:auto; }
.detail-heading .detail-title-en { font-size:30px; color:var(--olive); }
.detail-description { white-space:pre-line; }
.detail-meta { display:flex; flex-wrap:wrap; align-items:center; gap:16px; font-size:12px; color:var(--muted); }
.look-stores { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.look-store { display:inline-flex; align-items:center; justify-content:center; min-height:40px; border-radius:40px; padding:8px 24px; font-size:12px; background:var(--store-bg,var(--olive)); color:var(--store-text,var(--paper)); }
.detail-gallery-section { margin-top:64px; }
.detail-gallery-section h2 { font-size:38px; font-weight:400; margin:16px 0 32px; }
.detail-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.detail-gallery figure { margin:0; }
.detail-gallery img { display:block; width:100%; height:auto; }
.detail-video { display:block; max-width:100%; max-height:80vh; margin:48px auto; }
.look-disclosure { font-size:11px; color:var(--muted); margin-top:32px; }
.look-detail-page .look-product-copy h2 { font-size:23px; font-weight:500; margin:0 0 12px; }
.product-parade.is-static .parade-track { width:100%; animation:none; justify-content:center; }
.product-parade.is-static .parade-group { padding:0 20px; }
.product-parade.is-static .parade-group[aria-hidden="true"] { display:none; }
@media(max-width:700px) { .looks-cover.single-cover { grid-template-columns:1fr; } .single-cover .cover-story { grid-row:2; } .detail-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } }
