/* ========================================================================== Atelier Numen · Unique Jewelry — shared object-record stylesheet Used by the three complete antiquities. Each page sets its own culture pigment on . ========================================================================== */ :root{ --ink:#0b0b0a; --bone:#f1ede4; --paper:#e8e1d4; --paper-deep:#d7cdbc; --accent:#55b7b4; --accent-deep:#236f72; --red:#a84332; --white-72:rgba(241,237,228,.72); --white-46:rgba(241,237,228,.46); --white-18:rgba(241,237,228,.18); --line-dark:rgba(11,11,10,.16); --line-light:rgba(241,237,228,.18); --serif:"Newsreader",Georgia,serif; --sans:"Manrope",-apple-system,BlinkMacSystemFont,sans-serif; --pad:clamp(20px,4.4vw,72px); --section:clamp(88px,11vw,168px); --max:1560px; --bar:0px; --ease:cubic-bezier(.2,.75,.2,1); } *{box-sizing:border-box} html{scroll-behavior:smooth;background:var(--ink)} body{margin:0;color:var(--ink);background:var(--bone);font-family:var(--sans);font-weight:300;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;padding-bottom:var(--bar)} body.locked{overflow:hidden} img{display:block;max-width:100%} figure{margin:0} a{color:inherit} button,input,textarea{font:inherit} button{color:inherit} button,a{-webkit-tap-highlight-color:transparent} button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:1px solid var(--accent);outline-offset:5px} ::selection{background:var(--accent);color:var(--ink)} .container{width:min(100%,var(--max));margin:0 auto;padding-inline:var(--pad)} .eyebrow{margin:0;font-size:10px;line-height:1.4;font-weight:600;letter-spacing:.25em;text-transform:uppercase} .muted{color:rgba(11,11,10,.58)} .muted-light{color:var(--white-46)} .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)} .reveal.is-visible{opacity:1;transform:none} .word-mask{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.08em .025em .16em;margin:-.08em -.025em -.16em} .word-mask>i{display:inline-block;font-style:inherit;will-change:transform} .cinematic{clip-path:inset(0);will-change:clip-path} /* --- image placeholder (asset not yet produced) ------------------------- */ .placeholder{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;height:100%;min-height:280px;padding:26px; background:repeating-linear-gradient(135deg,rgba(11,11,10,.045) 0 2px,transparent 2px 11px),var(--paper-deep); color:rgba(11,11,10,.72);border:1px solid rgba(11,11,10,.22)} .placeholder::before{content:"Image pending";align-self:flex-start;padding:6px 10px;border:1px solid currentColor;font-size:9px;font-weight:600;letter-spacing:.2em;text-transform:uppercase} .placeholder p{max-width:44ch;margin:0;font-family:var(--serif);font-size:clamp(16px,1.6vw,21px);line-height:1.25} .placeholder small{display:block;font-size:9px;font-weight:600;letter-spacing:.17em;text-transform:uppercase;opacity:.62} .on-dark .placeholder,.placeholder.dark{background:repeating-linear-gradient(135deg,rgba(241,237,228,.05) 0 2px,transparent 2px 11px),#26251f;color:var(--white-72);border-color:rgba(241,237,228,.26)} .progress{position:fixed;inset:0 0 auto;z-index:90;height:2px;pointer-events:none} .progress span{display:block;width:100%;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left} .chapter-rail{position:fixed;z-index:60;top:50%;right:17px;display:flex;flex-direction:column;align-items:center;gap:13px;transform:translateY(-50%);mix-blend-mode:difference;color:#fff} .chapter-rail a{width:5px;height:5px;border:1px solid currentColor;border-radius:50%;text-decoration:none;opacity:.48;transition:opacity .3s ease,background .3s ease,transform .3s ease} .chapter-rail a:hover,.chapter-rail a.active{background:currentColor;opacity:1;transform:scale(1.35)} .chapter-rail span{margin-top:3px;font-size:7px;font-weight:600;letter-spacing:.2em;writing-mode:vertical-rl;text-transform:uppercase;opacity:.55} /* --- chrome ------------------------------------------------------------- */ .topline{position:absolute;inset:0 0 auto;z-index:20;height:32px;display:flex;justify-content:center;align-items:center;color:var(--white-72);border-bottom:1px solid var(--line-light);background:rgba(0,0,0,.16);backdrop-filter:blur(10px)} .topline p{margin:0;font-size:9px;letter-spacing:.2em;text-transform:uppercase} .site-header{position:absolute;top:32px;left:0;right:0;z-index:20;height:92px;color:var(--bone);border-bottom:1px solid var(--line-light)} .site-header .inner{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px} .nav{display:flex;align-items:center;gap:clamp(16px,2.4vw,38px)} .nav.right{justify-content:flex-end} .nav a,.header-action{font-size:10px;letter-spacing:.19em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:opacity .3s ease} .nav a:hover,.header-action:hover{opacity:.58} .brand{display:flex;align-items:center;gap:12px;text-decoration:none} .brand img{width:42px;height:42px;object-fit:contain} .brand .wordmark{font-family:var(--serif);font-size:20px;line-height:1;font-weight:300;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap} .header-action{border:0;padding:0;background:none;cursor:pointer} .menu-toggle{display:none;width:32px;height:32px;border:0;background:none;padding:7px 4px;cursor:pointer} .menu-toggle span{display:block;height:1px;background:currentColor;margin:6px 0} .mobile-menu{position:fixed;z-index:85;inset:98px 0 0;display:none;grid-template-rows:1fr auto;padding:48px var(--pad) 30px;color:var(--bone);background:rgba(11,11,10,.98);opacity:0;visibility:hidden;transform:translateY(-12px);transition:opacity .35s ease,visibility .35s ease,transform .5s var(--ease)} .mobile-menu.open{opacity:1;visibility:visible;transform:none} .mobile-menu nav{display:flex;flex-direction:column;align-items:flex-start} .mobile-menu nav a{padding:7px 0;font-family:var(--serif);font-size:clamp(38px,11vw,56px);line-height:1.08;text-decoration:none} .mobile-menu nav a span{margin-right:13px;font-family:var(--sans);font-size:8px;letter-spacing:.13em;color:var(--accent)} .mobile-menu-foot{display:flex;justify-content:space-between;gap:20px;padding-top:22px;border-top:1px solid var(--line-light);color:var(--white-46);font-size:8px;letter-spacing:.13em;text-transform:uppercase} /* --- hero --------------------------------------------------------------- */ .hero{position:relative;min-height:100svh;color:var(--bone);background:#060605;overflow:hidden} .hero-media{position:absolute;inset:0} .hero-media img{width:100%;height:100%;object-fit:cover;object-position:var(--hero-pos,61% 45%);filter:brightness(1.2) contrast(1.04) saturate(1.06);scale:1.06;animation:hero-in 2s var(--ease) both} .hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,4,.78) 0%,rgba(5,5,4,.52) 32%,rgba(5,5,4,.08) 65%,rgba(5,5,4,.2) 100%),linear-gradient(0deg,rgba(5,5,4,.7) 0%,transparent 43%,rgba(5,5,4,.06) 100%)} @keyframes hero-in{from{opacity:0;scale:1.1}to{opacity:1;scale:1.03}} .hero-content{position:relative;z-index:2;min-height:100svh;padding-top:clamp(172px,20vh,236px);padding-bottom:clamp(76px,10vh,104px);display:grid;grid-template-columns:minmax(0,6fr) minmax(240px,3fr);gap:40px;align-items:end} .hero-copy{align-self:center} .hero-kicker{display:flex;align-items:center;gap:14px;color:var(--white-72);margin-bottom:26px} .hero-kicker i{width:38px;height:1px;background:var(--accent)} .hero h1{max-width:9.3ch;margin:0;font-family:var(--serif);font-size:clamp(56px,7.1vw,120px);line-height:.84;font-weight:300;letter-spacing:-.045em} .hero h1 em{color:var(--accent);font-style:normal} .hero-note{align-self:end;padding-bottom:2px} .hero-note p{max-width:34ch;margin:0 0 28px;font-family:var(--serif);font-size:clamp(20px,1.9vw,28px);line-height:1.18} .hero-note .meta{display:grid;grid-template-columns:auto 1fr;gap:10px 26px;padding-top:18px;border-top:1px solid var(--line-light)} .hero-note .meta span{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:var(--white-46)} .hero-note .meta b{justify-self:end;font-family:var(--serif);font-size:18px;font-weight:300} .scroll-mark{position:absolute;z-index:3;left:var(--pad);bottom:26px;display:flex;align-items:center;gap:13px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--white-46)} .scroll-mark i{position:relative;width:54px;height:1px;background:var(--white-18);overflow:hidden} .scroll-mark i::after{content:"";position:absolute;inset:0;background:var(--accent);transform:translateX(-100%);animation:scroll-line 2.4s ease-in-out infinite} @keyframes scroll-line{0%{transform:translateX(-100%)}55%,100%{transform:translateX(100%)}} /* --- the piece: gallery + acquisition ----------------------------------- */ .product{padding-block:var(--section)} .product-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(330px,4fr);gap:clamp(40px,6vw,104px);align-items:start} .gallery{position:sticky;top:24px} .gallery-stage{position:relative;aspect-ratio:4/3;background:#11110f;overflow:hidden;cursor:zoom-in} .gallery-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;scale:1.025;transition:opacity .7s var(--ease),scale 1.3s var(--ease)} .gallery-stage img.active{opacity:1;scale:1} .gallery-stage img[data-fit="portrait"]{object-position:50% 39%} .gallery-stage img[data-fit="bust"]{object-position:50% 34%} .image-index{position:absolute;inset:auto auto 18px 18px;z-index:2;padding:8px 11px;background:rgba(7,7,6,.66);backdrop-filter:blur(10px);color:var(--bone);font-size:9px;letter-spacing:.16em;text-transform:uppercase} .zoom-hint{position:absolute;inset:18px 18px auto auto;z-index:2;width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(7,7,6,.28);color:var(--bone)} .zoom-hint svg{width:17px;height:17px} .thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:9px;margin-top:9px} .thumb{position:relative;aspect-ratio:5/4;border:0;padding:0;background:var(--ink);overflow:hidden;cursor:pointer} .thumb img{width:100%;height:100%;object-fit:cover;opacity:.62;transition:opacity .3s ease,scale .7s var(--ease)} .thumb[data-fit="portrait"] img{object-position:50% 37%} .thumb[data-fit="bust"] img{object-position:50% 34%} .thumb::after{content:"";position:absolute;inset:0;border:1px solid transparent;transition:border-color .3s ease} .thumb:hover img,.thumb[aria-selected="true"] img{opacity:1;scale:1.025} .thumb[aria-selected="true"]::after{border-color:var(--accent)} .gallery-caption{display:flex;justify-content:space-between;gap:20px;margin-top:13px;font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:rgba(11,11,10,.52)} .gallery-caption span:last-child{text-align:right} .product-info{padding-top:2px} .product-ref{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--line-dark);color:rgba(11,11,10,.5)} .product-ref span{font-size:10px;letter-spacing:.18em;text-transform:uppercase} .status{display:flex;align-items:center;gap:8px;color:var(--accent-deep)} .status i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(0,0,0,.06)} .product-info h2{margin:28px 0 18px;font-family:var(--serif);font-size:clamp(44px,4.6vw,68px);font-weight:300;line-height:.96;letter-spacing:-.035em} .product-summary{max-width:44ch;margin:0 0 34px;color:rgba(11,11,10,.66);font-size:14px} .price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:24px 0 26px;border-top:1px solid var(--line-dark)} .price{display:block;font-family:var(--serif);font-size:clamp(40px,3.6vw,48px);line-height:1;font-weight:300} .price-alt{display:block;margin-top:10px;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(11,11,10,.5)} .vat{padding-bottom:4px;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(11,11,10,.48);white-space:nowrap} .actions{display:grid;grid-template-columns:1fr auto;gap:9px} .btn{position:relative;isolation:isolate;min-height:58px;display:inline-flex;align-items:center;justify-content:center;gap:11px;border:1px solid var(--ink);padding:0 25px;background:transparent;font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;cursor:pointer;overflow:hidden;transition:color .4s var(--ease),border-color .4s var(--ease)} .btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease)} .btn:hover::before{transform:scaleY(1)} .btn:hover{color:var(--bone)} .btn-primary{color:var(--bone);background:var(--ink)} .btn-primary::before{background:var(--accent-deep);transform:scaleY(1);transform-origin:top} .btn-primary:hover::before{transform:scaleY(0)} .btn-primary:hover{color:var(--bone)} .btn-icon{width:58px;padding:0} .btn svg{width:15px;height:15px} .microcopy{margin:12px 0 32px;font-size:11px;color:rgba(11,11,10,.48);text-align:center} .quick-facts{margin:0;border-top:1px solid var(--line-dark)} .quick-facts>div{display:grid;grid-template-columns:1fr 1.3fr;gap:20px;padding:15px 0;border-bottom:1px solid var(--line-dark)} .quick-facts dt{font-size:9px;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:rgba(11,11,10,.46)} .quick-facts dd{margin:0;font-family:var(--serif);font-size:20px;line-height:1.2;text-align:right} .included{margin-top:29px} .included h3{margin:0 0 10px;font-size:10px;letter-spacing:.18em;text-transform:uppercase} .included ul{margin:0;padding:0;list-style:none} .included li{display:grid;grid-template-columns:20px 1fr;gap:12px;padding:10px 0;font-size:12px;color:rgba(11,11,10,.65)} .included svg{width:16px;height:16px;color:var(--accent-deep)} /* --- worn ---------------------------------------------------------------- */ .wear{display:grid;grid-template-columns:minmax(0,7fr) minmax(310px,5fr);background:var(--paper)} .wear-media{position:relative;display:grid;min-height:min(760px,86svh);overflow:hidden;background:#0b0b0a} .wear-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--wear-pos,50% 39%)} .wear-index{position:absolute;z-index:2;inset:auto auto 28px 28px;color:var(--bone)} .wear-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(64px,7vw,112px) var(--pad)} .wear-copy h2{margin:17px 0 26px;font-family:var(--serif);font-weight:300;font-size:clamp(48px,5.4vw,84px);line-height:.88;letter-spacing:-.045em} .wear-copy h2 em{color:var(--accent-deep);font-style:normal} .wear-copy>p{max-width:39ch;margin:0 0 32px;color:rgba(11,11,10,.65)} .scale-line{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-dark)} .scale-line div{padding:17px 14px 0 0} .scale-line strong{display:block;font-family:var(--serif);font-size:27px;font-weight:300} .scale-line span{font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:rgba(11,11,10,.48)} /* --- material ------------------------------------------------------------ */ .material{color:var(--bone);background:var(--ink);padding-block:var(--section)} .material-grid{display:grid;grid-template-columns:minmax(280px,4fr) minmax(0,8fr);gap:clamp(40px,6vw,104px);align-items:center} .material-copy h2,.provenance h2,.passport h2{margin:17px 0 27px;font-family:var(--serif);font-weight:300;font-size:clamp(48px,5.6vw,90px);line-height:.88;letter-spacing:-.045em} .material-copy h2 em,.provenance h2 em{color:var(--accent);font-style:normal} .material-copy>p{max-width:41ch;margin:0;color:var(--white-72);font-size:14px} .material-numbers{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;margin-top:40px;border-top:1px solid var(--line-light)} .material-numbers div{padding-top:15px} .material-numbers strong{display:block;font-family:var(--serif);font-size:28px;font-weight:300} .material-numbers span{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--white-46)} .macro-frame{position:relative;aspect-ratio:16/10;overflow:hidden;cursor:crosshair} .macro-frame>img{width:100%;height:100%;object-fit:cover} .lens{position:absolute;width:clamp(150px,17vw,260px);aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.84);background-image:var(--macro);background-repeat:no-repeat;box-shadow:0 22px 70px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.55);transition:opacity .25s ease,transform .35s var(--ease)} .macro-frame:hover .lens,.macro-frame.touching .lens{opacity:1;transform:translate(-50%,-50%) scale(1)} .macro-caption{display:flex;justify-content:space-between;gap:20px;margin-top:12px;color:var(--white-46)} .macro-caption span{font-size:9px;letter-spacing:.15em;text-transform:uppercase} .colour-essay{margin-top:var(--section)} .colour-head{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;align-items:end;margin-bottom:48px} .colour-head p:last-child{max-width:58ch;margin:0;color:var(--white-72);font-family:var(--serif);font-size:clamp(22px,2.4vw,35px);line-height:1.17} .swatches{display:grid;grid-template-columns:repeat(6,1fr);min-height:270px} .swatch{position:relative;border:0;border-right:1px solid rgba(255,255,255,.16);padding:18px;color:var(--bone);background:var(--swatch);text-align:left;cursor:pointer;overflow:hidden} .swatch:last-child{border-right:0} .swatch::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)} .swatch[aria-selected="true"]::after{transform:scaleX(1)} .swatch div{position:absolute;left:18px;right:18px;bottom:20px} .swatch strong{display:block;font-family:var(--serif);font-size:clamp(19px,1.9vw,29px);font-weight:300;line-height:1.05} .swatch span{display:block;margin-top:6px;font-size:8px;letter-spacing:.16em;text-transform:uppercase;opacity:.72} .swatch.light{color:var(--ink)} .colour-story{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;min-height:120px;margin-top:34px} .colour-word{margin:0;font-family:var(--serif);font-size:clamp(48px,5.4vw,84px);line-height:.9;color:var(--accent)} .colour-body{max-width:58ch;margin:7px 0 0;color:var(--white-72)} /* --- a work from the period --------------------------------------------- */ .period-work{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);color:var(--ink);background:var(--paper-deep);overflow:hidden} .period-copy{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:space-between;gap:56px;padding:clamp(80px,9vw,140px) var(--pad) clamp(52px,6vw,90px)} .period-copy .chapter{display:flex;align-items:center;gap:15px} .period-copy .chapter span:first-child{font-family:var(--serif);font-size:30px;color:var(--red)} .period-copy .chapter i{width:36px;height:1px;background:rgba(11,11,10,.25)} .period-copy h2{max-width:9ch;margin:44px 0 32px;font-family:var(--serif);font-size:clamp(54px,6.6vw,104px);font-weight:300;line-height:.86;letter-spacing:-.05em} .period-copy h2 em{color:var(--accent-deep);font-style:normal} .period-copy .lead{max-width:37ch;margin:0;font-family:var(--serif);font-size:clamp(21px,2.2vw,32px);line-height:1.18} .period-copy .truth{max-width:52ch;margin:0;padding-top:17px;border-top:1px solid rgba(11,11,10,.25);font-size:12px;line-height:1.7;color:rgba(11,11,10,.62)} .period-art{position:relative;min-height:620px;background:var(--period-bg,#efe9de)} .period-art>a,.period-art>.placeholder{position:absolute;inset:0;display:block} .period-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:var(--period-fit,cover);object-position:50% 42%} .art-caption{position:absolute;z-index:2;right:24px;bottom:24px;max-width:min(520px,calc(100% - 48px));padding:9px 12px;color:var(--bone);background:rgba(11,11,10,.62);backdrop-filter:blur(8px);font-size:8px;line-height:1.6;letter-spacing:.15em;text-transform:uppercase} /* --- time ---------------------------------------------------------------- */ .time{position:relative;display:grid;align-items:end;color:var(--bone);background:var(--ink);overflow:hidden} .time-bg{position:absolute;inset:0;opacity:.34} .time-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.68) contrast(1.08);scale:1.05} .time-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 68% 38%,transparent 0%,rgba(11,11,10,.42) 38%,rgba(11,11,10,.96) 84%),linear-gradient(0deg,var(--ink),transparent 42%)} .time-inner{position:relative;z-index:2;padding-block:clamp(104px,14vh,180px) clamp(54px,7vh,84px)} .time h2{max-width:10.7ch;margin:18px 0 76px;font-family:var(--serif);font-weight:300;font-size:clamp(58px,8.4vw,132px);line-height:.83;letter-spacing:-.055em} .time h2 span{color:var(--accent)} .timeline{--line-progress:1;position:relative;display:grid;grid-template-columns:repeat(5,1fr)} .timeline::after{content:"";position:absolute;inset:0 0 auto;height:1px;background:var(--line-light);transform:scaleX(var(--line-progress));transform-origin:left} .moment{position:relative;padding:24px 30px 0 0} .moment::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--white-46)} .moment.active::before{background:var(--accent);box-shadow:0 0 0 7px rgba(255,255,255,.1)} .moment .year{font-family:var(--serif);font-size:clamp(23px,2.4vw,37px);line-height:1} .moment.active .year{color:var(--accent)} .moment p{max-width:19ch;margin:10px 0 0;font-size:10px;line-height:1.55;letter-spacing:.08em;text-transform:uppercase;color:var(--white-46)} /* --- geography ----------------------------------------------------------- */ .geography{position:relative;padding-block:clamp(28px,6vw,88px) var(--section);color:var(--ink);background:var(--paper);overflow:hidden} .divider{display:grid;place-items:center;margin:0 auto clamp(48px,7vw,108px);padding-inline:var(--pad)} .divider img{width:min(700px,72vw);height:auto;mix-blend-mode:multiply} .geo-layout{display:grid;grid-template-columns:minmax(260px,4fr) minmax(0,8fr);gap:clamp(44px,7vw,132px);align-items:center} .geo-copy h2{max-width:8ch;margin:17px 0 26px;font-family:var(--serif);font-size:clamp(52px,6.2vw,98px);font-weight:300;line-height:.86;letter-spacing:-.05em} .geo-copy h2 em{color:var(--accent-deep);font-style:normal} .geo-copy>p{max-width:38ch;margin:0;font-family:var(--serif);font-size:clamp(19px,1.9vw,28px);line-height:1.2} .geo-facts{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin-top:38px;padding-top:17px;border-top:1px solid rgba(11,11,10,.2)} .geo-facts strong{display:block;font-family:var(--serif);font-size:25px;font-weight:300} .geo-facts span{display:block;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(11,11,10,.54)} .geo-figure{position:relative;aspect-ratio:3/2;overflow:hidden;background:#f5f1e9;isolation:isolate} .geo-figure>img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply} .map-place{position:absolute;z-index:2;display:flex;align-items:center;gap:8px;color:rgba(11,11,10,.75);font-size:9px;font-weight:500;letter-spacing:.16em;text-transform:uppercase} .map-place::before{content:"";flex:0 0 auto;width:7px;height:7px;border:1px solid var(--paper);border-radius:50%;background:var(--accent-deep);box-shadow:0 0 0 4px rgba(169,137,92,.18)} .geo-note{max-width:80ch;margin:28px 0 0 auto;padding-top:15px;border-top:1px solid rgba(11,11,10,.2);font-size:10px;letter-spacing:.09em;line-height:1.7;text-transform:uppercase;color:rgba(11,11,10,.56)} /* --- illustrated plate --------------------------------------------------- */ .plate{background:var(--paper);padding-block:var(--section);border-top:1px solid rgba(11,11,10,.12)} .plate-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:end;margin-bottom:clamp(32px,4vw,56px)} .plate-head h2{margin:16px 0 0;max-width:11ch;font-family:var(--serif);font-size:clamp(46px,5.4vw,84px);font-weight:300;line-height:.88;letter-spacing:-.045em} .plate-head h2 em{color:var(--accent-deep);font-style:normal} .plate-head>div:last-child p{max-width:46ch;margin:0;color:rgba(11,11,10,.62);font-size:14px} .plate figure{position:relative;margin:0;border-top:1px solid rgba(11,11,10,.25);padding-top:22px} .plate img{width:100%;height:auto;mix-blend-mode:multiply} .plate figcaption{margin-top:18px;font-size:9px;letter-spacing:.16em;line-height:1.7;text-transform:uppercase;color:rgba(11,11,10,.55)} @media (max-width:1080px){.plate-head{grid-template-columns:1fr;gap:22px}} /* --- the wearer · escena del mundo antiguo + objeto de museo ------------- */ .worn{background:var(--bone);padding-block:var(--section);border-top:1px solid rgba(11,11,10,.12)} .worn-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:end;margin-bottom:clamp(32px,4vw,56px)} .worn-head h2{margin:16px 0 0;max-width:12ch;font-family:var(--serif);font-size:clamp(46px,5.4vw,84px);font-weight:300;line-height:.88;letter-spacing:-.045em} .worn-head h2 em{color:var(--accent-deep);font-style:normal} .worn-head>div:last-child p{max-width:46ch;margin:0;color:rgba(11,11,10,.62);font-size:14px} .worn-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);align-items:start} .worn figure{margin:0;border-top:1px solid rgba(11,11,10,.25);padding-top:22px} .worn-plate .placeholder{min-height:0;aspect-ratio:3/2} .worn-plate img{width:100%;height:auto;mix-blend-mode:multiply} .worn-object img{width:100%;height:auto;background:#fff} .worn figcaption{margin-top:18px;font-size:9px;letter-spacing:.16em;line-height:1.7;text-transform:uppercase;color:rgba(11,11,10,.55)} .worn-object .note{max-width:46ch;margin:18px 0 0;padding-top:17px;border-top:1px solid rgba(11,11,10,.25);font-size:12px;line-height:1.7;color:rgba(11,11,10,.62)} .worn .record-link{display:inline-block;margin-top:16px;color:var(--accent-deep);border-bottom:1px solid currentColor;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;text-decoration:none} @media (max-width:1080px){.worn-head,.worn-grid{grid-template-columns:1fr;gap:22px}} /* --- provenance ---------------------------------------------------------- */ .provenance{background:var(--bone);padding-block:var(--section)} .prov-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:45px;align-items:end;margin-bottom:76px} .prov-head h2{margin:0} .prov-head>div:last-child{max-width:57ch;justify-self:end} .prov-head .statement{margin:0;font-family:var(--serif);font-size:clamp(23px,2.6vw,37px);line-height:1.18} .prov-head .statement em{color:var(--accent-deep);font-style:normal} .evidence{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)} .evidence-column{position:relative;padding:31px clamp(22px,4vw,60px) 0 0} .evidence-column+.evidence-column{border-left:1px solid var(--line-dark);padding-left:clamp(22px,4vw,60px)} .evidence-column::before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;background:transparent} .evidence-column.unknown::before{background:var(--red)} .evidence-column h3{margin:0 0 24px;font-family:var(--serif);font-size:35px;font-weight:300} .evidence-list{margin:0;padding:0;list-style:none} .evidence-list li{display:grid;grid-template-columns:25px 1fr;gap:13px;padding:15px 0;border-bottom:1px solid var(--line-dark);font-size:13px;color:rgba(11,11,10,.68)} .evidence-list i{margin-top:9px;width:7px;height:7px;border-radius:50%;background:var(--accent-deep)} .evidence-column.unknown .evidence-list i{background:transparent;border:1px solid var(--red)} .honesty{margin-top:30px;padding:21px 24px;border-left:3px solid var(--red);background:rgba(168,67,50,.06);font-family:var(--serif);font-size:20px;line-height:1.3} /* --- object record ------------------------------------------------------- */ .passport{background:var(--paper-deep);padding-block:var(--section);overflow:hidden} .passport-layout{display:grid;grid-template-columns:minmax(250px,4fr) minmax(0,8fr);gap:clamp(44px,7vw,124px)} .passport h2{margin-top:18px} .passport-intro{max-width:37ch;color:rgba(11,11,10,.62)} .object-record{position:relative;padding:clamp(24px,4vw,52px);color:var(--bone);background:#13233d;box-shadow:0 34px 80px rgba(26,19,12,.2);transform:rotate(-.7deg)} .object-record::before{content:"";position:absolute;inset:10px;border:1px solid rgba(241,237,228,.22);pointer-events:none} .record-top{position:relative;display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid rgba(241,237,228,.26)} .record-top span{font-size:8px;line-height:1.5;letter-spacing:.18em;text-transform:uppercase;color:var(--white-46);text-align:right} .record-top strong{font-family:var(--serif);font-size:17px;font-weight:300;letter-spacing:.1em;text-transform:uppercase} .record-body{position:relative;display:grid;grid-template-columns:minmax(160px,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,54px);padding-top:32px} .record-photo{position:relative;min-height:410px;background:#050504;overflow:hidden} .record-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%} .record-photo::after{content:attr(data-no);white-space:pre;position:absolute;left:13px;bottom:13px;font-family:var(--serif);font-size:12px;line-height:1.1;letter-spacing:.13em;color:var(--bone)} .record-seal{position:absolute;z-index:2;right:14px;top:14px;width:clamp(72px,7vw,104px);aspect-ratio:1;display:grid;place-items:center;border:1px solid var(--accent);border-radius:50%;color:var(--accent);background:rgba(19,35,61,.86);backdrop-filter:blur(4px);transform:rotate(7deg)} .record-seal::before{content:"";position:absolute;inset:7px;border:1px dashed currentColor;border-radius:inherit} .record-seal span{max-width:8ch;text-align:center;font-size:7px;line-height:1.4;letter-spacing:.15em;text-transform:uppercase} .record-data{margin:0;align-self:center} .record-row{display:grid;grid-template-columns:.8fr 1.2fr;gap:17px;padding:12px 0;border-bottom:1px solid rgba(241,237,228,.18)} .record-row dt{font-size:7px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--white-46)} .record-row dd{margin:0;font-family:var(--serif);font-size:clamp(16px,1.6vw,22px);line-height:1.12} .record-foot{display:flex;justify-content:space-between;gap:25px;margin-top:22px;color:var(--white-46);font-size:7px;letter-spacing:.15em;text-transform:uppercase} .care{margin-top:92px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)} .care-card{padding:30px clamp(20px,3vw,44px) 0 0;min-height:176px;border-right:1px solid var(--line-dark)} .care-card+.care-card{padding-left:clamp(20px,3vw,44px)} .care-card:last-child{border-right:0} .care-card svg{width:23px;height:23px;margin-bottom:28px;color:var(--accent-deep)} .care-card h3{margin:0 0 8px;font-family:var(--serif);font-size:24px;font-weight:300} .care-card p{margin:0;font-size:12px;color:rgba(11,11,10,.57)} /* --- delivery ------------------------------------------------------------ */ .delivery{background:var(--ink);color:var(--bone);padding-block:var(--section)} .delivery-head{display:grid;grid-template-columns:1fr 1.35fr;gap:40px;align-items:end;margin-bottom:56px} .delivery-head h2{max-width:9ch;margin:18px 0 0;font-family:var(--serif);font-size:clamp(52px,6.4vw,100px);font-weight:300;line-height:.86;letter-spacing:-.05em} .delivery-head h2 em{color:var(--accent);font-style:normal} .delivery-head>p{max-width:46ch;margin:0;font-family:var(--serif);font-size:clamp(21px,2.3vw,32px);line-height:1.2;color:var(--white-72)} .delivery-image{position:relative;aspect-ratio:16/9;overflow:hidden} .delivery-image img{width:100%;height:100%;object-fit:cover} .delivery-image .corner-note{position:absolute;right:0;bottom:0;width:min(390px,42%);padding:24px 28px;background:rgba(11,11,10,.9);backdrop-filter:blur(12px)} .corner-note strong{display:block;margin-bottom:8px;font-family:var(--serif);font-size:26px;font-weight:300} .corner-note span{display:block;color:var(--white-46);font-size:9px;line-height:1.55;letter-spacing:.1em;text-transform:uppercase} .delivery-specs{display:grid;grid-template-columns:repeat(4,1fr);margin-top:32px;border-top:1px solid var(--line-light)} .delivery-specs div{min-height:145px;padding:22px 26px 0 0;border-right:1px solid var(--line-light)} .delivery-specs div+div{padding-left:26px} .delivery-specs div:last-child{border-right:0} .delivery-specs b{display:block;font-family:var(--serif);font-size:22px;font-weight:300} .delivery-specs span{display:block;margin-top:8px;color:var(--white-46);font-size:9px;line-height:1.55;letter-spacing:.08em;text-transform:uppercase} /* --- questions ----------------------------------------------------------- */ .questions{padding-block:var(--section);background:var(--bone)} .questions-grid{display:grid;grid-template-columns:minmax(240px,4fr) minmax(0,8fr);gap:clamp(44px,7vw,124px)} .questions h2{margin:18px 0 0;font-family:var(--serif);font-size:clamp(48px,5.6vw,86px);line-height:.9;font-weight:300;letter-spacing:-.045em} details{border-top:1px solid var(--line-dark)} details:last-child{border-bottom:1px solid var(--line-dark)} summary{position:relative;list-style:none;padding:22px 52px 22px 0;font-family:var(--serif);font-size:clamp(20px,2vw,28px);line-height:1.17;cursor:pointer} summary::-webkit-details-marker{display:none} summary::before,summary::after{content:"";position:absolute;top:50%;right:8px;width:16px;height:1px;background:var(--ink);transition:transform .35s var(--ease)} summary::after{transform:rotate(90deg)} details[open] summary::after{transform:rotate(0)} .answer{max-width:62ch;padding:0 50px 25px 0;color:rgba(11,11,10,.63);font-size:13px} .answer p{margin:0} /* --- closing + footer ---------------------------------------------------- */ .closing{position:relative;min-height:82svh;display:grid;place-items:center;text-align:center;color:var(--bone);background:var(--ink);overflow:hidden} .closing-media{position:absolute;inset:0;opacity:.35} .closing-media img{width:100%;height:100%;object-fit:cover;scale:1.12} .closing-media::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(11,11,10,.34),rgba(11,11,10,.96) 74%)} .closing-content{position:relative;z-index:2;padding:104px var(--pad)} .closing h2{max-width:12ch;margin:20px auto 32px;font-family:var(--serif);font-size:clamp(56px,8vw,124px);line-height:.85;font-weight:300;letter-spacing:-.05em} .closing h2 em{display:block;color:var(--accent);font-style:normal} .closing p:not(.eyebrow){max-width:48ch;margin:0 auto 32px;color:var(--white-72)} .closing .btn{min-width:250px;color:var(--ink);border-color:var(--bone);background:var(--bone)} .closing .btn::before{background:var(--accent);transform:scaleY(0)} .closing .btn:hover::before{transform:scaleY(1)} .closing .btn:hover{color:var(--ink);border-color:var(--accent)} .footer{color:var(--bone);background:var(--ink);border-top:1px solid var(--line-light)} .footer-top{padding-block:70px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:50px} .footer-brand{display:flex;align-items:center;gap:12px} .footer-brand img{width:38px;height:38px;object-fit:contain} .footer-brand span{font-family:var(--serif);font-size:22px;letter-spacing:.2em;text-transform:uppercase} .footer p{margin:14px 0 0;max-width:31ch;color:var(--white-46);font-size:11px} .footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px 30px;align-content:start} .footer-nav a{color:var(--white-72);font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none} .footer-contact{justify-self:end} .footer-contact a{display:block;margin-top:12px;color:var(--bone);font-family:var(--serif);font-size:23px;text-decoration:none} .footer-bottom{display:flex;justify-content:space-between;gap:25px;padding-block:19px;border-top:1px solid var(--line-light);color:var(--white-46);font-size:8px;letter-spacing:.14em;text-transform:uppercase} /* --- acquire bar --------------------------------------------------------- */ .acquire-bar{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:clamp(12px,2vw,28px); padding:10px var(--pad);color:var(--bone);background:rgba(11,11,10,.94);border-top:1px solid var(--line-light);backdrop-filter:blur(16px); transform:translateY(calc(100% + 24px));transition:transform .45s var(--ease)} .acquire-bar.visible{transform:none} .acquire-bar img{width:46px;height:46px;object-fit:cover;object-position:50% 34%;background:#050504} .acquire-bar .bar-id strong{display:block;font-family:var(--serif);font-size:17px;font-weight:300;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .acquire-bar .bar-id span{display:block;font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--white-46);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .acquire-bar .bar-price{text-align:right;white-space:nowrap} .acquire-bar .bar-price strong{display:block;font-family:var(--serif);font-size:20px;font-weight:300;line-height:1.1} .acquire-bar .bar-price span{display:block;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--white-46)} .acquire-bar .btn{min-height:46px;padding:0 26px;border-color:var(--bone);background:var(--bone);color:var(--ink)} .acquire-bar .btn::before{background:var(--accent);transform:scaleY(0)} .acquire-bar .btn:hover::before{transform:scaleY(1)} .acquire-bar .btn:hover{color:var(--ink)} /* --- lightbox + dialog --------------------------------------------------- */ .lightbox{position:fixed;inset:0;z-index:110;display:none;place-items:center;padding:clamp(15px,3vw,45px);background:rgba(5,5,4,.96)} .lightbox.open{display:grid} .lightbox img{max-width:100%;max-height:90svh;object-fit:contain} .lightbox-close{position:absolute;top:20px;right:20px;width:44px;height:44px;border:1px solid var(--line-light);border-radius:50%;background:rgba(0,0,0,.2);color:var(--bone);cursor:pointer;font-size:22px} dialog{width:min(94vw,760px);max-height:92svh;border:0;padding:0;color:var(--ink);background:var(--bone);box-shadow:0 40px 120px rgba(0,0,0,.55)} dialog::backdrop{background:rgba(5,5,4,.82);backdrop-filter:blur(8px)} .dialog-grid{display:grid;grid-template-columns:230px 1fr;min-height:520px} .dialog-media{position:relative;overflow:hidden;background:var(--ink)} .dialog-media img{width:100%;height:100%;object-fit:cover} .dialog-media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,5,4,.72),transparent 58%)} .dialog-ref{position:absolute;z-index:2;bottom:20px;left:20px;right:20px;color:var(--bone);font-size:9px;line-height:1.5;letter-spacing:.13em;text-transform:uppercase} .dialog-content{position:relative;padding:46px} .dialog-close{position:absolute;top:16px;right:16px;width:38px;height:38px;border:1px solid var(--line-dark);border-radius:50%;background:transparent;cursor:pointer;font-size:20px} .dialog-content h2{margin:14px 0 12px;font-family:var(--serif);font-size:44px;line-height:.95;font-weight:300} .dialog-content>p{margin:0 0 26px;color:rgba(11,11,10,.6);font-size:12px} .form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px} label{display:block;margin-bottom:12px;font-size:8px;font-weight:600;letter-spacing:.16em;text-transform:uppercase} input,textarea{width:100%;border:0;border-bottom:1px solid var(--line-dark);border-radius:0;padding:13px 0;color:var(--ink);background:transparent;font-size:13px} textarea{min-height:78px;resize:vertical} .field{margin-bottom:20px} .dialog-content .btn{width:100%;margin-top:9px} .form-note{margin:11px 0 0;text-align:center;font-size:9px;color:rgba(11,11,10,.46)} .success{display:none;min-height:420px;flex-direction:column;justify-content:center;align-items:flex-start} .success.show{display:flex} .success-mark{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--accent-deep);border-radius:50%;color:var(--accent-deep);font-size:22px} .success h2{margin-top:24px} .success p{max-width:37ch} /* --- el término de la casa: siempre serif cursiva, en cualquier familia --- */ .term{font-family:var(--serif);font-style:italic} p .term,li .term,dd .term,span .term,b .term,.product-summary .term{font-size:1.1em} h1 .term,h2 .term,h3 .term,.price .term,.line .term{font-size:inherit} h1 em.term,h2 em.term,h3 em.term{font-style:italic} /* --- responsive ---------------------------------------------------------- */ @media (max-width:1080px){ .nav.left,.nav.right a{display:none} .menu-toggle{display:block} .nav.right{display:flex} .hero-content{grid-template-columns:1fr;align-content:center;gap:52px} .hero-copy{align-self:end} .hero-note{max-width:390px} .hero h1{font-size:clamp(60px,12vw,108px)} .product-grid{grid-template-columns:1fr} .gallery{position:relative;top:auto} .chapter-rail{display:none} .timeline{grid-template-columns:1fr 1fr;gap:44px 20px;border-top:0} .timeline::after{display:none} .moment{border-top:1px solid var(--line-light)} .geo-layout,.material-grid,.passport-layout,.questions-grid{grid-template-columns:1fr;gap:44px} .geo-note{margin-left:0} .period-work{grid-template-columns:1fr} .period-copy{gap:44px} .period-art{min-height:82svh} .wear{grid-template-columns:1fr} .wear-media{min-height:82svh} .prov-head{grid-template-columns:1fr} .prov-head>div:last-child{justify-self:start} .footer-top{grid-template-columns:1fr 1fr} .footer-contact{justify-self:start} .delivery-specs{grid-template-columns:1fr 1fr} .delivery-specs div:nth-child(2){border-right:0} .delivery-specs div:nth-child(-n+2){border-bottom:1px solid var(--line-light)} } @media (max-width:720px){ :root{--section:92px} .topline{height:28px} .topline p{font-size:8px;letter-spacing:.13em} .site-header{top:28px;height:72px} .brand img{width:34px;height:34px} .brand .wordmark{font-size:15px;letter-spacing:.16em} .header-action{display:none} .mobile-menu{display:grid} .hero-media img{object-position:var(--hero-pos-m,61% 50%)} .hero-media::after{background:linear-gradient(0deg,rgba(5,5,4,.86) 0%,rgba(5,5,4,.45) 57%,rgba(5,5,4,.08) 100%)} .hero-content{padding-top:132px;padding-bottom:96px;align-content:end;gap:32px} .hero h1{font-size:clamp(50px,15vw,76px);max-width:9ch} .hero-note p{max-width:29ch;font-size:19px} .scroll-mark{display:none} .gallery-stage{aspect-ratio:1} .thumbs{grid-template-columns:repeat(5,1fr)} .gallery-caption{font-size:8px} .product-info h2{font-size:40px} .actions{grid-template-columns:1fr 58px} .time h2{margin-bottom:56px} .timeline{display:flex;overflow-x:auto;gap:0;padding-bottom:14px;scroll-snap-type:x mandatory} .moment{flex:0 0 68vw;scroll-snap-align:start} .divider{margin-bottom:48px} .divider img{width:min(560px,110vw);max-width:none} .geo-figure{aspect-ratio:4/3} .geo-facts{margin-top:30px} .geo-note{font-size:8px} .map-place{font-size:7px;gap:5px;letter-spacing:.12em} .map-place::before{width:5px;height:5px} .macro-frame{aspect-ratio:4/5} .lens{display:none} .colour-head,.colour-story{grid-template-columns:1fr;gap:20px} .swatches{min-height:0;grid-template-columns:repeat(3,1fr)} .swatch{min-height:150px;border-bottom:1px solid rgba(255,255,255,.16)} .colour-word{font-size:52px} .period-copy{min-height:auto;padding-block:80px 60px} .period-copy h2{margin-top:36px} .period-art{min-height:74svh} .wear-media{min-height:72svh} .wear-copy{padding-block:76px} .evidence{grid-template-columns:1fr} .evidence-column{padding-right:0} .evidence-column+.evidence-column{margin-top:52px;border-left:0;padding-left:0;border-top:1px solid var(--ink)} .object-record{transform:none;margin-inline:-10px;padding:30px 24px} .record-body{grid-template-columns:1fr} .record-photo{min-height:400px} .care{grid-template-columns:1fr;margin-top:64px} .care-card,.care-card+.care-card{min-height:auto;padding:25px 0;border-right:0;border-bottom:1px solid var(--line-dark)} .care-card svg{margin-bottom:18px} .questions h2{margin-bottom:40px} .delivery-head{grid-template-columns:1fr} .delivery-image{aspect-ratio:4/5} .delivery-image .corner-note{width:calc(100% - 20px)} .delivery-specs div,.delivery-specs div+div{min-height:120px;padding:20px 15px} .footer-top{grid-template-columns:1fr} .footer-bottom{flex-direction:column} .acquire-bar{grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:9px 14px} .acquire-bar img,.acquire-bar .bar-price span{display:none} .acquire-bar .bar-id strong{font-size:15px} .acquire-bar .bar-price{display:none} .acquire-bar .bar-id span{display:block} .dialog-grid{grid-template-columns:1fr} .dialog-media{display:none} .dialog-content{padding:52px 24px 28px} .dialog-content h2{font-size:36px} .form-row{grid-template-columns:1fr;gap:0} } @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important} .reveal{opacity:1;transform:none} .timeline{--line-progress:1!important} .acquire-bar{transition:none} }