:root{--i-abouthero:image-set(url("/assets/img/about_hero.webp?v=ebfac900") type("image/webp"),url("/assets/img/about_hero.jpg?v=1f6e3c84") type("image/jpeg"));--i-affoals:image-set(url("/assets/img/af_foals.webp?v=6f00fccf") type("image/webp"),url("/assets/img/af_foals.jpg?v=54a0e444") type("image/jpeg"));--i-afgal04:image-set(url("/assets/img/afgal04.webp?v=6bd1291b") type("image/webp"),url("/assets/img/afgal04.jpg?v=62a6c8e0") type("image/jpeg"));--i-am0299:image-set(url("/assets/img/am0299.webp?v=142dcc1b") type("image/webp"),url("/assets/img/am0299.jpg?v=6b0b350e") type("image/jpeg"));--i-crown:url("/assets/img/crown_white.png?v=403cc969");--i-crownnavy:url("/assets/img/crown_navy.png?v=8bc71bc2");--i-dnaband:image-set(url("/assets/img/dnaband.webp?v=f2b73680") type("image/webp"),url("/assets/img/dnaband.jpg?v=2a74941f") type("image/jpeg"));--i-drone:image-set(url("/assets/img/drone.webp?v=e40958c3") type("image/webp"),url("/assets/img/drone.jpg?v=72c0f15e") type("image/jpeg"));--i-gate:image-set(url("/assets/img/gate.webp?v=e6d59a78") type("image/webp"),url("/assets/img/gate.jpg?v=a3369cbc") type("image/jpeg"));--i-gateview:image-set(url("/assets/img/gateview.webp?v=9a965d99") type("image/webp"),url("/assets/img/gateview.jpg?v=dee79093") type("image/jpeg"));--i-kalinka:image-set(url("/assets/img/kalinka.webp?v=6630a94d") type("image/webp"),url("/assets/img/kalinka.jpg?v=c7a21006") type("image/jpeg"));--i-logo-ivory:url("/assets/img/af_ivory.png?v=350128ba");--i-logo-navy:url("/assets/img/af_navy.png?v=5cc44f62");--i-newsletter:image-set(url("/assets/img/newsletter.webp?v=eab6bf68") type("image/webp"),url("/assets/img/newsletter.jpg?v=ed24c8ac") type("image/jpeg"));--i-progfoals:image-set(url("/assets/img/progfoals.webp?v=b68a5d72") type("image/webp"),url("/assets/img/progfoals.jpg?v=371e2d80") type("image/jpeg"));--i-row2:image-set(url("/assets/img/breeding_row2.webp?v=bf7cd5e9") type("image/webp"),url("/assets/img/breeding_row2.jpg?v=70859543") type("image/jpeg"));--i-whyashford:image-set(url("/assets/img/whyashford.webp?v=ce22ee5d") type("image/webp"),url("/assets/img/whyashford.jpg?v=6f6d6efc") type("image/jpeg"));--i-yearlings:image-set(url("/assets/img/yearlings.webp?v=882b6c4d") type("image/webp"),url("/assets/img/yearlings.jpg?v=400da323") type("image/jpeg"));--i-younghorses:image-set(url("/assets/img/younghorses.webp?v=ff346674") type("image/webp"),url("/assets/img/younghorses.jpg?v=edc2a8bf") type("image/jpeg"));--i-lot1:image-set(url("/assets/img/lot01.webp?v=160ce13d") type("image/webp"),url("/assets/img/lot01.jpg?v=92a02e71") type("image/jpeg"));--i-lot2:image-set(url("/assets/img/lot02.webp?v=795b60b4") type("image/webp"),url("/assets/img/lot02.jpg?v=73d31345") type("image/jpeg"));--i-lot3:image-set(url("/assets/img/lot03.webp?v=9f9a4767") type("image/webp"),url("/assets/img/lot03.jpg?v=4e637dc3") type("image/jpeg"));--i-lot4:image-set(url("/assets/img/lot04.webp?v=39f526c3") type("image/webp"),url("/assets/img/lot04.jpg?v=ebdd6470") type("image/jpeg"));--i-lot5:image-set(url("/assets/img/lot05.webp?v=0167ccc3") type("image/webp"),url("/assets/img/lot05.jpg?v=ebd3152a") type("image/jpeg"));--i-lot6:image-set(url("/assets/img/lot06.webp?v=8a5c2476") type("image/webp"),url("/assets/img/lot06.jpg?v=df38c034") type("image/jpeg"));--i-lot7:image-set(url("/assets/img/lot07.webp?v=dca18411") type("image/webp"),url("/assets/img/lot07.jpg?v=00c0680d") type("image/jpeg"));--i-lot8:image-set(url("/assets/img/lot08.webp?v=ccfa0cef") type("image/webp"),url("/assets/img/lot08.jpg?v=7a42295a") type("image/jpeg"));--i-lot9:image-set(url("/assets/img/lot09.webp?v=54ad4878") type("image/webp"),url("/assets/img/lot09.jpg?v=4579f9a8") type("image/jpeg"));--i-lot10:image-set(url("/assets/img/lot10.webp?v=92417274") type("image/webp"),url("/assets/img/lot10.jpg?v=d546466b") type("image/jpeg"));--i-lot11:image-set(url("/assets/img/lot11.webp?v=19a2874a") type("image/webp"),url("/assets/img/lot11.jpg?v=9c618fad") type("image/jpeg"));--i-lot12:image-set(url("/assets/img/lot12.webp?v=a8a604e1") type("image/webp"),url("/assets/img/lot12.jpg?v=8659053f") type("image/jpeg"));--i-p-aganix:url("/assets/img/photo/aganix.webp?v=c721186a");--i-p-akarad:url("/assets/img/photo/akarad.webp?v=07cc7912");--i-p-bonny:url("/assets/img/photo/bonny.webp?v=7bc5b3f1");--i-p-candy:url("/assets/img/photo/candy.webp?v=09657a6f");--i-p-chaccoslady:url("/assets/img/photo/chaccoslady.webp?v=933d0d89");--i-p-chaccoslady-3:url("/assets/img/photo/chaccoslady-3.webp?v=e6d039d5");--i-p-chalou:url("/assets/img/photo/chalou.webp?v=3f41215b");--i-p-clintina:url("/assets/img/photo/clintina.webp?v=fb34552f");--i-p-dourkhan:url("/assets/img/photo/dourkhan.webp?v=e664e40e");--i-p-ermitage:url("/assets/img/photo/ermitage.webp?v=b928ff3b");--i-p-gingerpop:url("/assets/img/photo/gingerpop.webp?v=9de1fdca");--i-p-heureuse:url("/assets/img/photo/heureuse.webp?v=2305e621");--i-p-heureuse-2:url("/assets/img/photo/heureuse-2.webp?v=589e6643");--i-p-kalinka:url("/assets/img/photo/kalinka.webp?v=89108d07");--i-p-karaat:url("/assets/img/photo/karaat.webp?v=7ac8c85f");--i-p-laboheme:url("/assets/img/photo/laboheme.webp?v=1dd74cdc");--i-p-mosito:url("/assets/img/photo/mosito.webp?v=0d09e5f8");--i-p-nottinghill:url("/assets/img/photo/nottinghill.webp?v=5965c31e");--i-p-unitedtouch:url("/assets/img/photo/unitedtouch.webp?v=699cb29e");--i-yt-0m84yNfknQ0:url("/assets/img/yt/0m84yNfknQ0.jpg?v=7981be6d");--i-yt-DEU-Q_kGRGM:url("/assets/img/yt/DEU-Q_kGRGM.jpg?v=86a80474");--i-yt-E1PuFeU69w4:url("/assets/img/yt/E1PuFeU69w4.jpg?v=95b69907");--i-yt-G5O9fcPGDvw:url("/assets/img/yt/G5O9fcPGDvw.jpg?v=037f8fc8");--i-yt-GRkfXss_3A0:url("/assets/img/yt/GRkfXss_3A0.jpg?v=350449e8");--i-yt-MVP04A2TYcE:url("/assets/img/yt/MVP04A2TYcE.jpg?v=5b85a6ec");--i-yt-Opmjay-2N1A:url("/assets/img/yt/Opmjay-2N1A.jpg?v=a7980623");--i-yt-XGDDYmViZgU:url("/assets/img/yt/XGDDYmViZgU.jpg?v=f7e266e9");--i-yt-bRoKqo5k0rk:url("/assets/img/yt/bRoKqo5k0rk.jpg?v=3480810b");--i-yt-cEgTg6hlGHU:url("/assets/img/yt/cEgTg6hlGHU.jpg?v=ded03281");--i-yt-eLtZST7QVHA:url("/assets/img/yt/eLtZST7QVHA.jpg?v=ce0d4954");--i-yt-eVrDE76aIcE:url("/assets/img/yt/eVrDE76aIcE.jpg?v=f6372891");--i-yt-eeX7CzTXCrg:url("/assets/img/yt/eeX7CzTXCrg.jpg?v=9d4729dd");--i-yt-p9kbYJGzsBE:url("/assets/img/yt/p9kbYJGzsBE.jpg?v=e0264599");--i-yt-s9i0Iqg0CHU:url("/assets/img/yt/s9i0Iqg0CHU.jpg?v=70e1fbdc");--i-yt-uTqcERSqYlc:url("/assets/img/yt/uTqcERSqYlc.jpg?v=72b6510c");--i-yt-z1uFp4eOs4g:url("/assets/img/yt/z1uFp4eOs4g.jpg?v=91b1eaf5")}
:root{
  --ease:cubic-bezier(.16,.84,.3,1);--glow:255,198,132;
  --blue:#00263A;--dblue:#00263A;--ivory:#f2f2f1;--ivory-2:#d6d6d5;--cream:#f1f1f0;--cream-2:#e7e7e6;--silver:#bfbfbe;
  /* weauction token mapping: primary = Ashford blue, accent derived from it */
  --w-primary:#00263A;--w-accent:#1F6F9E;--w-accent-strong:#0E4E73;--w-accent-soft:#7FB6D4;
  --w-secondary:#f1f1f0;--w-border:#bfbfbe;--w-fg:#1b2a33;--w-muted:#5d6b73;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:#05101a}
body{font-family:'Open Sans',Helvetica,Arial,sans-serif;background:#05101a radial-gradient(120% 80% at 50% 0%,#10283a 0%,#07131d 55%,#05101a 100%) no-repeat;color:#e9e6e0;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:inherit;text-decoration:none}
button{font:inherit}

/* ================= VIEWER ================= */
.toolbar{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(4,12,18,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(191,191,190,.14);display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 18px;height:62px}
.tb-brand{display:flex;align-items:center;gap:10px;min-width:0}
.tb-crown{width:30px;height:15px;background:var(--i-crown) center/contain no-repeat;flex:none}
.tb-title{font-family:Georgia,'Times New Roman',serif;font-size:.74rem;letter-spacing:.12em;color:var(--ivory);white-space:nowrap}
.tb-mid{display:flex;gap:12px;align-items:center}
.seg{display:flex;gap:3px;padding:4px;border-radius:100px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04)}
.seg button{border:none;background:none;color:#9aa6ad;font-size:.72rem;font-weight:500;padding:6px 13px;border-radius:100px;cursor:pointer;white-space:nowrap;transition:.25s}
.seg button:hover{color:var(--ivory)}
.seg button.on{background:var(--ivory);color:var(--blue)}
.seg.ver button b{font-family:Georgia,'Times New Roman',serif;font-weight:600;margin-right:6px}
.tb-meta{font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#56656e;white-space:nowrap}
@media(max-width:1300px){.tb-meta{display:none}}
.stage{padding:86px 22px 70px;display:flex;flex-direction:column;align-items:center}
.stage-cap{text-align:center;margin-bottom:22px;max-width:820px}
.stage-cap .k{font-size:.6rem;letter-spacing:.34em;color:#7b8c96;text-transform:uppercase}
.stage-cap h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:1.4rem;color:var(--ivory);margin:8px 0 6px;letter-spacing:.04em}
.stage-cap p{font-family:Georgia,'Times New Roman',serif;font-size:1.08rem;color:#93a2aa;line-height:1.55}
.stage-cap .mix{display:inline-flex;gap:6px;margin-top:12px;align-items:center;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:#7b8c96}
.stage-cap .mix i{display:inline-block;height:6px;border-radius:3px}
.frame{width:100%;max-width:1432px;border-radius:14px;overflow:hidden;box-shadow:0 50px 120px -30px rgba(0,0,0,.8),0 0 0 1px rgba(191,191,190,.1)}
.frame-bar{height:40px;background:#08141c;display:flex;align-items:center;gap:8px;padding:0 16px}
.dot{width:11px;height:11px;border-radius:50%}.dot.r{background:#ff5f57}.dot.y{background:#febc2e}.dot.g{background:#28c840}
.frame-url{margin:0 auto;background:rgba(255,255,255,.06);color:#9fb0ba;font-size:.72rem;letter-spacing:.04em;padding:5px 20px;border-radius:100px}
.frame-body{max-height:82vh;overflow-y:auto;overflow-x:hidden;position:relative}
.frame-body::-webkit-scrollbar{width:10px}.frame-body::-webkit-scrollbar-thumb{background:rgba(127,140,150,.4);border-radius:10px}
.screen{display:none}.screen.active{display:block}

/* ================= THEME TOKENS ================= */
.light{--bg:#f1f1f0;--bg2:#e7e7e6;--fg:#00263A;--tx:#29333a;--mu:#596369;--di:#8a9297;--ln:rgba(0,38,58,.16);--ln2:rgba(0,38,58,.08);--bb:#00263A;--bf:#f1f1f0;--logo:var(--i-logo-navy);--em:#3d5866}
.dark{--bg:#00263A;--bg2:#00213a;--fg:#ffffff;--tx:#ffffff;--mu:#ffffff;--di:rgba(255,255,255,.78);--ln:rgba(255,255,255,.26);--ln2:rgba(255,255,255,.12);--bb:#ffffff;--bf:#00263A;--logo:var(--i-logo-ivory);--em:#ffffff}
.light,.dark{background-color:var(--bg);color:var(--tx)}
.bg2{background-color:var(--bg2)}

/* ================= SITE BASE ================= */
.site{position:relative;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:16px;container:page / inline-size}
.wrap{max-width:1400px;margin:0 auto;padding:0 72px}
@container page (max-width: 900px){.wrap{padding:0 36px}}
@container page (max-width: 600px){.wrap{padding:0 28px}}
.wrap.narrow{max-width:932px}
.lbl{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--di)}
h1,h2,h3,h4{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--fg);letter-spacing:.015em;line-height:1.12}
h1 em,h2 em,h3 em{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:300;letter-spacing:0;color:var(--em)}
p{line-height:1.7;color:var(--mu);font-size:.94rem}
p b{font-weight:600;color:var(--fg)}
.dark p b{font-weight:600;color:#fff}
.num{font-variant-numeric:lining-nums}
.orn{width:84px;height:1px;background:linear-gradient(90deg,transparent,var(--ln),transparent);margin:26px auto 0}
.btn{display:inline-flex;align-items:center;gap:14px;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.62rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;padding:18px 30px;transition:.45s var(--ease);border:1px solid transparent;cursor:pointer;white-space:nowrap}
.btn .ar{transition:transform .45s var(--ease)}.btn:hover .ar{transform:translateX(5px)}
.btn-solid{background:var(--bb);color:var(--bf)}
.btn-solid:hover{box-shadow:0 10px 40px -10px rgba(var(--glow),.35)}
.btn-line{border-color:var(--ln);color:var(--fg)}
.btn-line:hover{border-color:var(--fg)}
.tl{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--fg);display:inline-flex;gap:12px;align-items:center;padding-bottom:6px;position:relative}
.tl::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;opacity:.35;transform:scaleX(.4);transform-origin:left;transition:.5s var(--ease)}
.tl:hover::after{transform:scaleX(1);opacity:.9}
.tl .ar{transition:transform .45s var(--ease)}.tl:hover .ar{transform:translateX(5px)}
.anno{display:inline-flex;align-items:center;gap:8px;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.58rem;letter-spacing:.04em;color:#a8671a;border:1px dashed rgba(168,103,26,.6);background:rgba(255,248,236,.85);padding:6px 11px;border-radius:3px;line-height:1.4}
.dark .anno,.anno.on-dark{color:#f6d9a8;border-color:rgba(246,217,168,.55);background:rgba(10,20,28,.6)}
.anno::before{content:"Note";font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.52rem;opacity:.85}
.sec{padding:130px 0;position:relative}
.sh{text-align:center;max-width:780px;margin:0 auto}
.sh.caps h2{text-transform:uppercase;letter-spacing:.04em;font-size:clamp(1.4rem,2.2cqw,1.95rem)}
.sh h2{font-size:clamp(1.75rem,3cqw,2.6rem);margin-top:18px}
.sh p{margin-top:18px}
.sh.l{text-align:left;margin:0}

/* ================= MOTION ================= */
.rise{display:block;overflow:hidden;padding:0 .14em .06em;margin:0 -.14em}
.rise>span{display:block;transform:translateY(110%);transition:transform 1.3s var(--ease)}
.rise.in>span{transform:none}
.r2>span{transition-delay:.12s}.r3>span{transition-delay:.24s}
.rv{opacity:0;transform:translateY(30px);transition:opacity 1.4s var(--ease),transform 1.4s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.22s}.d3{transition-delay:.34s}.d4{transition-delay:.46s}
.px{position:relative;overflow:hidden}
.px>.pxi{position:absolute;left:0;right:0;top:-14%;bottom:-14%;background-size:cover;background-position:center;will-change:transform}
.kb{animation:kb 26s ease-in-out infinite alternate}
@keyframes kb{from{scale:1.02}to{scale:1.12}}
canvas.embers{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;mix-blend-mode:screen}
.flick{position:absolute;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(var(--glow),.3),rgba(var(--glow),0) 65%);mix-blend-mode:screen;animation:flick 3.2s infinite;z-index:2}
@keyframes flick{0%,100%{opacity:.75}12%{opacity:.95}20%{opacity:.68}34%{opacity:1}48%{opacity:.8}57%{opacity:.92}70%{opacity:.7}84%{opacity:1}}
.torch{position:relative}
.torch>.lamp{position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(circle 300px at var(--mx,62%) var(--my,42%),rgba(var(--glow),.13),rgba(var(--glow),0) 70%),radial-gradient(circle 560px at var(--mx,62%) var(--my,42%),rgba(0,38,58,0) 25%,rgba(0,22,34,.5) 100%)}

/* ================= HEADER (weauction spec: 40px contact bar + 64/80px glass bar) ================= */
.hdr{position:sticky;top:0;z-index:60}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between}
.hdr svg.ic{display:block;flex:none}
.logo{width:156px;height:48px;background-image:var(--logo);background-size:contain;background-position:center;background-repeat:no-repeat}

/* contact bar — 40px, primary background, white 14px */
.topbar{height:40px;background:var(--w-primary);color:#fff}
.topbar .wrap{height:40px;font-size:14px;line-height:20px}
.topbar .pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 12px;border-radius:9999px;
  background:#278445;color:#fff;font-size:12px;line-height:16px;font-weight:600;text-transform:uppercase;letter-spacing:.025em;white-space:nowrap}
.topbar .pill .dot{position:relative;width:8px;height:8px;border-radius:9999px;background:#fff;flex:none}
.topbar .pill .dot::before{content:"";position:absolute;inset:0;border-radius:9999px;background:#fff;opacity:.75;animation:ping 1s cubic-bezier(0,0,.2,1) infinite}
@keyframes ping{75%,100%{transform:scale(2);opacity:0}}
.topbar .links{display:flex;align-items:center;gap:24px}
.topbar .links a{display:inline-flex;align-items:center;gap:8px;color:#fff;white-space:nowrap;transition:color .15s}
.topbar .links a:hover{color:var(--w-accent-soft)}
@container page (max-width: 639px){.topbar .links a span{display:none}}

/* main bar — 64px, 80px from 640px; white glass, 1px bottom border at 40% */
.mainbar{background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(191,191,190,.4)}
.mainbar .wrap{height:64px;gap:24px}
@container page (min-width: 640px){.mainbar .wrap{height:80px}}
.mainbar .burger{display:inline-flex;padding:8px;margin-left:-8px;border:0;background:none;color:var(--w-fg);cursor:pointer}
@container page (min-width: 1024px){.mainbar .burger{display:none}}
.mainbar .logo{height:40px;width:122px;background-image:var(--i-logo-navy);background-position:left center;flex:none}
@container page (min-width: 640px){.mainbar .logo{height:56px;width:171px}}

/* nav — from 1024px, 32px apart, 14px/600 uppercase +0.025em, 4px/8px, 6px radius */
.nav{display:none;align-items:center;gap:18px}
.nav a{padding:4px 8px;border-radius:6px;font-size:14px;line-height:20px;font-weight:600;text-transform:uppercase;
  letter-spacing:.025em;color:var(--w-fg);transition:color .15s;white-space:nowrap}
.nav a:hover,.nav a.active{color:var(--w-accent)}
.actions{display:none;align-items:center;gap:12px}
@container page (min-width: 1024px){.nav,.actions{display:flex}}
.actions .lang{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border:0;border-radius:6px;background:none;
  color:var(--w-fg);font-size:14px;line-height:20px;font-weight:600;cursor:pointer;transition:color .15s}
.actions .lang:hover{color:var(--w-accent)}
.actions .lang svg.flag{width:20px;height:14px;flex:none;border-radius:2px;display:block}

/* weauction buttons */
.wbtn{display:inline-flex;align-items:center;justify-content:center;gap:16px;height:44px;padding:0 24px;border:0;
  border-radius:12px;background:none;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;
  font-weight:500;white-space:nowrap;cursor:pointer;transition:all .3s}
.wbtn:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--w-accent)}
.wbtn.sm{height:36px;padding:0 16px;border-radius:10px;font-size:12px;line-height:16px}
.wbtn.lg{height:48px;padding:0 32px;border-radius:12px;font-size:16px;line-height:24px}
.wbtn.accent{background:var(--w-primary);color:#fff;box-shadow:0 4px 18px rgba(0,38,58,.3)}
.wbtn.accent:hover{opacity:.9}
.wbtn.lift:hover{transform:translateY(-2px)}
.wbtn.outline{border:2px solid var(--w-primary);color:var(--w-primary)}
.wbtn.outline:hover{background:var(--w-primary);color:#fff}
.wbtn.ghost{color:var(--w-fg)}
.wbtn.ghost:hover{background:var(--w-secondary)}

/* ================= SHARED BLOCKS ================= */
.film{position:relative;aspect-ratio:16/9;width:100%;overflow:hidden;background:#000d16}
.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,38,58,.5) 0%,rgba(0,38,58,0) 26%,rgba(0,38,58,0) 70%,rgba(0,38,58,.85) 100%);z-index:2}
.cue{position:absolute;left:0;right:0;bottom:30px;z-index:5;display:flex;flex-direction:column;align-items:center;gap:14px}
.cue .ln{width:1px;height:50px;background:linear-gradient(var(--ivory),transparent);animation:cue 2.6s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(.2);transform-origin:top;opacity:.2}50%{transform:scaleY(1);opacity:1}100%{transform:scaleY(.2);transform-origin:bottom;opacity:.2}}
.strip{display:flex;align-items:center;gap:24px;padding:22px 44px;border-bottom:1px solid var(--ln2)}
.strip .ln{flex:1;height:1px;background:var(--ln)}
.strip .sep{color:var(--di);font-size:.6rem}

/* statement */
.state{padding:96px 0 100px;text-align:center}
.state h1{font-size:clamp(2.8rem,5cqw,4.6rem);line-height:1.06;margin:24px auto 28px;max-width:900px}
.state p{max-width:560px;margin:0 auto;font-size:1.2rem}
.state .cta{display:flex;gap:14px;justify-content:center;margin-top:42px;flex-wrap:wrap}

/* facts row */
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ln)}
.fact{padding:28px 28px 0 0}
.fact+.fact{padding-left:28px;border-left:1px solid var(--ln2)}
.fact .lbl{display:block;margin-bottom:14px;font-size:.62rem}
.fact .v{font-family:Georgia,'Times New Roman',serif;font-size:1.4rem;color:var(--fg);line-height:1.25}

/* lot cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 40px}
.cards.stag .card:nth-child(3n+2){margin-top:70px}
.card{display:block;cursor:pointer;background:#fff;box-shadow:0 10px 30px -12px rgba(0,38,58,.3),0 2px 8px -3px rgba(0,38,58,.14);transition:box-shadow .5s var(--ease),transform .5s var(--ease)}
.card:hover{transform:translateY(-4px);box-shadow:0 22px 46px -14px rgba(0,38,58,.4),0 4px 12px -4px rgba(0,38,58,.18)}
.dark .card{background:rgba(255,255,255,.05);box-shadow:0 18px 44px -16px rgba(0,0,0,.6)}
.card .ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:#00263A}
.card .ph .im{position:absolute;inset:0;background-size:cover;background-position:center top;transition:transform 1.8s var(--ease),filter 1.2s;filter:saturate(.92)}
.card .ph .im.m{transform:scaleX(-1)}
.card:hover .ph .im{transform:scale(1.06);filter:brightness(1.08)}
.card:hover .ph .im.m{transform:scaleX(-1) scale(1.06)}
.card .ph::before{content:"";position:absolute;inset:0;z-index:2;background:radial-gradient(60% 50% at 50% 38%,rgba(var(--glow),.18),rgba(var(--glow),0) 70%);opacity:0;transition:opacity 1.2s;mix-blend-mode:screen}
.card:hover .ph::before{opacity:1}
.card .no{position:absolute;top:16px;left:16px;z-index:4;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.54rem;letter-spacing:.28em;color:var(--ivory);border:1px solid rgba(242,242,241,.32);padding:7px 11px;background:rgba(0,38,58,.4);backdrop-filter:blur(4px)}
.card .ph .anno{position:absolute;right:14px;bottom:14px;z-index:4}
.card .meta{padding:20px 20px 24px}
.card .meta .lbl{font-size:.62rem}
.card .meta .tl{font-weight:700}
.card h3{font-size:1.04rem;margin:10px 0 0;line-height:1.34}
.card h3 em{font-size:1.2rem}
.card .rc{font-style:italic;color:var(--di);font-size:1rem;margin-top:8px}
.card .hl{height:1px;background:var(--ln);margin:16px 0 14px}
.dark .card .ph .im,.mask .card .ph .im{-webkit-mask-image:radial-gradient(ellipse 72% 68% at 50% 44%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 72% 68% at 50% 44%,#000 58%,transparent 100%)}
.dark .card .ph{background:transparent}
.dark .card .ph::after{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(0deg,var(--bg) 0%,rgba(0,38,58,0) 30%)}

/* candlelit band (salon) */
.salon{position:relative;min-height:720px;display:flex;align-items:center;overflow:hidden}
.salon>.pxi{background-position:72% 50%}
.salon::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,var(--bg) 0%,rgba(0,38,58,.9) 26%,rgba(0,38,58,.3) 50%,rgba(0,38,58,0) 66%),linear-gradient(0deg,var(--bg) 0%,rgba(0,38,58,0) 20%),linear-gradient(180deg,var(--bg) 0%,rgba(0,38,58,0) 16%)}
.salon.flat::before{background:linear-gradient(90deg,var(--bg) 0%,rgba(0,38,58,.9) 26%,rgba(0,38,58,.3) 50%,rgba(0,38,58,0) 66%)}
.salon .txt{position:relative;z-index:5;padding:0 0 0 max(60px,calc((100% - 1180px)/2 + 60px));max-width:640px}
.salon h2{font-size:clamp(2.4rem,4cqw,3.6rem);margin:22px 0 22px}
.salon p+p{margin-top:14px}

/* how it works */
.steps{display:grid;grid-template-columns:repeat(3,1fr);margin-top:80px}
.step{padding:10px 44px;border-left:1px solid var(--ln)}
.step:first-child{border-left:none;padding-left:0}
.step .n{font-family:Georgia,'Times New Roman',serif;font-weight:300;font-size:3.2rem;color:var(--di);line-height:1;font-variant-numeric:lining-nums}
.step h3{font-size:1.22rem;margin:22px 0 12px}
.step p{font-size:1.06rem}
.how{position:relative;overflow:hidden}
.how>.pxi{opacity:.3}
.how::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,var(--bg) 0%,rgba(0,38,58,.5) 40%,rgba(0,38,58,.7) 70%,var(--bg) 100%)}
.how .wrap{position:relative;z-index:3}

/* catalogue signup */
.cat{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px}
.cat .pic{aspect-ratio:1456/1080;background:var(--i-newsletter) center/cover no-repeat}
.cat h2{font-size:clamp(1.65rem,2.6cqw,2.2rem);margin:18px 0 16px}
.field{display:flex;margin-top:32px;border:1px solid var(--ln);max-width:460px}
.field input{flex:1;background:transparent;border:none;outline:none;color:var(--fg);font-family:Georgia,'Times New Roman',serif;font-size:1.08rem;padding:16px 20px}
.field input::placeholder{color:var(--di);font-style:italic}
.field .btn{padding:16px 22px}
.nl-lede{font-family:Georgia,'Times New Roman',serif;font-size:clamp(1.22rem,1.95cqw,1.62rem);line-height:1.42;color:var(--fg);margin:0 0 30px;max-width:30ch}
.nlcol .field+.tick{margin-top:14px}
.nl-lede em{font-style:italic}
.cat .consent{margin-top:30px}
/* the pairing portraits do not parallax, so they get no overdraw: a 3:2 photograph
   then fills the 3:2 box exactly and nothing is cropped off the top */
.hpic{aspect-ratio:3/2;margin-bottom:26px}
.photo.hpic>.pxi{top:0;bottom:0}
.galhead{margin:54px 0 28px;padding-top:30px;border-top:1px solid var(--ln);
  display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap}
/* the first heading on the tab sits under the tab rule already, so it needs no second one */
.galhead.first{margin-top:0;padding-top:0;border-top:0}

/* masonry columns: every photograph keeps its own proportions, nothing is cropped */
/* --gcols is set per gallery from the number of photographs, so a lot with one
   or two does not leave empty columns across the rest of the page. A grid
   rather than multi-column: column balancing put two photographs in the same
   column and left the other half of the page empty. */
.gallery{--gcols:3;display:grid;align-items:start;
  grid-template-columns:repeat(min(var(--gcols),3),minmax(0,1fr));gap:30px 26px}

.gfig{margin:0;width:100%}
.gtile{display:block;width:100%;padding:0;border:0;cursor:zoom-in;background-size:cover;
  background-position:center;background-color:var(--w-primary);
  box-shadow:0 16px 40px -24px rgba(0,38,58,.5);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.gtile:hover{transform:translateY(-3px);box-shadow:0 26px 52px -24px rgba(0,38,58,.58)}
.gtile:focus-visible{outline:2px solid var(--w-accent);outline-offset:3px}
.gcap{margin-top:13px;font-family:Georgia,'Times New Roman',serif;font-size:1.02rem;color:var(--fg)}
.gcap .lbl{display:block;margin-bottom:5px}

/* lightbox */
.lbox{position:fixed;inset:0;z-index:999;background:rgba(0,18,30,.975);display:flex;
  flex-direction:column;align-items:center;justify-content:center;padding:28px 72px 24px;
  opacity:0;transition:opacity .28s var(--ease)}
/* an author display rule beats the UA [hidden] rule, so say it explicitly:
   without this the closed overlay stays in the layer and swallows every click */
.lbox[hidden]{display:none}
.lbox{pointer-events:none}
.lbox.on{opacity:1;pointer-events:auto}
.lbx-img{cursor:zoom-out}
.lbx-stage{flex:1;width:100%;display:flex;align-items:center;justify-content:center;min-height:0}
.lbx-img{width:100%;height:100%;background-repeat:no-repeat;background-position:center;
  background-size:contain}
.lbx-cap{margin-top:20px;text-align:center;color:#fff;font-family:Georgia,'Times New Roman',serif;
  font-size:1.12rem;flex:none}
.lbx-cap .lbl{display:block;margin-bottom:6px;color:rgba(255,255,255,.72)}
.lbx-count{display:block;margin-top:9px;font-family:'Open Sans',Helvetica,Arial,sans-serif;
  font-size:.76rem;letter-spacing:.2em;color:rgba(255,255,255,.55)}
.lbx-btn{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;
  width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:26px;line-height:1;transition:background .25s ease}
.lbx-btn:hover{background:rgba(255,255,255,.26)}
.lbx-prev{left:16px;top:50%;transform:translateY(-50%)}
.lbx-next{right:16px;top:50%;transform:translateY(-50%)}
.lbx-close{top:16px;right:16px;width:46px;height:46px;font-size:22px}
@container page (max-width: 900px){
  .gallery{grid-template-columns:repeat(min(var(--gcols),2),minmax(0,1fr))}}
@container page (max-width: 560px){
  .gallery{grid-template-columns:minmax(0,1fr)}}
.hl-two.bare .lbl{display:block}
.vids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 26px;max-width:920px}
.vid{margin:0;min-width:0}
button.vframe{display:block;width:100%;padding:0;border:0;cursor:pointer;background-size:cover;background-position:center;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
button.vframe:hover{transform:translateY(-3px);box-shadow:0 26px 54px -24px rgba(0,38,58,.62)}
button.vframe::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,38,58,.10),rgba(0,38,58,.34))}
.vplay{position:absolute;left:50%;top:50%;width:64px;height:64px;transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.93);z-index:2;transition:transform .35s var(--ease)}
.vplay::before{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:11px 0 11px 18px;border-color:transparent transparent transparent var(--w-primary)}
button.vframe:hover .vplay{transform:translate(-50%,-50%) scale(1.08)}
.vframe{position:relative;aspect-ratio:16/9;background-color:var(--w-primary);overflow:hidden;box-shadow:0 18px 44px -24px rgba(0,38,58,.55)}
.vframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.vid figcaption{margin-top:14px;font-family:Georgia,'Times New Roman',serif;font-size:1.06rem;color:var(--fg)}
.vid figcaption .lbl{display:block;margin-bottom:5px}
.thumb.vid{cursor:pointer}
.nlform{margin:0}
/* honeypot: present in the DOM, never on screen and never focusable */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.nlmsg{margin:18px 0 0;font-size:.92rem;line-height:1.5;min-height:1px}
.nlmsg.ok{color:var(--w-primary);font-weight:600}
.nlmsg.err{color:#8c3b1e}
/* a button element, so the UA styles need resetting - but not the .btn type scale */
.nlform button.btn{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.62rem;line-height:1;border:0;cursor:pointer}
.tick{display:flex;align-items:flex-start;gap:11px;margin-top:20px;cursor:pointer;max-width:460px}
.tick input{appearance:none;-webkit-appearance:none;flex:none;width:17px;height:17px;margin-top:2px;border:1px solid var(--ln);background:#fff;border-radius:2px;cursor:pointer;position:relative;transition:.2s ease}
.tick input:checked{background:var(--w-primary);border-color:var(--w-primary)}
.tick input:checked::after{content:"";position:absolute;left:5px;top:1px;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
.tick input:focus-visible{outline:2px solid var(--w-accent);outline-offset:2px}
.tick span{font-size:.82rem;line-height:1.55;color:var(--mu)}
.tick a,.consent a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.consent a:hover{color:var(--w-accent-strong)}
.consent{font-size:.82rem;line-height:1.6;color:var(--di);margin-top:12px;font-style:italic;max-width:460px}

/* footer */
/* ================= FOOTER (weauction spec) ================= */
.foot{background:var(--w-primary);color:#fff;border-top:1px solid rgba(191,191,190,.2)}
.foot .wrap{padding-top:48px;padding-bottom:48px}
.foot-g{display:grid;gap:32px}
@container page (min-width: 768px){.foot-g{grid-template-columns:repeat(4,minmax(0,1fr))}}
.foot .logo{height:48px;width:146px;background-image:var(--i-logo-ivory);background-position:left center}
.fsoc{display:flex;gap:12px;margin-top:22px}
.fsoc a{width:36px;height:36px;border-radius:50%;background:#fff;color:var(--w-primary);display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .2s ease,transform .2s ease}
.fsoc a:hover{background:#e8e9e8;transform:translateY(-2px)}
.fsoc svg{display:block}
.fcol h4{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:16px;line-height:24px;font-weight:600;
  letter-spacing:0;text-transform:none;color:#fff}
.fcol ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.fcol ul.contact{gap:12px}
.fcol a,.fcol span,.fcol button{display:inline-flex;align-items:center;gap:8px;padding:0;border:0;background:none;
  font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;color:rgba(255,255,255,.88);
  cursor:pointer;transition:color .15s;text-align:left}
.fcol a:hover,.fcol button:hover{color:#fff}
.fcol svg.ic{color:#fff;flex:none}
.foot-b{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  font-size:14px;line-height:20px;color:rgba(255,255,255,.72)}
.foot-b a{color:rgba(255,255,255,.88);border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:1px;transition:.3s}
.foot-b a:hover{color:#fff;border-bottom-color:#fff}
.fcredit{color:rgba(255,255,255,.4)}
.fcredit a{color:rgba(255,255,255,.48);border-bottom-color:transparent}
.fcredit a:hover{color:rgba(255,255,255,.8);border-bottom-color:rgba(255,255,255,.35)}

/* ================= VERSION A — CATALOGUE ================= */
.a-top{padding:44px 0 0}
.a-top .row{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:22px}
.a-film{position:relative;margin:0 44px;height:62vh;min-height:460px;overflow:hidden;background:#000d16}
.a-film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.a-film .cap{position:absolute;left:24px;bottom:20px;z-index:3;color:rgba(242,242,241,.7)}
.a-why{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.a-why h2{font-size:clamp(1.7rem,2.75cqw,2.35rem);margin:18px 0 20px}
.a-why p+p{margin-top:14px}
.photo{position:relative;overflow:hidden}
.photo.shadow{box-shadow:0 18px 44px -14px rgba(0,38,58,.42),0 4px 12px -4px rgba(0,38,58,.18)}
.photo.full>.pxi{top:0;bottom:0}
.dark .photo.shadow{box-shadow:0 22px 50px -14px rgba(0,0,0,.62)}
.photo .pxi{position:absolute;left:0;right:0;top:-12%;bottom:-12%;background-size:cover;background-position:center}
.photo-cap{display:flex;justify-content:space-between;margin-top:14px}
.photo-cap .lbl{font-size:.6rem}
.prog{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:80px}
.prog .ph{aspect-ratio:4/5}
.prog h3{font-size:1.25rem;margin:22px 0 10px}
.prog .lbl{display:block;margin-top:22px;font-size:.62rem}
.prog p{font-size:1.04rem}

/* ================= VERSION B — DUSK ================= */
.b-split{display:grid;grid-template-columns:1fr 1fr;min-height:720px}
.b-split .ph{min-height:720px}
.b-split .tx{display:flex;flex-direction:column;justify-content:center;padding:100px 80px}
.b-split h2{font-size:clamp(2.1rem,3.4cqw,3rem);margin:20px 0 22px}
.b-split p+p{margin-top:14px}
.b-split .facts{margin-top:50px;grid-template-columns:1fr 1fr}
.b-split .fact:nth-child(n+3){padding-top:22px}
.bridge{position:relative;min-height:820px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.bridge>.pxi{background-position:center 60%}
.bridge::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,var(--cream) 0%,rgba(241,241,240,0) 24%,rgba(0,38,58,0) 55%,rgba(0,38,58,.85) 85%,#00263A 100%)}
.bridge .in{position:relative;z-index:5;max-width:760px;padding:0 40px;margin-top:120px}
.bridge h2{font-size:clamp(2.4rem,4.2cqw,3.8rem);color:#f2f2f1;margin-top:20px;text-shadow:0 2px 30px rgba(0,20,32,.5)}
.bridge .lbl{color:rgba(242,242,241,.8)}
.bridge p{color:rgba(242,242,241,.85);margin-top:18px}
.b-index .row{display:grid;grid-template-columns:120px 90px 1fr 1fr auto;gap:30px;align-items:center;padding:22px 0;border-bottom:1px solid var(--ln2);cursor:pointer;transition:background .4s}
.b-index .row:hover{background:var(--bg2)}
.b-index .row .th{width:120px;aspect-ratio:4/5;background-color:#00263A;background-size:cover;background-position:center 30%;overflow:hidden;transition:transform .8s var(--ease)}
.b-index .row:hover .th{transform:scale(1.04)}
.b-index .row .th.m{transform:scaleX(-1)}
.b-index .row:hover .th.m{transform:scaleX(-1) scale(1.04)}
.b-index .row .n{font-family:Georgia,'Times New Roman',serif;font-weight:300;font-size:2.6rem;color:var(--di);font-variant-numeric:lining-nums}
.b-index .row h3{font-size:1.15rem;line-height:1.35}
.b-index .row .sub{font-style:italic;color:var(--di);margin-top:6px}
.b-index .row .rc .lbl{display:block;font-size:.58rem}
.b-index .row .rc div{font-family:Georgia,'Times New Roman',serif;font-size:.92rem;color:var(--fg);margin-top:8px}
.b-index .head{display:grid;grid-template-columns:120px 90px 1fr 1fr auto;gap:30px;padding:0 0 16px;border-bottom:1px solid var(--ln)}
.b-index .head .lbl{font-size:.58rem}

/* ================= VERSION C — NIGHT SALON ================= */
.arch{border-radius:999px 999px 0 0;overflow:hidden;position:relative}
.arch::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(242,242,241,.18);pointer-events:none;z-index:6}
.c-hero{max-width:1240px;margin:0 auto;padding:54px 60px 90px;position:relative;z-index:4}
.c-hero .win{height:500px;position:relative;background:#06111c}
.c-hero .win video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c-hero .win .glow{position:absolute;inset:0;z-index:2;background:linear-gradient(0deg,rgba(0,38,58,.85) 0%,rgba(0,38,58,0) 30%);pointer-events:none}
.c-hero-tx{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:end;margin-top:-90px;position:relative;z-index:5;padding:0 40px}
.c-hero-tx h1{font-size:clamp(2.6rem,4.4cqw,4.1rem);margin-top:22px;line-height:1.08}
.c-hero-tx p{font-size:1.18rem}
.c-hero-tx .cta{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}
.c-wins{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:80px}
.c-wins .arch{aspect-ratio:3/4.2}
.c-wins .arch .pxi{position:absolute;left:0;right:0;top:-10%;bottom:-10%;background-size:cover;background-position:center}
.c-wins .lbl{display:block;text-align:center;margin-top:18px;font-size:.62rem}
.c-emb{display:grid;grid-template-columns:1fr 1.1fr;gap:90px;align-items:center}
.lens{aspect-ratio:1;border-radius:50%;position:relative;max-width:440px;margin:0 auto;width:100%}
.lens .tint{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 48%,rgba(0,38,58,0) 58%,rgba(0,38,58,.35) 68%,rgba(0,38,58,.9) 71%);box-shadow:0 0 80px rgba(var(--glow),.18)}
.lens::before{content:"";position:absolute;inset:-26px;border-radius:50%;border:1px solid rgba(242,242,241,.18)}
.lens .cap{position:absolute;left:0;right:0;bottom:-70px;text-align:center}
.feat{margin-top:34px;display:flex;flex-direction:column;gap:24px}
.feat .f{padding-left:22px;border-left:1px solid var(--ln)}
.feat h4{font-size:.98rem;letter-spacing:.04em}
.feat p{font-size:1.04rem;margin-top:6px;line-height:1.6}
@container page (max-width: 900px){.a-why,.b-split,.c-emb,.c-hero-tx{grid-template-columns:minmax(0,1fr);gap:40px}.prog,.c-wins{grid-template-columns:minmax(0,1fr)}.b-split .ph{min-height:340px}}

/* ================= PAGE HEADS ================= */
.phead{padding:66px 0 60px}
/* title band over a photograph, under a blue overlay */
.phead.band{position:relative;overflow:hidden;padding-top:86px;padding-bottom:86px}
.phead.band>.pxi{position:absolute;inset:0;background-size:cover;background-position:center 62%;z-index:0}
.phead.band::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,38,58,.9) 0%,rgba(0,38,58,.78) 42%,rgba(0,38,58,.92) 100%)}
.phead.band>.wrap{position:relative;z-index:3}
.phead.band h1,.phead.band p,.phead.band .lbl{text-shadow:0 2px 20px rgba(0,20,32,.55)}
.phead h1{font-size:clamp(1.78rem,2.95cqw,2.62rem);margin:18px 0 18px;line-height:1.1}
.phead p{max-width:560px;font-size:.95rem}
.bidwin{display:flex;gap:54px;margin-top:28px;flex-wrap:wrap}
.bidwin>div{display:flex;flex-direction:column;gap:7px}
.bidwin .k{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.56rem;letter-spacing:.28em;text-transform:uppercase;color:var(--di)}
.bidwin .v{font-family:Georgia,'Times New Roman',serif;font-size:1.3rem;color:var(--fg);line-height:1.2}
.cbar{display:flex;justify-content:space-between;align-items:center;padding:24px 0;border-top:1px solid var(--ln2);border-bottom:1px solid var(--ln2);margin-bottom:70px}
.cbar .f2{display:flex;gap:34px}
.cbar .f2 span{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.56rem;letter-spacing:.28em;text-transform:uppercase;color:var(--mu)}
.cbar .f2 b{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:1.3rem;letter-spacing:0;color:var(--fg);margin-right:8px;text-transform:none;font-variant-numeric:lining-nums}
.banner{height:360px;margin-top:50px}
.chead-c{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:end;padding:66px 0 70px}
.chead-c .arch{height:520px}

/* ================= LOT PAGE (Zangersheide structure) ================= */
.lot-top{padding:56px 0 80px}
.back{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.56rem;letter-spacing:.28em;text-transform:uppercase;color:var(--di);display:inline-flex;gap:10px;margin-bottom:34px;transition:color .3s}
.back:hover{color:var(--fg)}
.lot-g{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
/* a grid item defaults to min-width:auto, so a long unwrapped title would push
   its column past its half share and shrink the artwork. Every lot page has to
   look identical, so the columns hold their share and the title wraps instead. */
.lot-g>*{min-width:0}
.gal .main{position:relative;aspect-ratio:4/5;overflow:hidden;background:#00263A}
.gal .main .im{position:absolute;inset:0;background-size:cover;background-position:center 30%}
.dark .gal .main .im{-webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 44%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 72% 70% at 50% 44%,#000 58%,transparent 100%)}
.dark .gal .main{background:transparent}
.gal .main .no{position:absolute;top:18px;left:18px;z-index:5;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.56rem;letter-spacing:.28em;color:var(--ivory);border:1px solid rgba(242,242,241,.32);padding:8px 12px;background:rgba(0,38,58,.4);backdrop-filter:blur(4px)}
.gal .main .anno{position:absolute;left:18px;bottom:18px;z-index:5}
.gal .main.arch{aspect-ratio:4/5.3}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.thumb{aspect-ratio:1;background-color:#00263A;background-size:cover;background-position:center 30%;position:relative;cursor:pointer;opacity:.62;transition:.4s;outline:1px solid transparent;outline-offset:2px}
.thumb:hover{opacity:1}.thumb.on{opacity:1;outline-color:var(--ln)}
.thumb.vid{display:flex;align-items:center;justify-content:center}
.thumb.vid i{width:38px;height:38px;border:1px solid rgba(242,242,241,.6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-style:normal;color:var(--ivory);font-size:.7rem;padding-left:3px;position:relative;z-index:2;background:rgba(0,38,58,.4)}
.thumb .t{position:absolute;bottom:7px;left:0;right:0;text-align:center;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.44rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(242,242,241,.8);z-index:2}
.kick{display:flex;justify-content:space-between;align-items:center;gap:14px}
.info{position:sticky;top:132px}
.info h1{font-size:clamp(1.8rem,2.9cqw,2.5rem);margin:16px 0 10px;line-height:1.1}
.info h1.cross{line-height:1.2;font-size:clamp(1.1rem,2.4cqw,2.4rem)}
.info h1.cross .nm{white-space:nowrap}
.info h1.cross i{font-style:normal;color:var(--em);font-size:.74em;padding:0 .1em;vertical-align:.06em}
.info h1.cross .ds{display:block;margin-top:12px;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:1.08rem;font-weight:400;letter-spacing:.01em;text-transform:none;color:var(--mu);white-space:normal}
.info .sub{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mu)}
.kick .lbl.big{font-size:.84rem;letter-spacing:.26em}
.info .sub b{font-weight:500;color:var(--fg)}
.info .tag{margin:22px 0 0;font-style:italic;font-size:1.22rem;color:var(--tx)}
.aucbox{margin-top:30px;border:1px solid var(--ln);padding:26px 28px}
.aucbox .r1{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.aucbox .r1 .lbl{font-size:.62rem}
.aucbox .r1 .v{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:1.9rem;color:var(--fg);margin-top:6px;font-variant-numeric:lining-nums}
.chip{display:inline-flex;align-items:center;gap:8px;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.5rem;letter-spacing:.24em;text-transform:uppercase;color:var(--fg);border:1px solid var(--ln);padding:7px 12px;border-radius:100px;white-space:nowrap}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--fg);opacity:.75;box-shadow:0 0 0 3px var(--ln2)}
.aucbox .btn{width:100%;justify-content:center;margin-top:22px}
.aucbox .sm{display:flex;justify-content:space-between;margin-top:14px;font-size:.98rem;color:var(--di);font-style:italic}
.aucbox .sm a{color:var(--fg);font-style:normal;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.54rem;letter-spacing:.24em;text-transform:uppercase}
.dl{margin-top:30px;border-top:1px solid var(--ln)}
.dl .r{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--ln2)}
.m-bd .dl .r{padding:11px 0}.m-bd .dl .r .v{font-size:.82rem}
.info .dl .lbl{font-size:.8rem;letter-spacing:.2em;color:var(--mu)}
.info .dl .v{font-size:1.02rem}
.dl .r .v{font-family:Georgia,'Times New Roman',serif;font-size:.95rem;color:var(--fg);text-align:right}
.share{display:flex;gap:34px;margin-top:30px}
.share a{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--fg);padding-bottom:4px;border-bottom:1px solid var(--ln)}
.share a:hover{border-bottom-color:var(--fg)}
.lot-tabs{padding:0 0 110px}
.tabbar{display:flex;gap:46px;border-bottom:1px solid var(--ln);position:sticky;top:116px;z-index:20;background:var(--bg);padding-top:26px}
.tabbar button{background:none;border:none;cursor:pointer;font-family:Georgia,'Times New Roman',serif;font-size:1rem;color:var(--di);padding:0 0 18px;position:relative;letter-spacing:.04em;transition:color .3s}
.tabbar button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--fg);transform:scaleX(0);transition:transform .5s var(--ease)}
.tabbar button.on{color:var(--fg)}.tabbar button.on::after{transform:none}
.tabbar button:hover{color:var(--fg)}
.tp{display:none;padding-top:64px;animation:tpin .8s var(--ease)}
.tp.on{display:block}
@keyframes tpin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.tpg{display:grid;grid-template-columns:1fr 1.15fr;gap:80px;align-items:start}
.tpg>*{min-width:0}
@container page (max-width: 860px){.tpg{grid-template-columns:minmax(0,1fr)!important;gap:36px}}
.tpg h2{font-size:clamp(1.5rem,2.3cqw,2rem);margin:14px 0 18px}
.hls{margin-top:30px;border-top:1px solid var(--ln)}
.hls .h{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--ln2)}
.hls .h .n{font-family:Georgia,'Times New Roman',serif;font-size:1.3rem;color:var(--di);font-variant-numeric:lining-nums}
.hls .h div{font-size:1.08rem;color:var(--mu);line-height:1.6}
.hls .h div b{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--fg);font-size:.95rem;display:block;margin-bottom:2px}
.pairv{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.pairv .hp{aspect-ratio:4/5;position:relative;overflow:hidden;background:#00263A}
.pairv .hp .im{position:absolute;inset:0;background-size:cover;background-position:center 30%}
.dark .pairv .hp{background:transparent}
.dark .pairv .hp .im{-webkit-mask-image:radial-gradient(ellipse 72% 68% at 50% 44%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 72% 68% at 50% 44%,#000 58%,transparent 100%)}
.pairv .hp .cap{position:absolute;left:0;right:0;bottom:14px;z-index:3;text-align:center}
.pairv .hp .cap .lbl{display:block;font-size:.56rem;color:rgba(242,242,241,.7)}
.pairv .hp .cap .n{font-family:Georgia,'Times New Roman',serif;color:var(--ivory);font-size:1rem;margin-top:6px}
.pairv .hp::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,38,58,.9) 0%,rgba(0,38,58,0) 40%)}
.pairv .xx{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:300;font-size:3rem;color:var(--em);padding:0 14px}
.pedwrap{margin-top:40px;position:relative;min-width:0;max-width:100%}
.pedwrap.can-scroll::after{content:"";position:absolute;top:0;right:0;width:46px;height:calc(100% - 30px);
  pointer-events:none;background:linear-gradient(90deg,transparent,var(--bg))}
.pedscroll{min-width:0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--ln) transparent}
.pedscroll::-webkit-scrollbar{height:6px}
.pedscroll::-webkit-scrollbar-track{background:var(--ln2);border-radius:6px}
.pedscroll::-webkit-scrollbar-thumb{background:var(--ln);border-radius:6px}
.pedhint{display:none;margin-top:14px;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.56rem;
  letter-spacing:.24em;text-transform:uppercase;color:var(--di);align-items:center;gap:10px}
.pedwrap.can-scroll .pedhint{display:inline-flex}
.ped{display:grid;gap:0 26px;min-width:600px;padding-bottom:6px}
.ped.g3{grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:repeat(8,58px)}
.ped .nd{border-left:1px solid var(--ln);padding-left:14px;display:flex;flex-direction:column;justify-content:center;position:relative}
.ped .nd::before{content:"";position:absolute;left:0;top:50%;width:8px;height:1px;background:var(--ln)}
.ped .nd .lbl{font-size:.52rem;letter-spacing:.24em}
.ped .nd .v{font-family:Georgia,'Times New Roman',serif;color:var(--fg);font-size:1rem;margin-top:4px;line-height:1.25}
.ped .nd.g1 .v{font-size:1rem}
.ped .nd.tbc .v{font-family:Georgia,'Times New Roman',serif;font-style:italic;color:var(--di);font-size:.98rem}
.ped .nd.g3 .v{font-size:1rem}
.ped .nd.sire .v{font-weight:700}
.pedwrap.m{margin-top:16px}
.pedwrap.m .ped{min-width:548px;gap:0 18px}
.pedwrap.m .ped.g3{grid-template-rows:repeat(8,50px)}
.pedwrap.m .ped .nd .v{font-size:.88rem}
.pedwrap.m .ped .nd.g1 .v{font-size:1rem}
.pedwrap.m .ped .nd.g3 .v{font-size:.84rem}
.pedwrap.m .pedhint{font-size:.5rem;margin-top:12px}
.pedkey{display:flex;gap:28px;margin-top:30px}
.pedkey span{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.5rem;letter-spacing:.24em;text-transform:uppercase;color:var(--di);display:flex;align-items:center;gap:10px}
.pedkey i{width:18px;height:2px;background:var(--ln)}.pedkey i.d{background:none;border-top:1px dashed var(--fg);height:0}
.line{margin-top:30px;border-left:1px solid var(--ln);padding-left:30px;display:flex;flex-direction:column;gap:30px}
.line .t{position:relative}
.line .t::before{content:"";position:absolute;left:-35px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--bg);border:1px solid var(--fg)}
.line .t .lbl{font-size:.6rem}
.line .t h4{font-size:1.1rem;margin-top:8px}
.line .t p{font-size:1.02rem;margin-top:6px;font-style:italic;color:var(--di)}
.media{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px;margin-top:10px}
.media .m{aspect-ratio:4/5;background-color:#00263A;background-size:cover;background-position:center 30%;position:relative;overflow:hidden}
.media .m:first-child{aspect-ratio:auto;grid-row:span 1}
.media .m .ov{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:rgba(0,38,58,.55)}
.media .m .ov i{width:56px;height:56px;border:1px solid rgba(242,242,241,.6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-style:normal;color:var(--ivory);padding-left:4px}
.media .m .ov .lbl{color:rgba(242,242,241,.85);font-size:.6rem}
.related{padding:110px 0 130px;border-top:1px solid var(--ln2)}
.related .top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px}
.related h2{font-size:clamp(1.8rem,3cqw,2.5rem);margin-top:16px}

/* ================= MOBILE ================= */
.phones{display:flex;gap:46px;justify-content:center;flex-wrap:wrap;align-items:flex-start;width:100%;max-width:1400px}
.pcol{display:flex;flex-direction:column;align-items:center}
.phone{width:416px;height:850px;border-radius:52px;background:#05090c;padding:13px;box-shadow:0 50px 100px -30px rgba(0,0,0,.9),0 0 0 1px rgba(191,191,190,.16),inset 0 0 0 2px #1a2228}
.pscr{width:100%;height:100%;border-radius:40px;overflow-y:auto;overflow-x:hidden;position:relative;scrollbar-width:none;font-family:'Open Sans',Helvetica,Arial,sans-serif;background:#f1f1f0}
.pscr>.compact,.pscr>.site{width:100%}
.pscr::-webkit-scrollbar{display:none}
.plab{text-align:center;margin-top:18px;font-size:.58rem;letter-spacing:.32em;text-transform:uppercase;color:#7b8c96}
.plab b{font-family:Georgia,'Times New Roman',serif;color:var(--ivory);font-weight:600;letter-spacing:.1em;margin-right:8px}
.mnav{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:44px 20px 12px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--ln2)}
.mnav .logo{width:116px;height:36px}
.mnav .bg{display:flex;flex-direction:column;gap:6px;width:24px}.mnav .bg span{height:1px;background:var(--fg)}
.mnav .bg span:nth-child(2){width:70%;margin-left:auto}
.m-back{display:block;padding:16px 20px 0}
.m-gal{padding:14px 20px 0}
.m-gal .main{aspect-ratio:4/5;position:relative;overflow:hidden;background:#00263A}
.m-gal .main .im{position:absolute;inset:0;background-size:cover;background-position:center 30%}
.dark .m-gal .main{background:transparent}
.dark .m-gal .main .im{-webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 44%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 72% 70% at 50% 44%,#000 58%,transparent 100%)}
.m-gal .main.arch{border-radius:999px 999px 0 0}
.m-gal .dots{display:flex;gap:6px;justify-content:center;margin-top:12px}
.m-gal .dots i{width:6px;height:6px;border-radius:50%;background:var(--ln)}.m-gal .dots i.on{background:var(--fg)}
.m-bd{padding:22px 20px 30px}
.m-bd h1{font-size:1.65rem;margin:12px 0 8px;line-height:1.12}
.m-bd .sub{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mu)}
.m-bd .aucbox{padding:18px}
.m-bd .aucbox .r1 .v{font-size:1.4rem}
.m-bd .dl .r{padding:11px 0}.m-bd .dl .r .v{font-size:.82rem}
.m-acc{margin-top:26px;border-top:1px solid var(--ln)}
.m-acc .it{border-bottom:1px solid var(--ln2)}
.m-acc .it .hd{display:flex;justify-content:space-between;padding:17px 0;font-family:Georgia,'Times New Roman',serif;color:var(--fg);font-size:.95rem}
.m-acc .it .hd span{color:var(--di)}
.m-acc .it .bd{padding:0 0 18px;font-size:1rem;color:var(--mu);line-height:1.6}
.m-stick{position:sticky;bottom:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px 22px;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);border-top:1px solid var(--ln2)}
.m-stick .d{font-family:Georgia,'Times New Roman',serif;color:var(--fg);font-size:1.08rem;line-height:1.2;font-variant-numeric:lining-nums}
.m-stick .d .lbl{display:block;font-size:.52rem}
.m-stick .btn{padding:14px 16px;font-size:.52rem}
.m-foot{padding:26px 20px 34px;text-align:center}
.m-foot .logo{width:120px;height:38px;margin:0 auto 10px}
.m-foot .lbl{font-size:.52rem}

/* ================= VERSION D — MASTHEAD ================= */
.collage-sec{padding:30px 0 70px;position:relative;overflow:hidden;background:linear-gradient(180deg,var(--bg) 0%,#002f47 45%,var(--bg) 100%)}
.collage-in{max-width:1420px;margin:0 auto;position:relative;z-index:3;padding:0 30px}
.collage-cap{text-align:center;margin-top:8px}
.collage-sec::before{content:"";position:absolute;left:50%;top:40%;width:80%;height:60%;transform:translate(-50%,-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(123,160,180,.18),transparent 70%);z-index:1;pointer-events:none}

.reveal-wrap{padding:150px 0}
.reveal-text{font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:clamp(1.55rem,3cqw,2.7rem);line-height:1.58;color:var(--fg);letter-spacing:.012em}
.reveal-text .w{opacity:.14;transition:opacity .25s linear}
.reveal-text .jump{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;font-size:1em;letter-spacing:0;padding:0 .02em;color:var(--silver)}
.light .reveal-text .jump{color:var(--w-primary)}

.gal .main.poster{background:transparent}
.gal .main.poster .im{-webkit-mask:none;mask:none;background-size:cover;background-position:center top}
.gal .main.poster::after{display:none}
.m-gal .main.poster .im{-webkit-mask:none;mask:none;background-size:cover}

/* ================= COUNTDOWN (no prices) ================= */
.cd{display:flex;margin-top:18px;padding-top:16px;border-top:1px solid var(--ln2)}
.cd .u{flex:1;text-align:center;position:relative}
.cd .u+.u::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--ln2)}
.cd .n{font-family:Georgia,'Times New Roman',serif;font-weight:300;font-size:1.85rem;color:var(--fg);line-height:1;font-variant-numeric:lining-nums;font-feature-settings:"tnum"}
.cd .l{display:block;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.44rem;letter-spacing:.24em;text-transform:uppercase;color:var(--di);margin-top:8px}
.cd.sm{margin:0;padding:0;border:none;gap:0}
.cd.sm .u{padding:0 14px}
.cd.sm .n{font-size:1.3rem}
.cd.sm .l{font-size:.4rem;margin-top:5px}
.cdwrap{display:flex;align-items:center;gap:22px}
.cdwrap .lbl{white-space:nowrap}
@container page (max-width: 900px){.cdwrap{display:none}}

/* ================= COMPACT (Version D) ================= */
.compact .sec{padding:80px 0}
.compact .film{aspect-ratio:16/9}
.compact .card .ph{aspect-ratio:1/1}
.compact .facts{margin-top:52px}
.compact .salon{min-height:470px}
.compact .cat .pic{aspect-ratio:1456/1080}
.compact .phead{padding:54px 0 50px}
.compact .lot-top{padding:44px 0 66px}
.compact .lot-tabs{padding-bottom:80px}
.compact .related{padding:78px 0 90px}
.compact .tp{padding-top:48px}
.compact .a-why{gap:70px}

/* statement + collage, one block */
.revcol{position:relative;overflow:hidden;padding:88px 0 78px;background:var(--bg)}
/* the DNA photograph, faded into the navy at the top and bottom edges */
.dnabg{position:absolute;inset:0;z-index:1;pointer-events:none;background-image:var(--i-dnaband);background-size:cover;background-position:center;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 20%,#000 80%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,#000 20%,#000 80%,transparent 100%)}
.revcol::before{content:"";position:absolute;left:50%;top:50%;width:76%;height:82%;transform:translate(-50%,-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(0,32,48,.46),transparent 72%);z-index:2;pointer-events:none}
.revgrid{display:grid;grid-template-columns:1fr 1.04fr;gap:54px;align-items:center;position:relative;z-index:4}
.revcol .lbl{display:block;margin-bottom:20px}
.revcol .reveal-text{font-size:clamp(1.3rem,2.15cqw,1.98rem);line-height:1.46}
/* single centred column */
.revgrid.one{grid-template-columns:minmax(0,1fr);max-width:880px;margin:0 auto;text-align:center;justify-items:center}
.revgrid.one h1{letter-spacing:.012em;font-size:clamp(1.7rem,2.9cqw,2.65rem);line-height:1.16}
.revcol .lbl.rv{font-family:Georgia,'Times New Roman',serif;font-size:1rem;letter-spacing:.3em;color:var(--di);text-transform:uppercase}
.revgrid.one .heroP{max-width:720px;margin-left:auto;margin-right:auto}
.revgrid.one .cta{justify-content:center}
.revgrid.one .hero-cd{margin-left:auto;margin-right:auto}
.revgrid.one .hero-cd .lbl{text-align:center}
.revcol .cta{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
@container page (max-width: 900px){.revgrid{grid-template-columns:minmax(0,1fr);gap:34px}}

/* farm strip */
.pstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:62px}
.pstrip .ph{aspect-ratio:3/2;position:relative;overflow:hidden}
.pstrip .lbl{display:block;margin-top:14px;font-size:.62rem}
.pstrip p{font-size:.94rem;margin-top:5px;line-height:1.6}
@container page (max-width: 900px){.pstrip{grid-template-columns:1fr}}

/* ================= HERO COPY + STANDOUT ================= */
/* countdown strip between the film and the page */
.cdband{padding:0;background:#fff;border-bottom:1px solid rgba(191,191,190,.45)}
.cdband-in{display:flex;align-items:center;justify-content:center;gap:28px;padding:22px 0;flex-wrap:wrap}
.cdband-in .lbl{font-size:.62rem;letter-spacing:.3em;display:inline-flex;align-items:baseline;gap:9px}
.cdband-in .lbl b{font-family:Georgia,'Times New Roman',serif;font-size:1.05rem;font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--fg)}
.cdband-in .cd{margin-top:0;padding-top:0;border-top:0;gap:0}
.cdband-in .cd .u{flex:none;min-width:84px}
.cdband-in .cd .u .n{font-size:1.5rem}
.cdband-in .cd .u .l{font-size:.44rem}
@container page (max-width: 600px){.cdband-in{gap:14px;padding:18px 0}.cdband-in .cd .u{min-width:62px}}

.revcol h1{font-size:clamp(2rem,3.5cqw,3.25rem);line-height:1.16;margin:16px 0 20px}
.revcol .heroP{font-size:.94rem;line-height:1.72;color:var(--mu);max-width:560px;margin-bottom:13px}
.revcol .cta{margin-top:52px}
.revcol .ctaline{margin-top:16px;font-size:.92rem;color:var(--di)}
.revcol .ctaline a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.hero-cd{margin-top:32px;max-width:430px}
.hero-cd .lbl{display:block;margin-bottom:12px}
.standout{padding:92px 0}
.standout .reveal-text{font-size:clamp(1.35rem,2.4cqw,2.1rem);line-height:1.52;text-align:center;max-width:960px;margin:0 auto}
.ds{color:var(--di);font-style:italic;font-weight:400}
.note-line{margin-top:28px;padding:18px 22px;border-left:2px solid var(--ln);font-size:.98rem;color:var(--mu);font-style:italic}
.steps.nodigits .step .n{display:none}
.steps.nodigits .step h3{margin-top:0}

/* ================= LOT: HIGHLIGHTS + POSTER ================= */
.gal .main.poster{aspect-ratio:1198/1313;background:#00263A}
.gal .main.poster .im{background-size:cover;background-position:center}
.hlband{padding:116px 0 120px}
.hlband .hl-lead{max-width:860px;margin:0 auto;text-align:center}
.hlband .hl-lead .big{margin:0 0 34px}
.hlband .reveal-p{margin-top:0}
.reveal-p{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:clamp(1.02rem,1.3cqw,1.18rem);line-height:1.8;color:var(--silver)}
.reveal-p .w{opacity:.2;transition:opacity .25s linear}
.reveal-p .jump{font-family:Georgia,'Times New Roman',serif;font-style:italic;color:#fff}
.hlband .hl-lead .lbl{display:block}
.compact .hlband{padding:104px 0 108px}
.hl-lead{max-width:920px;margin-bottom:44px}
.hl-lead .big{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(1.12rem,1.8cqw,1.55rem);line-height:1.46;color:var(--fg);margin:14px 0 20px}
.hl-two{display:grid;grid-template-columns:1fr 1fr;gap:54px;border-top:1px solid var(--ln);padding-top:38px}
.hl-two .lbl{font-size:.84rem;letter-spacing:.22em;color:var(--mu)}
.hl-two h4{margin-top:8px}
.hl-two.bare{border-top:0;padding-top:0}
.hl-lead{margin-bottom:0}
.hl-two h4{font-family:Georgia,'Times New Roman',serif;font-size:1.18rem;color:var(--fg);margin-bottom:6px}
.hl-two .lbl{display:block;margin-bottom:10px}
.hl-two.bare .lbl{margin-bottom:22px}
.hl-two.bare h4{margin-top:0}
.hl-two p{font-size:.95rem;line-height:1.78}
@container page (max-width: 900px){.hl-two{grid-template-columns:minmax(0,1fr);gap:34px}}
.dlbtn{display:inline-flex;align-items:center;gap:11px;border:1px solid var(--ln);padding:13px 20px;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fg);transition:.35s}
.dlbtn:hover{border-color:var(--fg);background:var(--bg2)}
.dlbtn .ic{font-size:.9rem;opacity:.7}
.aucbox .btn+.btn{margin-top:10px}
.aucbox .plat{margin-top:12px;font-size:.88rem;color:var(--di);font-style:italic;text-align:center}
.backwrap{text-align:center;padding:70px 0 110px}
.pednote{margin-top:26px;font-size:.92rem;color:var(--di);font-style:italic}

/* ================= SECTION VARIETY ================= */
/* the one bold moment: the closing line over candlelight */
.cinema{position:relative;min-height:640px;display:flex;align-items:center;overflow:hidden}
.cinema>.pxi{background-position:88% 46%}
.cinema::before{content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(90deg,var(--blue) 0%,var(--blue) 40%,rgba(0,38,58,.88) 56%,rgba(0,38,58,.3) 80%,rgba(0,38,58,0) 100%),
             linear-gradient(0deg,var(--blue) 0%,rgba(0,38,58,0) 24%),
             linear-gradient(180deg,var(--blue) 0%,rgba(0,38,58,0) 20%)}
.cinema .wrap{position:relative;z-index:5}
.cinema .reveal-text{text-align:left;max-width:600px;margin:0;font-size:clamp(1.3rem,2.2cqw,1.95rem);line-height:1.34;letter-spacing:.015em;text-shadow:0 2px 24px rgba(0,20,32,.6)}
.cinema.slim{min-height:440px}
.cinema.mid::before{background:linear-gradient(0deg,rgba(0,38,58,.95) 0%,rgba(0,38,58,.74) 45%,rgba(0,38,58,.9) 100%)}
.cinema.mid>.pxi{background-position:center 58%}
.cinema.mid .reveal-text{text-align:center;max-width:860px;margin:0 auto;text-wrap:balance}
.cinema.mid .after{justify-content:center}
.cinema .after{margin-top:38px;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.cinema .after .mini{font-size:.9rem;color:rgba(242,242,241,.6);font-style:italic}

/* how it works: a sequence, so draw it as one */
.journey{position:relative;margin-top:78px}
.journey.mid .jstep{text-align:center;display:flex;flex-direction:column;align-items:center}
.journey.mid .jstep p{max-width:30ch}
.how-mid{text-align:center;background:#fff;box-shadow:0 18px 50px -22px rgba(0,38,58,.3);padding:70px 60px 64px;margin-top:54px}
.how-mid .note-line{display:inline-block;text-align:center;border-left:0;border-top:1px solid var(--ln);padding:36px 24px 0;margin-top:66px;max-width:820px;font-size:1.04rem}
.how-mid .btnrow{display:flex;justify-content:center;margin-top:54px}
.how-mid .foot-note{max-width:620px;margin-left:auto;margin-right:auto}
.journey .track{position:absolute;left:16.6%;right:16.6%;top:28px;height:2px;background:linear-gradient(90deg,transparent,var(--w-primary) 12%,var(--w-primary) 88%,transparent);opacity:.3}
.jsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;position:relative}
.jstep .dot{display:block;width:15px;height:15px;border:1px solid var(--fg);border-radius:50%;background:var(--bg);position:relative;z-index:2}
.jstep .dot.crown{width:96px;height:52px;border:0;border-radius:0;background:#fff;position:relative;z-index:2;display:flex;align-items:center;justify-content:center}
.jstep .dot.crown::after{content:"";position:absolute;left:50%;top:50%;width:66px;height:33px;transform:translate(-50%,-50%);background-image:var(--i-crownnavy);background-size:contain;background-position:center;background-repeat:no-repeat}
.dark .jstep .dot.crown::after{background-image:var(--i-crown)}
.jstep p a{color:var(--fg);font-weight:700;text-decoration:none;transition:color .2s ease}
.jstep p a:hover{color:var(--w-accent-strong)}
.jstep h3{font-size:1.34rem;margin:22px 0 12px}
.jstep p{font-size:1rem;max-width:34ch}
@container page (max-width: 900px){.jsteps{grid-template-columns:minmax(0,1fr);gap:40px}.journey .track{display:none}.how-mid{padding:46px 28px 44px}}

/* farm photographs: three different shapes, stepped */
.pstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:0 30px;margin-top:66px;align-items:start}
.pstrip .s1,.pstrip .s2,.pstrip .s3{margin-top:0}
.pstrip .ph{aspect-ratio:4/3}
@container page (max-width: 900px){.pstrip{grid-template-columns:minmax(0,1fr);gap:34px}.pstrip .s2,.pstrip .s3{margin-top:0}}

/* facts hung on a single rule, no cells */
.facts{grid-template-columns:repeat(4,1fr);border-top:1px solid var(--fg)}
.fact,.fact+.fact{padding:26px 26px 0 0;border-left:none}
.fact .v{font-size:1.55rem;line-height:1.3}

/* the gate photograph runs off the edge */
.a-why .bleed{margin-right:-60px}
.a-why .bleed:first-child{margin-right:0;margin-left:-60px}
@container page (max-width: 900px){.a-why .bleed,.a-why .bleed:first-child{margin-right:0;margin-left:0}}

/* ================= PHONE (container-driven, same rules on a real phone) ================= */
/* ================= ABOUT ASHFORD ================= */
.phead .lede{max-width:640px;font-size:.97rem}
.stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:64px 44px}
.stages>div{min-width:0}
.stages .ph{aspect-ratio:4/3}
.stages h3{font-size:1.22rem;margin:30px 0 12px}
.stages p{font-size:.92rem}

/* ================= FAQ ================= */
.faq{display:grid;grid-template-columns:200px minmax(0,1fr);gap:80px;align-items:start}
.faqnav{position:sticky;top:34px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.faqnav .fnav{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--fg);padding:0 0 7px 14px;border-left:2px solid transparent;border-bottom:0;transition:.35s var(--ease)}
.faqnav .fnav:hover{color:var(--w-accent-strong);border-left-color:var(--ln2)}
.faqnav .fnav.on{color:var(--w-primary);border-left-color:var(--w-primary)}
.faq-main{min-width:0}
.faq-g+.faq-g{margin-top:66px}
.faq-g h2{font-size:clamp(1.5rem,2.3cqw,1.95rem)}
.faq-g .qas{margin-top:20px;border-top:1px solid var(--ln)}
.qa{border-bottom:1px solid var(--ln)}
.qa .q{display:flex;width:100%;align-items:flex-start;justify-content:space-between;gap:30px;text-align:left;background:none;border:0;cursor:pointer;padding:24px 0;font-family:Georgia,'Times New Roman',serif;font-size:1.05rem;font-weight:400;line-height:1.38;color:var(--fg);letter-spacing:.015em;transition:color .3s var(--ease)}
.qa .q:hover{color:var(--em)}
.qa .qt{min-width:0}
.qa .sgn{position:relative;flex:none;width:13px;height:13px;margin-top:6px}
.qa .sgn::before,.qa .sgn::after{content:"";position:absolute;background:currentColor;opacity:.7;transition:transform .4s var(--ease)}
.qa .sgn::before{left:0;right:0;top:6px;height:1px}
.qa .sgn::after{top:0;bottom:0;left:6px;width:1px}
.qa.open .sgn::after{transform:scaleY(0)}
.qa .a{padding:0 70px 28px 0}
.qa .a p{font-size:.95rem}
.qa .a .anno{margin-top:14px}
.qa .a .alist{margin:14px 0 0;padding:0;list-style:none}
.qa .a .alist li{position:relative;padding-left:22px;margin-top:8px;font-size:.95rem;color:var(--mu);line-height:1.7}
.qa .a .alist li::before{content:"";position:absolute;left:4px;top:.9em;width:7px;height:1px;background:var(--w-primary);opacity:.6}
.qa .a .ilink{color:var(--w-primary);text-decoration:underline;text-underline-offset:3px}
.qa .a .ilink:hover{color:var(--fg)}

@container page (max-width: 560px){
  .wrap{padding:0 26px}
  .stages{grid-template-columns:minmax(0,1fr);gap:40px}
  .phead .lede{font-size:.92rem}
  .faq-g+.faq-g{margin-top:46px}
  .qa .q{font-size:1rem;gap:18px;padding:20px 0}

  /* header: menu button in, nav and desktop actions out */
  .topbar .wrap{height:38px;font-size:12px}
  .topbar .pill{height:22px;padding:0 10px;font-size:11px}
  .topbar .links{gap:14px}
  .topbar .links a span{display:none}
  .topbar .links a:first-child{display:none}   /* T&C has no icon — it lives in the menu and footer */
  .mainbar .wrap{height:60px;gap:12px}
  .mainbar .logo{height:34px;width:104px}
  .mainbar .burger{display:inline-flex;order:-1}
  .actions{display:flex;gap:8px}
  .actions .lang,.actions .wbtn.ghost{display:none}
  .actions .wbtn.accent{height:32px;padding:0 13px;font-size:11px;gap:8px}

  /* countdown strip */
  .film .cue{display:none}
  .cdband-in{flex-direction:column;gap:8px;padding:16px 0}
  .cdband-in .cd{width:100%;max-width:300px}
  .cdband-in .cd .u{flex:1;min-width:0}
  .cdband-in .cd .u .n{font-size:1.25rem}

  /* hero */
  .sec{padding:64px 0}
  .revcol{padding:52px 0 48px}
  .revgrid.one{max-width:none}
  .cta{flex-direction:column;align-items:center;width:100%}
  .cta .btn{justify-content:center;width:auto;min-width:230px}
  .btn{white-space:normal;text-align:center;line-height:1.5}
  .a-why>*,.cat>*,.lot-g>*,.revgrid>*,.jsteps>*,.hl-two>*,.tpg>*,.pstrip>*{min-width:0}

  /* shared blocks */
  .a-why{gap:30px}
  .a-why>div,.cat>div{text-align:center}
  .a-why p,.cat p{margin-left:auto;margin-right:auto}
  .a-why .lbl,.cat .lbl{display:block}
  .photo-cap{justify-content:center;gap:18px}
  .sh.l{text-align:center;margin:0 auto}
  .card .meta{text-align:center}
  .card .hl{margin-left:auto;margin-right:auto;width:62%}
  .consent,.cat .field{text-align:center}
  .a-why .bleed,.a-why .bleed:first-child{margin-right:0;margin-left:0}
  .photo-cap{gap:10px}
  .cards{grid-template-columns:minmax(0,1fr);gap:34px}
  .compact .card .ph{aspect-ratio:4/5}
  .cat{grid-template-columns:minmax(0,1fr);gap:30px}
  .field{max-width:none;flex-wrap:wrap}
  .field input{min-width:0;width:100%}
  .field .btn{width:100%;justify-content:center}

  /* page heads */
  .phead{padding:44px 0 40px}
  .phead.band{padding:56px 0 56px}
  .cbar{flex-direction:column;align-items:flex-start;gap:18px}
  .cbar .btn{width:auto;min-width:230px;justify-content:center}

  /* standout band */
  .cinema{min-height:0}
  .cinema.mid{padding:70px 0}
  .cinema .reveal-text{text-align:center}
  .cinema .after{justify-content:center}
  .cinema .after .btn{width:auto;min-width:230px;justify-content:center}

  /* lot page */
  .lot-g{grid-template-columns:minmax(0,1fr);gap:32px}
  .info{position:static}
  .thumbs{grid-template-columns:repeat(4,1fr);gap:8px}
  .tabbar{gap:16px;overflow-x:auto;scrollbar-width:none}
  .tabbar::-webkit-scrollbar{display:none}
  .tabbar button{white-space:nowrap;font-size:.92rem}
  .hlband{padding:54px 0 56px}
  .aucbox{padding:22px 20px}
  .aucbox .r1{flex-direction:column;gap:12px}
  .aucbox .r1 .lbl{white-space:nowrap}
  .aucbox .r1 .v{font-size:1.6rem;white-space:nowrap;margin-top:4px}
  .aucbox .btn{font-size:.58rem}
  .share{gap:20px;flex-wrap:wrap}

  /* footer */
  .foot .wrap{padding-top:40px;padding-bottom:40px}
  .foot-g{gap:28px}
  .foot-b{margin-top:34px;flex-direction:column;justify-content:center;gap:10px}
}

/* ================= CONTACT ================= */
.ccards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px}
.ccard{min-width:0;border-top:1px solid var(--ln2);padding-top:26px;text-align:center}
.ccard h3{font-size:1.3rem;margin:0 0 6px}
.ccard .crole{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--di);margin:0}
.clinks{margin-top:20px;display:flex;flex-direction:column;gap:11px;align-items:center}
.clinks a{display:inline-flex;align-items:center;gap:11px;font-size:.92rem;color:var(--mu);transition:color .3s var(--ease)}
.clinks a .ic{flex:none;color:var(--w-primary);opacity:.8}
.clinks a:hover{color:var(--fg)}
.clinks a.cmail{color:var(--fg);font-weight:600}
.clinks a.cmail span{border-bottom:1px solid var(--ln2);padding-bottom:2px}
.clinks a.cmail:hover span{border-bottom-color:var(--fg)}
.clinks a.cphone{font-size:.88rem;opacity:.78}
.note-line.ctr{display:block;max-width:620px;margin-left:auto;margin-right:auto;text-align:center;
  border-left:0;border-top:1px solid var(--ln);padding:30px 24px 0}

.caddr{display:flex;flex-direction:column;gap:5px;margin-top:22px;font-size:1.06rem;color:var(--mu);line-height:1.6}
.caddr span:first-child{font-family:Georgia,'Times New Roman',serif;color:var(--fg);font-size:1.2rem}
.cgen{margin-top:20px}
.cgen a{display:inline-flex;align-items:center;gap:11px;font-size:1rem;color:var(--mu)}
.cgen a .ic{color:var(--w-primary);opacity:.8}
.cgen a:hover{color:var(--fg)}

/* stand-in for the static map image */
.cmap{position:relative;aspect-ratio:1030/686;background:
  repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 58px),
  repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 58px),
  linear-gradient(150deg,#0d2d3e 0%,var(--w-primary) 70%);
  box-shadow:0 18px 44px -14px rgba(0,38,58,.42);overflow:hidden}
.cmap::before{content:"";position:absolute;left:-10%;right:-10%;top:52%;height:3px;background:rgba(255,255,255,.14);transform:rotate(-7deg)}
.cmap::after{content:"";position:absolute;left:34%;top:-10%;bottom:-10%;width:2px;background:rgba(255,255,255,.1);transform:rotate(9deg)}
.cmap .pin{position:absolute;left:50%;top:48%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;
  background:#fff;box-shadow:0 0 0 7px rgba(255,255,255,.18),0 0 0 15px rgba(255,255,255,.08)}
.cmap-t{position:absolute;left:28px;bottom:26px;display:flex;flex-direction:column;gap:5px;color:rgba(242,242,241,.9)}
.cmap-t span:last-child{font-size:.9rem;color:rgba(242,242,241,.65)}


/* ---- Hippomundo pedigree iframe ---- */
.pedframe{position:relative;width:100%;height:640px;background:#fff;border:1px solid var(--ln);overflow:hidden}
.dark .pedframe{background:#fff;border-color:rgba(255,255,255,.14)}
.pedframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.pedfall{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:30px;background:var(--bg2,#f1f1f0)}
.pedfall .lbl{color:#5d6b73}
.pedfall p{max-width:380px;font-size:.9rem;color:#5d6b73}
.pedfall a{color:#00263A;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.pedframe.m{height:460px}


/* ---- About / FAQ responsive (after the base rules so they win) ---- */
@container page (max-width: 1050px){
  .faq{grid-template-columns:minmax(0,1fr);gap:32px}
  .faqnav{position:static;flex-direction:row;flex-wrap:wrap;gap:10px 24px}
  .qa .a{padding-right:0}
}
@container page (max-width: 900px){
  .stages{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 34px}
}
@container page (max-width: 560px){
  .stages{grid-template-columns:minmax(0,1fr);gap:40px}
  .phead .lede{font-size:.92rem}
  .faq-g+.faq-g{margin-top:46px}
  .qa .q{font-size:1rem;gap:18px;padding:20px 0}
}
@container page (max-width: 900px){.pedframe{height:560px}}
@container page (max-width: 560px){.pedframe{height:440px}.pedframe.m{height:400px}}
@container page (max-width: 560px){.how-mid{padding:34px 18px 32px;margin-top:34px}.jstep .dot.crown{width:96px;height:48px}}
#s-d-about .phead.band>.pxi{background-position:center 44%}
@container page (max-width: 900px){.ccards{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}}
@container page (max-width: 760px){.vids{grid-template-columns:minmax(0,1fr);gap:28px}}
@container page (max-width: 560px){.ccards{grid-template-columns:minmax(0,1fr);gap:32px}
  .caddr{font-size:1rem}.cmap-t{left:18px;bottom:18px}}
.thumbs.two,.thumbs.one{grid-template-columns:repeat(2,minmax(0,1fr));max-width:62%}
/* the artwork is a button into the gallery */
.gal .main[data-tab]{cursor:zoom-in}
.gal .main[data-tab]:focus-visible{outline:2px solid var(--w-accent);outline-offset:3px}
@container page (max-width: 560px){.thumbs.two,.thumbs.one{max-width:none}}
/* vet report: present but not yet active */
.vetbtn{display:inline-flex;align-items:center;gap:9px;font-family:'Open Sans',Helvetica,Arial,sans-serif;
  font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--di);opacity:.55;cursor:not-allowed;
  padding-bottom:6px;border-bottom:1px solid var(--ln)}
.vetbtn .ic{flex:none}

/* the lightbox is fixed to the viewport, so it is sized by the real screen, not the page frame */
@media (max-width: 760px){
  .lbox{padding:18px 14px 18px}
  .lbx-btn{width:44px;height:44px;font-size:22px}
  .lbx-prev{left:8px}
  .lbx-next{right:8px}
  .lbx-cap{font-size:1rem;margin-top:14px}
  .lbx-close{top:10px;right:10px;width:40px;height:40px}
}

/* ================= LEGAL PAGES ================= */
.lver{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.72);margin-top:22px}
.legal .lsec+.lsec{margin-top:54px}
.legal h2{display:flex;gap:16px;align-items:baseline;font-size:clamp(1.3rem,2cqw,1.65rem);
  padding-bottom:14px;border-bottom:1px solid var(--ln);margin-bottom:22px}
.legal .lno{font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.78rem;font-weight:700;
  letter-spacing:.1em;color:var(--w-accent-strong);flex:none;min-width:22px}
.legal p{font-size:.97rem;line-height:1.8;margin:0 0 16px;max-width:74ch}
.legal ul{margin:0 0 18px;padding:0;list-style:none;max-width:74ch}
.legal li{position:relative;padding-left:22px;font-size:.97rem;line-height:1.8;margin-bottom:12px}
.legal li::before{content:"";position:absolute;left:0;top:.85em;width:9px;height:1px;
  background:var(--w-accent-strong)}
.legal a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.legal a:hover{color:var(--w-accent-strong)}
.ltable-wrap{overflow-x:auto;margin:0 0 20px}
.ltable{border-collapse:collapse;width:100%;min-width:560px;font-size:.92rem}
.ltable th{text-align:left;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.68rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--di);font-weight:600;
  padding:0 18px 12px 0;border-bottom:1px solid var(--ln)}
.ltable td{padding:16px 18px 16px 0;border-bottom:1px solid var(--ln2);vertical-align:top;
  line-height:1.65}
.ltable tr td:first-child{font-weight:600;color:var(--fg);white-space:nowrap;padding-right:28px}
.legal .caddr{margin-top:4px}
.lmail{margin-top:22px;display:flex;flex-direction:column;gap:12px}
.lmail .r{display:flex;flex-direction:column;gap:3px}
.lmail a{font-weight:600}
.lfoot{margin-top:28px;padding-top:20px;border-top:1px solid var(--ln2);font-size:.92rem;
  color:var(--mu)}
.pdfdl{display:inline-flex;align-items:center;gap:10px;margin-top:26px;
  font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:.72rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--fg);padding-bottom:6px;border-bottom:1px solid var(--ln)}
.pdfdl:hover{border-bottom-color:var(--fg)}
@container page (max-width: 860px){.ltable{min-width:480px}}

/* ================= COOKIE BANNER ================= */
/* a small card, bottom left; styled without the page palette variables because it
   is moved out to <body> and so sits outside every .light / .dark section */
.ckbar{position:fixed;left:22px;bottom:22px;z-index:900;width:344px;max-width:calc(100vw - 28px);
  background:#fff;border-top:3px solid #00263A;padding:22px 22px 20px;
  box-shadow:0 22px 60px -20px rgba(0,38,58,.5);font-family:'Open Sans',Helvetica,Arial,sans-serif;
  max-height:calc(100vh - 44px);overflow-y:auto;opacity:0;transform:translateY(12px);
  transition:opacity .3s ease,transform .3s ease}
.ckbar[hidden]{display:none}
.ckbar.in{opacity:1;transform:none}
.ck-t{margin:0;font-size:.86rem;line-height:1.58;color:#1b2a33}
.ck-l{margin:10px 0 0;font-size:.74rem;display:flex;align-items:center;gap:8px}
.ck-l a{color:#00263A;text-decoration:underline;text-underline-offset:3px}
.ck-l i{font-style:normal;color:#9aa6ad}
.ck-prefs{margin-top:16px;padding-top:14px;border-top:1px solid rgba(0,38,58,.14);
  display:flex;flex-direction:column;gap:11px}
.ck-prefs[hidden]{display:none}
.ck-row{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:.78rem;
  line-height:1.45;color:#56636b}
.ck-row input{flex:none;width:15px;height:15px;margin-top:1px;accent-color:#00263A}
.ck-row input:disabled{opacity:.5;cursor:not-allowed}
.ck-row b{display:block;font-weight:600;font-size:.82rem;color:#00263A;margin-bottom:1px}
.ck-b{margin-top:16px;display:flex;gap:9px}
.ck-btn{flex:1;border:1px solid transparent;cursor:pointer;font:inherit;font-size:.63rem;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:12px 10px;
  white-space:nowrap;transition:.25s ease}
.ck-btn[hidden]{display:none}
.ck-solid{background:#00263A;color:#fff}
.ck-solid:hover{background:#0e4e73}
.ck-ghost{background:none;border-color:rgba(0,38,58,.3);color:#00263A}
.ck-ghost:hover{border-color:#00263A}
.ck-more{margin-top:12px;border:0;background:none;padding:0;cursor:pointer;font:inherit;
  font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#56636b;
  border-bottom:1px solid rgba(0,38,58,.22)}
.ck-more:hover{color:#00263A;border-bottom-color:#00263A}
@media (max-width: 560px){
  .ckbar{left:14px;right:14px;bottom:14px;width:auto;padding:18px 18px 16px}
}

/* ================= PHONE: everything centred =================
   At phone width the single column reads better centred, so the whole page
   inherits it and only the pedigree tree, which hangs off a left rule, keeps
   its own alignment. Placed last so it wins over the section rules above. */
@container page (max-width: 560px){
  /* .site is the container itself, so a container query cannot style it -
     set it on its children and let the page inherit */
  .site>*{text-align:center}

  /* blocks that set their own alignment higher up */
  .sh.l,.cinema .reveal-text,.qa .q,.fcol a,.fcol span,.fcol button,
  .ltable th,.ltable td,.note-line,.lfoot,.legal li,.legal p{text-align:center}

  /* flex rows: centre the row as well as the words inside it */
  .qa .q{justify-content:center;gap:16px}
  .cbar{align-items:center}
  .cbar .f2{justify-content:center;flex-wrap:wrap}
  .tick{justify-content:center}
  .fsoc,.share,.galhead,.photo-cap,.cgen a,.clinks a,.pdfdl{justify-content:center}
  .fcol ul,.caddr,.aucbox .r1,.clinks{align-items:center}
  .tabbar{justify-content:center}

  /* things that were pinned to the left edge of their box */
  .foot .logo{background-position:center;margin-left:auto;margin-right:auto}
  .cmap-t{left:0;right:0;align-items:center;text-align:center}

  /* centred text needs the box centred too, or it stays off to one side */
  .tick,.consent,.nl-lede,.heroP,.phead p,.phead .lede,.pedfall p,
  .lede,.note-line.ctr,.gcap,.vid figcaption{margin-left:auto;margin-right:auto}

  /* bullets belong with the text when the text is centred, so the hanging
     dash comes back into the line instead of sitting out on the left */
  .legal ul,.legal ol{list-style-position:inside;padding-left:0}
  .legal li,.qa .a .alist li{padding-left:0}
  .legal li::before,.qa .a .alist li::before{position:static;display:inline-block;
    vertical-align:middle;margin-right:9px;top:auto;left:auto}
  .legal h2{display:block}
  .legal .lno{min-width:0;margin-right:10px}
  .legal p,.legal ul,.legal ol{max-width:none}

  /* the section index reads as a list, so it stays one per line against the
     left margin rather than wrapping into ragged centred rows */
  .faqnav{flex-direction:column;flex-wrap:nowrap;align-items:flex-start;gap:14px;text-align:left}
  .faqnav .fnav{text-align:left;padding-left:0}
  .faqnav .fnav:hover,.faqnav .fnav.on{border-left-color:transparent}
  .faqnav .fnav.on{border-bottom:2px solid var(--w-primary);padding-bottom:5px}

  /* label / value rows stack, so each pair reads down the centre */
  .bidwin{justify-content:center;gap:26px 54px}
  .bidwin>div{align-items:center}
  .kick{flex-direction:column;justify-content:center;gap:10px}
  .dl .r{flex-direction:column;align-items:center;gap:6px}
  .dl .r .v{text-align:center}
  .tick{align-items:center}

  /* On a phone the title always takes two lines - sire above, dam below - rather
     than relying on a wrap that lands within a pixel of the edge on some names. */
  .info h1.cross{white-space:normal;font-size:1.2rem;line-height:1.34}
  .info h1.cross .nm{display:block}
  .info h1.cross .ds{font-size:1rem;margin-top:8px}

  /* the pedigree hangs off a left rule - centring breaks it away from its tick */
  .ped .nd{text-align:left}
}

/* ================= PHONE: the menu drawer =================
   Colours are literal rather than themed: on the live site the drawer is moved
   out to <body> so that position:fixed means the viewport, which puts it
   outside every .light / .dark section. */
.mdrawer{position:fixed;inset:0;z-index:1200;display:flex}
/* inside the mockup and the phone-width file the drawer belongs to its frame,
   not the window - .frame-body and .pscr are both positioned */
.mdrawer.inset{position:absolute}
.mdrawer[hidden]{display:none}
.mdrawer-bd{position:absolute;inset:0;background:rgba(0,20,32,.62)}
.mdrawer-in{position:relative;z-index:1;width:min(88%,380px);background:#00263A;color:#fff;
  padding:22px 30px 38px;display:flex;flex-direction:column;overflow-y:auto;text-align:left;
  box-shadow:0 0 70px rgba(0,0,0,.45);animation:mdrawerIn .34s cubic-bezier(.2,.7,.2,1)}
@keyframes mdrawerIn{from{transform:translateX(-102%)}to{transform:none}}
.mdrawer-x{align-self:flex-end;background:none;border:0;color:rgba(255,255,255,.78);
  font:300 32px/1 Georgia,'Times New Roman',serif;padding:2px 4px;cursor:pointer}
.mdrawer-x:hover{color:#fff}
.mdrawer nav{display:flex;flex-direction:column;margin-top:10px}
.mdrawer nav a{font-family:Georgia,'Times New Roman',serif;font-size:1.3rem;color:#fff;
  padding:15px 0;border-bottom:1px solid rgba(255,255,255,.14);transition:color .3s var(--ease)}
.mdrawer nav a:hover,.mdrawer nav a.active{color:#bfbfbe}
.mdrawer-act{display:flex;flex-direction:column;gap:12px;margin-top:30px}
.mdrawer-act .wbtn{width:100%;height:46px}
.mdrawer-act .wbtn.ghost{color:#fff;border:1px solid rgba(255,255,255,.45)}
.mdrawer-act .wbtn.ghost:hover{border-color:#fff}
.mdrawer-act .wbtn.accent{background:#f2f2f1;color:#00263A;box-shadow:none}
.mdrawer-act .wbtn.accent:hover{background:#fff;opacity:1}
.mdrawer-mail{margin-top:28px;font-size:.9rem;color:rgba(255,255,255,.78);
  display:inline-flex;align-items:center;gap:9px}
.mdrawer-mail:hover{color:#fff}
html.mdrawer-open,html.mdrawer-open body{overflow:hidden}
@media (prefers-reduced-motion: reduce){.mdrawer-in{animation:none}}

/* jump targets sit clear of the sticky header */
.lot-tabs{scroll-margin-top:96px}
.galhead{scroll-margin-top:118px}

/* the dialling code sits inside the same bordered field as the number */
.field.tel .dial{flex:none;max-width:46%;background:transparent;border:0;
  border-right:1px solid var(--ln);font-family:Georgia,'Times New Roman',serif;
  font-size:1rem;color:var(--fg);padding:16px 14px 16px 20px;cursor:pointer;outline:none}
.field.tel .dial:focus-visible{outline:2px solid var(--w-accent);outline-offset:-2px}
@container page (max-width: 560px){
  .field.tel{flex-wrap:nowrap}
  .field.tel .dial{padding-left:12px;padding-right:6px;font-size:.95rem}
  .field.tel input{flex:1 1 auto;width:auto;min-width:0;padding-left:12px}
}

/* Contact map */
.cmap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;z-index:3}
.photo-cap .maplink{color:var(--fg);border-bottom:1px solid var(--ln);padding-bottom:2px}
.photo-cap .maplink:hover{border-bottom-color:var(--fg)}

/* the one red on the site: the foaling window in the opening paragraph.
   Light enough to clear AA against the navy band and the DNA photograph behind it;
   a darker red is used if it ever sits on a light section. */
.hl-red{color:#FF7F6E}
.light .hl-red{color:#C4432F}

/* ---------- things the hosted site needs that the mockup did not ---------- */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}
body{margin:0;background:var(--w-bg,#fff)}
.skip{position:absolute;left:-9999px;top:0;z-index:1000;background:#fff;color:var(--w-primary);
  padding:12px 20px;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:14px}
.skip:focus{left:12px;top:12px}