/* Supplied botanical/material atlases and motion, with readable text at every width. */
.product-dialog{--scent-color:#b89b68;width:min(1160px,calc(100vw - 60px));border-radius:14px;scroll-padding-top:70px;scroll-padding-bottom:125px}
.dialog-header{position:sticky;top:0;z-index:8;background:var(--paper-light);height:58px}
.dialog-content{grid-template-columns:.95fr 1.15fr;min-height:650px}
.detail-visual{min-height:100%;align-self:stretch;isolation:isolate;overflow:hidden;background:var(--paper)}
.detail-visual:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 46%,color-mix(in srgb,var(--scent-color) 19%,transparent),transparent 64%);z-index:-1}
.scent-aura{position:absolute;inset:0;pointer-events:none;color:var(--scent-color)}
.scent-ring{position:absolute;left:50%;top:48%;width:310px;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--scent-color) 18%,transparent);border-radius:50%;transform:translate(-50%,-50%)}
.scent-ring-two{width:400px;border-style:dashed;border-color:color-mix(in srgb,var(--scent-color) 12%,transparent)}
.scent-ring-inner{width:220px;border-color:color-mix(in srgb,var(--scent-color) 10%,transparent)}
.scent-motes{position:absolute;inset:0}
.scent-mote{position:absolute;display:grid;place-items:center;width:76px;height:76px;opacity:.95}
.scent-mote .accord-art{width:76px;height:76px;filter:drop-shadow(0 5px 6px #51382f10)}
.scent-mote:nth-child(1){left:8%;top:16%;rotate:-12deg}
.scent-mote:nth-child(2){right:9%;top:27%;rotate:8deg}
.scent-mote:nth-child(3){left:5%;top:48%;rotate:8deg}
.scent-mote:nth-child(4){right:6%;top:66%;rotate:-7deg}
.scent-mote:nth-child(5){left:15%;top:79%;rotate:10deg}
.product-dialog[open] .scent-ring-two{animation:scent-orbit 90s linear infinite}
.product-dialog[open] .scent-mote{animation:scent-float 7s ease-in-out infinite;animation-delay:calc(var(--mote-order)*-.9s)}
.product-dialog[open] .detail-photo-crop{animation:perfume-reveal .6s ease-out both}
.detail-visual .photo-trigger{z-index:1}
.detail-visual .package-photo{z-index:2;bottom:22px}
.detail-visual .photo-expand-label{right:0;bottom:0;background:var(--paper-light);mix-blend-mode:normal}
.dialog-info{padding:26px 33px 25px;align-self:start}
.dialog-info .detail-brand{font-size:12px;margin-bottom:8px}
.dialog-info h2{font-size:43px;margin-bottom:11px;max-width:500px}
.detail-gender{display:inline-block;margin:0 10px 0 0;font-size:12px;letter-spacing:.04em}
.detail-presentation{display:inline;font-size:12px}
.detail-presentation[hidden]{display:none}
.detail-description{font-size:14px;margin:13px 0 0;line-height:1.75}
.aroma-section{margin-top:20px}
.aroma-section[hidden]{display:none}
.aroma-heading{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 15px;margin-bottom:11px}
.aroma-heading h3{font-family:var(--serif);font-size:28px;font-weight:400;color:var(--brown);margin:0}
.aroma-heading>span{font-size:12px;letter-spacing:.04em;color:var(--muted)}
.accord-list{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:0;padding:0}
.accord-card{min-width:0;display:grid;grid-template-columns:64px minmax(0,1fr);gap:13px;align-items:center;padding:9px 14px 9px 5px;border:1px solid #e9dfd1;border-radius:12px;background:linear-gradient(100deg,#f6e9d84d,var(--paper-light) 45%);color:var(--ink);position:relative}
.accord-art{display:block;width:64px;height:64px;flex-shrink:0;background-repeat:no-repeat}
.accord-copy{min-width:0;overflow-wrap:anywhere}
.accord-copy h4{font-size:14px;line-height:1.4;font-weight:600;margin:0 0 4px;color:var(--ink)}
.accord-copy p{font-size:14px;line-height:1.55;color:var(--muted);margin:0;text-wrap:pretty}
.product-dialog[open] .accord-card{animation:accord-reveal .4s ease-out both;animation-delay:calc(var(--accord-order)*45ms)}
.aroma-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr));gap:16px;margin:18px 0 0;padding-top:15px;border-top:1px solid var(--line)}
.aroma-facts>div{min-width:0}
.aroma-facts dt{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);line-height:1.5}
.aroma-facts dt svg,.aroma-facts dt span{display:block;width:20px;height:20px;fill:none;stroke:none;flex-shrink:0}
.aroma-facts dt span svg{width:20px;height:20px}
.aroma-facts dd{font-size:14px;font-weight:550;margin:7px 0 0;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}
.aroma-facts>div:first-child dd{font-size:24px;font-family:var(--serif);font-weight:400;line-height:1.2}
.aroma-footnote{font-size:12px;color:var(--muted);margin:11px 0 0;line-height:1.6}
.notes-disclosure{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.notes-disclosure[hidden]{display:none}
.notes-disclosure summary{display:flex;justify-content:space-between;gap:12px;list-style:none;font-size:14px;color:var(--brown);cursor:pointer;min-height:44px;align-items:center}
.notes-disclosure summary::-webkit-details-marker{display:none}
.notes-disclosure summary>span{font-size:18px;transition:transform .2s}
.notes-disclosure[open] summary>span{transform:rotate(45deg)}
.notes-disclosure .detail-notes{border-top:0;margin-top:6px}
@keyframes accord-reveal{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes perfume-reveal{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes scent-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes scent-float{0%,100%{translate:0 0}50%{translate:0 -5px}}
@media(min-width:651px){.detail-visual{position:sticky;top:58px;align-self:start;min-height:0;height:min(650px,calc(100dvh - 220px));--image-height:min(430px,calc(100dvh - 310px))}}
@media(max-width:1000px) and (min-width:651px){.dialog-info{padding:23px}.dialog-info h2{font-size:37px}.accord-card{grid-template-columns:62px minmax(0,1fr);gap:9px;padding-right:10px}.accord-art{width:62px;height:62px}.scent-mote,.scent-mote .accord-art{width:59px;height:59px}}
@media(max-width:800px) and (min-width:651px){.dialog-content{grid-template-columns:.8fr 1.2fr}.dialog-info{padding:23px 18px}.accord-card{grid-template-columns:50px minmax(0,1fr)}.accord-art{width:50px;height:50px}.detail-visual{padding:20px 14px}}
@media(max-width:650px){
 .product-dialog{width:100vw;border-radius:0;max-height:100dvh}.dialog-header{height:58px}
 .detail-visual{height:300px;min-height:300px;--image-height:220px;padding:20px 26px}
 .detail-visual .detail-photo-crop{max-width:280px}
 .scent-ring{width:215px;top:47%}.scent-ring-two{width:290px}.scent-ring-inner{width:150px}
 .scent-mote,.scent-mote .accord-art{width:54px;height:54px}
 .scent-mote:nth-child(1){left:12%;top:8%}.scent-mote:nth-child(2){right:10%;top:14%}.scent-mote:nth-child(3){left:6%;top:47%}.scent-mote:nth-child(4){right:8%;top:66%}.scent-mote:nth-child(5){left:17%;top:78%}
 .detail-visual .photo-expand-label{bottom:-7px;padding:11px}
 .detail-visual .package-photo{padding:11px 10px;bottom:14px;left:18px}
 .dialog-info{padding:23px 21px 30px}.dialog-info h2{font-size:39px;max-width:none;margin-bottom:11px}
 .aroma-section{margin-top:21px}.aroma-heading{margin-bottom:13px}
 .accord-card{grid-template-columns:64px minmax(0,1fr);gap:10px;padding:9px 12px 9px 5px}
 .aroma-facts{margin-top:21px;grid-template-columns:repeat(2,minmax(0,1fr))}.aroma-facts>div:last-child{grid-column:1/-1}
}
@media(max-width:370px){.dialog-info{padding-left:17px;padding-right:17px}.dialog-info h2{font-size:35px}.accord-card{grid-template-columns:54px minmax(0,1fr);gap:9px;padding-right:10px}.accord-art{width:54px;height:54px}.detail-visual{height:280px;min-height:280px;--image-height:195px}.aroma-facts{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.product-dialog *,.product-dialog *:before,.product-dialog *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
