/* V2: portrait-safe cover, readable gold inspiration, and proportioned DVV. */
#portada.hero{position:relative!important;margin:48px 0 0!important;padding:0!important;width:100%!important;height:calc(100svh - 48px)!important;min-height:560px!important;max-height:1050px!important;background:#eef2f5!important;overflow:hidden!important;isolation:isolate}
#portada.hero .heroPhoto{position:absolute!important;inset:18px 0 0 auto!important;display:block!important;width:auto!important;height:calc(100% - 18px)!important;min-width:0!important;max-width:none!important;max-height:none!important;aspect-ratio:2/3!important;object-fit:contain!important;object-position:center top!important;background:transparent!important;transform:none!important;-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 11%,#000 100%);mask-image:linear-gradient(to right,transparent 0%,#000 11%,#000 100%)}
#portada.hero .heroShade{position:absolute!important;inset:0!important;background:linear-gradient(90deg,rgba(20,24,27,.70) 0%,rgba(20,24,27,.42) 34%,rgba(20,24,27,.12) 58%,transparent 76%)!important;pointer-events:none!important}
#portada.hero .heroCopy{z-index:2!important;left:6vw!important;right:auto!important;bottom:10%!important;width:52%!important;max-width:720px!important;padding:0!important}
#portada.hero .heroCopy h1{font-size:clamp(54px,6.8vw,108px)!important;line-height:.98!important;letter-spacing:-.035em!important}
#portada.hero .heroCopy h2{font-size:clamp(11px,1.25vw,16px)!important;line-height:1.5!important;letter-spacing:.17em!important}
#portada.hero .scrollCue{z-index:3!important;bottom:22px!important}

#inspiracion,#inspiracion>.copy{background:#fff!important;background-image:none!important}
#inspiracion>.copy{color:#111!important;padding:clamp(56px,7vw,100px)!important}
#inspiracion>.copy p,#inspiracion>.copy h2,#inspiracion>.copy .kicker{color:#111!important;opacity:1!important;filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;text-shadow:none!important;transform:none!important}
#inspiracion>.copy>p:last-child{font-weight:400!important;max-width:78ch!important;font-size:clamp(16px,1.45vw,20px)!important;line-height:1.8!important}
#inspiracion>.copy h2{font-weight:400!important;line-height:1.12!important}

#dvv.dvvExact .dvvVisual .dvvCoat{padding:0 0 28px!important;min-height:0!important;gap:0!important}
#dvv.dvvExact .dvvVisual .dvvCoat .dvvGarment--central{display:block!important;width:min(330px,65vw)!important;height:300px!important;max-width:100%!important;margin:0 auto!important;cursor:zoom-in}
#dvv.dvvExact .dvvVisual .dvvCoat span{margin:18px 0 0!important;font-size:clamp(13px,1.4vw,17px)!important;line-height:1.7!important;letter-spacing:.22em!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid{border-top:.5px solid #d0d0ca!important;border-bottom:.5px solid #d0d0ca!important;gap:0!important;padding:0!important;margin-top:0!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid figure{min-height:0!important;height:auto!important;padding:24px 12px 18px!important;overflow:visible!important;display:block!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid .nocturnePair{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;align-items:start!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid .nocturneOutfit{display:grid!important;grid-template-rows:clamp(64px,11vw,150px) clamp(125px,23vw,300px)!important;gap:5px!important;height:auto!important;min-width:0!important;align-items:stretch!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid .dvvGarment{display:block!important;width:100%!important;height:100%!important;max-height:none!important;max-width:none!important;margin:0!important;overflow:hidden!important;cursor:zoom-in}
#dvv.dvvExact .dvvVisual .dvvLookGrid figcaption{position:static!important;inset:auto!important;margin:14px 0 0!important;padding:0!important;font-size:12px!important;line-height:1.4!important;letter-spacing:.12em!important}
#esencia.closing{scroll-margin-top:48px!important}
#esencia.closing>img{object-position:center top!important}

@media(max-width:720px){
 #portada.hero{height:calc(100svh - 48px)!important;min-height:540px!important;max-height:none!important}
 #portada.hero .heroPhoto{inset:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:center top!important;-webkit-mask-image:none!important;mask-image:none!important}
 #portada.hero .heroShade{background:linear-gradient(0deg,rgba(11,15,17,.76) 0%,rgba(11,15,17,.35) 31%,rgba(11,15,17,.08) 52%,transparent 70%)!important}
 #portada.hero .heroCopy{left:7vw!important;right:7vw!important;bottom:8%!important;width:auto!important;max-width:none!important}
 #portada.hero .heroCopy h1{font-size:clamp(42px,12vw,74px)!important;line-height:.96!important}
 #portada.hero .heroCopy h2{font-size:10px!important;letter-spacing:.15em!important}
 #portada.hero .heroBrand{margin-bottom:20px!important}
 #portada.hero .heroBrand img{max-width:145px!important}
 #portada.hero .heroBrand span{font-size:9px!important;letter-spacing:.25em!important}
 #portada.hero .scrollCue{bottom:13px!important;height:22px!important}
 #inspiracion>.copy{padding:54px 7vw 60px!important}
 #inspiracion>.copy>p:last-child{font-size:16px!important;line-height:1.8!important}
 #inspiracion>.copy h2{font-size:clamp(30px,8vw,46px)!important}
 #dvv.dvvExact .dvvVisual .dvvCoat .dvvGarment--central{width:min(250px,64vw)!important;height:230px!important}
 #dvv.dvvExact .dvvVisual .dvvCoat span{margin-top:14px!important;margin-bottom:0!important}
 #dvv.dvvExact .dvvVisual .dvvLookGrid figure{padding:18px 5px 14px!important}
 #dvv.dvvExact .dvvVisual .dvvLookGrid .nocturnePair{gap:5px!important}
 #dvv.dvvExact .dvvVisual .dvvLookGrid .nocturneOutfit{grid-template-rows:clamp(54px,15vw,96px) clamp(100px,30vw,190px)!important;gap:4px!important}
 #dvv.dvvExact .dvvVisual .dvvLookGrid figcaption{font-size:10px!important;margin-top:12px!important}
}
@media(max-width:720px) and (max-height:670px){#portada.hero{min-height:500px!important}.heroBrand{margin-bottom:12px!important}}

/* V4: complete source framing for the first editorial pair. */
#inspiracion .campaignDuo.campaignFramed{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:center!important;gap:0!important;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:auto!important;width:100%!important;padding:clamp(24px,3.5vw,56px) clamp(12px,2vw,32px)!important;background:#eef2f5!important;overflow:hidden!important;line-height:0!important}
#inspiracion .campaignDuo.campaignFramed>img:nth-child(n){display:block!important;width:100%!important;height:auto!important;min-width:0!important;max-width:100%!important;max-height:none!important;aspect-ratio:auto!important;margin:0!important;padding:0!important;border:0!important;object-fit:contain!important;object-position:center center!important;transform:none!important;scale:none!important;translate:none!important;clip-path:none!important;filter:none!important}
@media(max-width:720px){#inspiracion .campaignDuo.campaignFramed{padding:24px 12px!important}}


/* V6: dedicated coat space prevents overlap with the jeans and trousers. */
#dvv.dvvExact .dvvVisual .dvvLookGrid .nocturneOutfit--coat{position:relative!important;overflow:hidden!important;grid-template-rows:clamp(112px,20vw,265px) clamp(125px,23vw,300px)!important;gap:10px!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid .nocturneOutfit--coat>.dvvGarment--upper{position:static!important;z-index:auto!important;align-self:stretch!important;width:100%!important;max-width:100%!important;height:100%!important;max-height:100%!important;margin:0!important;overflow:hidden!important}
#dvv.dvvExact .dvvVisual .dvvLookGrid .nocturneOutfit--coat>.dvvGarment--lower{position:static!important;z-index:auto!important}
#portada.hero .heroPhoto{inset:20px 0 auto auto!important;height:calc(100% - 40px)!important;object-fit:contain!important;object-position:center center!important}
@media(max-width:720px){
 #dvv.dvvExact .dvvVisual .dvvLookGrid .nocturneOutfit--coat{grid-template-rows:clamp(100px,27vw,172px) clamp(100px,30vw,190px)!important;gap:8px!important}
 #portada.hero{height:auto!important;min-height:0!important;max-height:none!important;padding:16px 0 28px!important;background:#eef2f5!important}
 #portada.hero .heroPhoto{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;max-width:100%!important;aspect-ratio:2/3!important;object-fit:contain!important;object-position:center center!important;display:block!important}
 #portada.hero .heroCopy{bottom:9%!important}
 #portada.hero .heroShade{background:linear-gradient(0deg,rgba(11,15,17,.70) 0%,rgba(11,15,17,.28) 29%,transparent 65%)!important}
 #portada.hero .heroBrand{margin-bottom:14px!important}
 #portada.hero .heroCopy h1{font-size:clamp(38px,11vw,66px)!important}
}

/* V9: visible close control for the twelve-look drawer. */
#drawer .drawerTop #closeDrawer{display:grid!important;place-items:center!important;flex:0 0 44px!important;width:44px!important;height:44px!important;min-width:44px!important;padding:0!important;color:#111!important;-webkit-text-fill-color:#111!important;background:#fff!important;border:1px solid #c7c7c7!important;border-radius:50%!important;opacity:1!important;visibility:visible!important;cursor:pointer!important;line-height:1!important}
#drawer .drawerTop #closeDrawer svg{display:block!important;width:20px!important;height:20px!important;stroke:#111!important;fill:none!important;opacity:1!important}
#drawer .drawerTop #closeDrawer:hover{background:#f0f0f0!important}
#drawer .drawerTop #closeDrawer:focus-visible{outline:2px solid #111!important;outline-offset:3px!important}