*{box-sizing:border-box}
:root{--bg:#151512;--panel:#20201b;--paper:#eee9df;--muted:#aaa497;--line:rgba(238,233,223,.18);--gold:#b7a47b}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{background:var(--bg);color:var(--paper);font-family:Arial,Helvetica,sans-serif}
button,a{font:inherit;color:inherit}button{border:0;background:none;cursor:pointer}a{text-decoration:none}
header{position:fixed;z-index:100;top:0;left:0;right:0;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:rgba(21,21,18,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.logo{letter-spacing:.2em;font-size:23px;font-weight:300;white-space:nowrap}.logo small{font-size:8px;letter-spacing:.3em;color:var(--muted);margin-left:12px;font-weight:400;white-space:nowrap}
nav{display:flex;gap:30px}nav a{color:#ddd7ca;font-size:11px;letter-spacing:.13em;text-transform:uppercase}nav a:hover{color:#fff}
nav a.is-active,nav a[aria-current="page"]{color:#eee9df;position:relative}
nav a.is-active::after,nav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-25px;height:1px;background:#c9a15c}
/* HOME — NAV geometry follows the actual DESCRIPTION text measure. */
header nav.home-geometry-nav{
  position:absolute;
  left:var(--home-nav-left,auto);
  width:var(--home-nav-width,auto);
  top:50%;
  transform:translateY(-50%);
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
}
header nav.home-geometry-nav a{
  min-width:0;
  justify-self:center;
  text-align:center;
  white-space:nowrap;
}

main{position:absolute;inset:72px 0 0}.view{position:absolute;inset:0;display:none;overflow:hidden}.view.active{display:block}
.home{height:100%;display:grid;grid-template-columns:38% 62%}.home-intro{padding:6vw;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#191914,#25271f)}
.eyebrow{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(43px,5.5vw,78px);line-height:.98;margin:0 0 25px}.home-intro p{max-width:430px;color:#c5bfb2;font-size:14px;line-height:1.8;margin:0}.home-note{margin-top:35px;padding-top:18px;border-top:1px solid var(--line);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#999287}.home-contact{margin-top:13px;display:flex;flex-direction:column;gap:5px;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#999287;line-height:1.35}.home-contact a{color:inherit;text-decoration:none}.home-contact a:hover{color:#eee9df}
.home-account{margin-top:28px;padding-top:18px;border-top:1px solid var(--line);max-width:430px}.home-account-label{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}.home-account-row{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:24px}.auth-status{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:#999287}.auth-actions{display:flex;align-items:center;justify-content:flex-end;flex-shrink:0}.auth-button{appearance:none;border:1px solid rgba(238,233,223,.35);background:transparent;color:#eee9df;padding:7px 11px;font:inherit;font-size:9px;letter-spacing:.16em;text-transform:uppercase;transition:border-color .2s ease,color .2s ease,background .2s ease}.auth-button:hover{border-color:#eee9df;color:#fff;background:rgba(238,233,223,.04)}.auth-button:focus-visible{outline:1px solid #eee9df;outline-offset:3px}.auth-button:disabled{opacity:.55;cursor:wait}.auth-button-quiet{border-color:rgba(238,233,223,.22);color:#b8b1a4}
.featured{position:relative;height:100%;overflow:hidden;background:#10100e}.slider{height:100%;display:flex;transition:transform .55s ease}/* HOME — target desktop composition: 38% INTRO / 45% ARTWORK / 17% INFO.
   The outer HOME grid keeps INTRO at 38%; the nested featured area is the
   remaining 62%, so the slide split below resolves to 45% / 17% of viewport. */
.slide{min-width:100%;width:100%;flex:0 0 100%;height:100%;display:grid;grid-template-columns:72.58% 27.42%}.art-visual,.modal-image{position:relative;min-height:100%;background:#222}
.art-visual img,.modal-image img{width:100%;height:100%;object-fit:contain;display:block;background:#10100e}.placeholder{height:100%;display:grid;place-items:center;color:#aaa497;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
/* WW-010 — HOME Artwork Info Vertical Boundary Synchronization.
   The right panel is a full-height background. Its inner editorial frame is
   dynamically anchored to the actual contained image bounds by app.js. */
.slide-info{position:relative;min-width:0;min-height:0;height:100%;background:#171714;overflow:hidden}
.slide-info-inner{position:absolute;left:34px;right:34px;top:var(--slide-info-image-top,0px);bottom:var(--slide-info-image-bottom,0px);min-height:0;display:grid;grid-template-rows:max-content minmax(0,1fr) max-content;row-gap:22px;overflow:hidden}
.slide-info-head{min-width:0;min-height:0}

/* HOME — fixed editorial landmarks for the artwork information column.
   The desktop column is synchronized to the left editorial panel: the
   metadata block terminates at the HOME main eyebrow baseline, while the
   View artwork control starts at the HOME separator above the address block.
   This removes the previous dependence on the bottom slider controls and
   therefore prevents the CTA from ever colliding with the arrows. */
@media (min-width:901px){
  #home .slide-info-inner{
    top:0;
    bottom:0;
    display:block;
    overflow:hidden;
  }
  /* The red reference line in the HOME layout is the editorial anchor: the
     WWADON number/title/artist block starts exactly on that horizontal line.
     The block no longer grows upward from the anchor. */
  #home .slide-info-head{
    position:absolute;
    left:0;
    right:0;
    top:var(--home-info-head-start,0px);
    height:var(--home-info-head-height,142px);
    min-height:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    padding:0;
    overflow:hidden;
  }
  #home .slide-info-description{
    position:absolute;
    left:0;
    right:0;
    top:var(--home-info-description-start,164px);
    bottom:var(--home-info-description-bottom,44px);
    min-height:0;
    height:auto;
    margin:0;
    overflow-y:auto;
    overflow-x:hidden;
  }
  #home .slide-info-bottom{
    position:absolute;
    left:0;
    right:0;
    top:var(--home-view-artwork-y,66%);
    height:44px;
    min-height:44px;
    display:flex;
    align-items:flex-start;
    justify-content:flex-end;
    margin:0;
    padding:0;
    z-index:6;
  }
  #home .slide-info-bottom .collect{
    margin:0;
    align-self:flex-start;
  }
  /* Only the currently displayed slide may expose its CTA. This also makes
     the slider robust if a browser paints an adjacent flex item during the
     transition. */
  #home .slide:not(.is-active) .slide-info-bottom .collect{
    visibility:hidden;
    pointer-events:none;
  }
}
.slide-info .number{font-size:10px;line-height:1.2;letter-spacing:.16em;color:var(--muted);margin:0 0 20px}
.slide-info h2{font-family:Georgia,serif;font-size:34px;font-weight:400;line-height:1.1;margin:0 0 14px}
.slide-info .artist{font-size:11px;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;color:#b7b0a4}
.slide-info-description{min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:transparent transparent;font-size:11px;line-height:1.65;color:#bcb5a9}
.slide-info-description:hover,.slide-info-description:focus-within{scrollbar-color:#8f897d transparent}
.slide-info-description:focus{outline:none}
.slide-info-description p{margin:0;max-width:100%}
.slide-info-description::-webkit-scrollbar{width:6px}
.slide-info-description::-webkit-scrollbar-track{background:transparent}
.slide-info-description::-webkit-scrollbar-thumb{background:transparent;border-radius:6px}
.slide-info-description:hover::-webkit-scrollbar-thumb,.slide-info-description:focus-within::-webkit-scrollbar-thumb{background:#8f897d}
.slide-info-bottom{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:flex-end;
  gap:6px;
}
.slide-info-bottom .price{
  flex:0 0 auto;
  font-size:15px;
  line-height:1.2;
  letter-spacing:.08em;
  margin:0;
  text-align:right;
}
.slide-info-bottom .collect{
  flex:0 0 auto;
  align-self:flex-end;
  margin-bottom:42px;
  position:relative;
  z-index:6;
  border:1px solid rgba(238,233,223,.55);
  padding:13px 18px;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

@media (max-width: 767px){
  .slide-info-bottom .collect{
    margin-bottom:56px;
  }
}
.slide-info-bottom .collect:hover{background:var(--paper);color:var(--bg)}
.slider-controls{position:absolute;right:34px;bottom:28px;z-index:5;display:flex;align-items:center;gap:12px}.slider-controls button{width:38px;height:38px;border:1px solid var(--line);color:#ddd7ca}.slider-controls button:hover{background:#eee9df;color:#151512}.counter{font-size:10px;letter-spacing:.14em;color:#aaa497;min-width:48px;text-align:center}
/* ============================================================
   WWADON v8.4 — EARTH AND NATURE / fixed artwork cards
   The card frame and artwork window have identical dimensions for
   every work. Source-image orientation never changes the layout.
   ============================================================ */
.gallery{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);padding:34px 28px 24px;background:var(--bg)}
.gallery-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}
.gallery-head h2{font-family:Georgia,serif;font-size:38px;font-weight:400;line-height:1;margin:0 0 7px;color:#eee9df}
.gallery-head p{font-size:11px;color:#c5bfb2;margin:0;line-height:1.35}
.gallery-controls{display:flex;align-items:center;gap:9px;margin-bottom:0}
.gallery-controls button{width:34px;height:28px;border:1px solid var(--line);background:transparent;color:#ddd7ca;font-size:13px;cursor:pointer}
.gallery-controls button:hover:not(:disabled){border-color:rgba(238,233,223,.45);background:rgba(238,233,223,.04)}
.gallery-controls button:disabled{opacity:.3;cursor:default}
.gallery-controls .counter{min-width:42px;text-align:center;font-size:9px;letter-spacing:.08em;color:#aaa497}

/* Four columns × two rows on desktop. */
.gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;min-height:0}
.gallery-card{min-width:0;min-height:0;background:#10100e;border:1px solid var(--line);display:grid;grid-template-rows:auto minmax(0,1fr) auto;cursor:pointer;overflow:hidden;transition:border-color .18s ease}
.gallery-card:hover{border-color:rgba(238,233,223,.45)}

/* Title is part of the fixed frame — never affected by image dimensions. */
.gallery-card-title{min-height:36px;padding:12px 13px 8px;font-size:10px;line-height:1.15;letter-spacing:.02em;color:#eee9df;text-transform:none;font-family:Arial,Helvetica,sans-serif;font-weight:400}

/* Fixed preview window. The source image is contained, never cropped. */
.gallery-img-stage{width:calc(100% - 24px);aspect-ratio:16/9;margin:0 12px;display:flex;align-items:center;justify-content:center;background:#10100e;overflow:hidden;flex:none}
.gallery-img-stage img{width:100%;height:100%;object-fit:contain;display:block;border:1px solid var(--line);background:#10100e}

/* Bottom metadata band is fixed and uses the HOME muted tone. */
.gallery-caption{min-height:48px;background:#1d1f19;padding:9px 12px 10px;display:flex;justify-content:space-between;align-items:flex-end;color:#eee9df}
.earth-caption-left{min-width:0;display:flex;flex-direction:column;gap:3px}
.earth-caption span,.earth-caption-left span{font-size:8px;line-height:1.1;letter-spacing:.06em;text-transform:uppercase;color:#8f897d;font-family:Arial,Helvetica,sans-serif;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.earth-caption-left span:nth-child(2){color:#8f897d}
.earth-edition{align-self:flex-end;color:#8f897d!important;font-size:8px!important;line-height:1.1!important}

/* Other gallery views retain their existing image treatment. */
.gallery-img{height:calc(100% - 68px);min-height:0;background:#25251f}
.gallery-img{display:flex;align-items:center;justify-content:center;background:#10100e}
.gallery-img img{width:100%;height:100%;object-fit:contain;display:block}
.gallery-caption strong{font-size:11px;letter-spacing:.07em;font-weight:400}
.gallery-caption span{display:block;font-size:10px;color:#8f897d;margin-top:6px;line-height:1.5}
.book{height:100%;display:grid;grid-template-columns:42% 58%;background:#eee9df;color:#171714}.book-intro{padding:7vw;display:flex;flex-direction:column;justify-content:center}.book-intro .eyebrow{color:#777168}.book-intro h2{font-family:Georgia,serif;font-size:clamp(48px,6vw,84px);font-weight:400;line-height:.95;margin:0 0 24px}.book-intro p{font-size:14px;line-height:1.8;color:#625d55;max-width:430px}.book-page{padding:50px;display:flex;align-items:center;justify-content:center;background:#ded8cc}.page{width:min(620px,80%);height:75%;background:#f4f0e8;box-shadow:0 20px 55px rgba(0,0,0,.12);padding:45px}.page h3{font-family:Georgia,serif;font-size:30px;font-weight:400;margin:0 0 20px}.page p{font-family:Georgia,serif;color:#5d574e;line-height:1.7;font-size:14px}
.contact{height:100%;display:flex;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 45%,#303228,#141411 55%)}.contact-box{max-width:650px;padding:30px}.contact h2{font-family:Georgia,serif;font-size:64px;font-weight:400;margin:0 0 22px}.contact p{color:#aaa497;line-height:1.8;font-size:14px}.contact-details{margin-top:35px;padding-top:25px;border-top:1px solid var(--line);color:#d1c9bc;font-size:12px;line-height:2}

/* ============================================================
   WW-011 — AUCTIONS / BUYER CATALOGUE
   Editorial gallery treatment. Uses published artwork records only.
   No live-bidding state is fabricated here; auction execution can be
   attached later to a dedicated auction schema.
   ============================================================ */
.auctions-page{
  width:100%;height:100%;display:grid;grid-template-columns:38% 62%;
  background:#151512;color:#eee9df;overflow:hidden;
}
.auctions-hero{
  min-width:0;height:100%;padding:clamp(64px,7vw,110px) clamp(42px,6vw,96px);
  display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(145deg,#1b1d18 0%,#25271f 100%);
  border-right:1px solid rgba(238,233,223,.13);
}
.auctions-hero h1{
  margin:0 0 26px;font-family:Georgia,'Times New Roman',serif;
  font-weight:400;font-size:clamp(52px,5.6vw,82px);line-height:.93;
  letter-spacing:-.04em;color:#eee9df;
}
.auctions-hero>p{
  max-width:430px;margin:0;color:#c5bfb2;font-size:13px;line-height:1.8;
}
.auctions-hero-meta{
  display:flex;flex-direction:column;gap:7px;margin-top:38px;padding-top:17px;
  border-top:1px solid rgba(238,233,223,.16);
  color:#8f897d;font-size:8px;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;
}
.auctions-hero-meta span:first-child{color:#b7a47b}
.auction-account{margin-top:30px;padding-top:18px;border-top:1px solid rgba(238,233,223,.16);max-width:430px}.auction-account .home-account-label{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}.auction-account .home-account-row{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:24px}
@media(max-width:900px){.auction-account{max-width:none}}
.auctions-catalogue{
  min-width:0;height:100%;display:flex;flex-direction:column;
  background:#10110f;overflow:hidden;padding:clamp(30px,3.2vw,54px) clamp(28px,4vw,64px) 30px;
}
.auctions-toolbar{
  flex:none;display:flex;align-items:flex-end;justify-content:space-between;gap:28px;
  padding-bottom:17px;border-bottom:1px solid rgba(238,233,223,.16);
}
.auctions-toolbar-title{display:flex;flex-direction:column;gap:7px;min-width:130px}
.auctions-toolbar-title .eyebrow{margin:0;font-size:8px;letter-spacing:.18em}
.auctions-toolbar-title strong{
  font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:400;line-height:1;
}
.auction-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
.auction-search input,.auction-select select{
  height:34px;border:1px solid rgba(238,233,223,.18);background:#171815;color:#eee9df;
  border-radius:0;padding:0 11px;font-size:10px;letter-spacing:.04em;outline:none;
}
.auction-search input{width:190px}
.auction-select select{min-width:112px}
.auction-search input::placeholder{color:#77746d}
.auction-search input:focus,.auction-select select:focus{border-color:#8d856f}
/* ETAP 14.4.3 — auction catalogue scroll containment fix.
   Keep the fullscreen SPA shell intact; constrain only the auction
   grid track and its scroll container so cards cannot be clipped. */
.auctions-page{
  box-sizing:border-box;
  grid-template-rows:minmax(0,1fr);
}
.auctions-catalogue{
  box-sizing:border-box;
  min-height:0;
}
.auction-grid{
  box-sizing:border-box;
  height:100%;
}

.auction-grid{
  min-height:0;flex:1;overflow:auto;padding:22px 2px 36px;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;
  gap:18px 14px;scrollbar-width:thin;scrollbar-color:#756c59 transparent;
}
.auction-grid::-webkit-scrollbar{width:5px}.auction-grid::-webkit-scrollbar-track{background:transparent}
.auction-grid::-webkit-scrollbar-thumb{background:#756c59;border-radius:8px}
.auction-card{
  min-width:0;border:1px solid rgba(238,233,223,.13);background:#151613;
  display:flex;flex-direction:column;transition:border-color .2s,transform .2s;
}
.auction-card:hover{border-color:rgba(238,233,223,.34);transform:translateY(-2px)}
.auction-card-media{
  position:relative;aspect-ratio:4/3;background:#0b0c0a;overflow:hidden;
}
.auction-card-media img{width:100%;height:100%;display:block;object-fit:contain;background:#0b0c0a}
.auction-card-status{
  position:absolute;left:10px;top:10px;padding:6px 7px;background:rgba(16,17,15,.88);
  border:1px solid rgba(238,233,223,.15);font-size:7px;letter-spacing:.15em;text-transform:uppercase;
}
.auction-card-body{padding:15px 15px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:15px}
.auction-card-main{min-width:0}
.auction-card-lot{display:block;margin-bottom:7px;color:#b7a47b;font-size:7px;letter-spacing:.16em;text-transform:uppercase}
.auction-card h3{
  margin:0 0 5px;font-family:Georgia,'Times New Roman',serif;font-size:20px;font-weight:400;
  line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.auction-card-artist{color:#8f897d;font-size:9px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase}
.auction-card-side{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:12px}
.auction-card-price{color:#eee9df;font-size:11px;letter-spacing:.05em;white-space:nowrap}
.auction-card .view-work{
  min-height:31px;padding:0 11px;border:1px solid rgba(238,233,223,.35);
  color:#eee9df;font-size:8px;letter-spacing:.13em;text-transform:uppercase;
}
.auction-card .view-work:hover{background:#eee9df;color:#171714}
.auction-empty{
  grid-column:1/-1;min-height:220px;display:grid;place-items:center;text-align:center;
  border:1px dashed rgba(238,233,223,.16);color:#77746d;font-size:9px;
  letter-spacing:.13em;text-transform:uppercase;padding:30px;
}
.auction-note{
  grid-column:1/-1;color:#77746d;font-size:9px;line-height:1.6;letter-spacing:.06em;
  padding:4px 0 10px;
}
@media(max-width:1100px){
  .auction-controls{flex-wrap:wrap}
  .auction-search input{width:150px}
}
@media(max-width:900px){
  .auctions-page{grid-template-columns:1fr;overflow:auto}
  .auctions-hero{height:auto;min-height:52vh;padding:92px 24px 42px}
  .auctions-hero h1{font-size:clamp(48px,14vw,70px)}
  .auctions-catalogue{height:auto;min-height:48vh;padding:28px 20px 34px;overflow:visible}
  .auctions-toolbar{align-items:stretch;flex-direction:column;gap:18px}
  .auction-controls{display:grid;grid-template-columns:1fr 1fr}
  .auction-search{grid-column:1/-1}.auction-search input{width:100%}
  .auction-select select{width:100%}
  .auction-grid{height:auto;overflow:visible;grid-template-columns:1fr;padding-top:18px}
}

.modal{position:fixed;z-index:1000;inset:0;background:rgba(8,8,7,.96);display:none;align-items:center;justify-content:center;padding:14px}.modal.open{display:flex}.modal-box{width:min(1900px,96vw);height:min(900px,92vh);background:#e9e4da;color:#171714;display:grid;grid-template-columns:minmax(0,82%) minmax(300px,18%);position:relative;overflow:hidden}.modal-image{background:#10100e;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;padding:12px;overflow:hidden}.modal-image img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;display:block}.modal-copy{height:100%;min-height:0;padding:34px 28px 24px;display:flex;flex-direction:column;overflow:hidden}.modal-head{flex:none;padding:0 28px 0 0}.modal-copy h2{font-family:Georgia,serif;font-weight:400;font-size:38px;line-height:1.08;margin:0 0 16px}.modal-meta{display:flex;flex-direction:column;gap:3px;font-size:11px;line-height:1.25;color:#302d28;letter-spacing:.02em}.artwork-section{min-height:0;display:flex;flex-direction:column}.artwork-description{flex:0 0 22%;height:auto;margin-top:26px}.artwork-story{flex:1 1 auto;height:auto;min-height:0;margin-top:18px;margin-bottom:18px}.artwork-section h3{flex:none;font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1;letter-spacing:.18em;text-transform:uppercase;color:#171714;margin:0 0 12px;font-weight:600}.artwork-scroll{min-height:0;flex:1 1 auto;overflow-y:auto;overflow-x:hidden;padding-right:10px;scrollbar-width:thin;scrollbar-color:#8f897d transparent}.artwork-scroll::-webkit-scrollbar{width:5px}.artwork-scroll::-webkit-scrollbar-track{background:transparent}.artwork-scroll::-webkit-scrollbar-thumb{background:#8f897d;border-radius:5px}.artwork-scroll{font-size:13px;line-height:1.8;color:#8f897d;white-space:pre-line}.cert{flex:none;margin-top:0;padding:17px;border:1px solid #b4aea3;background:#f1ede5;min-height:82px}.cert strong{font-size:10px;letter-spacing:.14em;text-transform:uppercase}.cert p{margin:9px 0 0;font-size:11px;line-height:1.5}.close{position:absolute;right:14px;top:10px;color:#171714;font-size:26px;z-index:2}
.close{position:absolute;right:14px;top:10px;color:#171714;font-size:26px;z-index:2}
@media(max-width:900px){.home-account{max-width:none;margin-top:22px}.home-account-row{gap:12px}header{padding:0 18px}.logo{font-size:19px}nav{gap:15px}nav a{font-size:9px}.home{grid-template-columns:1fr}.home-intro{display:none}.slide{grid-template-columns:1fr}.art-visual{min-height:52vh}.slide-info{position:absolute;left:0;right:0;bottom:0;height:auto;min-height:0;padding:25px 24px;background:linear-gradient(transparent,rgba(18,18,15,.98) 25%);padding-top:90px}.slide-info-inner{position:relative;left:auto;right:auto;top:auto;bottom:auto;display:flex;flex-direction:column;gap:0;overflow:visible}.slide-info-description{overflow:visible;scrollbar-width:auto}.slide-info-bottom{margin-top:4px}.slide-info h2{font-size:28px}.slide-info-description p{margin:12px 0}.gallery{padding:30px 18px 18px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));}.gallery-img-stage{width:calc(100% - 20px);margin:0 10px;}.gallery-head h2{font-size:32px}.gallery-controls button{width:30px}.gallery-controls .counter{font-size:8px}.book{grid-template-columns:1fr}.book-intro{padding:40px}.book-page{display:none}.modal-box{width:calc(100vw - 20px);height:94vh;grid-template-columns:1fr}.modal-image{height:58vh;min-height:0;padding:8px}.modal-copy{height:36vh;padding:24px}.artwork-description{height:22%}.artwork-story{height:52%}.cert{margin-top:14px}}
@media(max-width:560px){nav a:nth-child(3){display:none}.gallery-grid{grid-template-columns:1fr 1fr;gap:9px}.gallery-caption{padding:10px}.gallery-caption strong{font-size:9px}.gallery-caption span{font-size:9px}.slider-controls{right:16px;bottom:16px}}

body.modal-open{overflow:hidden}

/* Admin VISION */
.vision-admin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:8px 0 20px}.vision-help,.muted{color:#77736a;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.muted{margin-left:12px}
.vision-items{display:flex;flex-direction:column;gap:14px}.vision-admin-card{border:1px solid #34332d;padding:20px;background:rgba(255,255,255,.012);cursor:grab;transition:border-color .2s,transform .2s,opacity .2s}
.vision-admin-card:hover{border-color:#4b493f}.vision-admin-card.is-dragging{opacity:.45}.vision-admin-card.drag-over{border-color:#9e947e;transform:translateY(2px)}
.vision-admin-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px}.vision-admin-heading{flex:1}
.vision-topic-number{display:block;margin-bottom:8px;font-size:9px;letter-spacing:.15em;color:#a99b7c}.vision-topic-title{width:100%;background:transparent!important;border:0!important;border-bottom:1px solid #3a3932!important;padding:6px 0!important;font-size:18px!important}
.vision-card-actions{display:flex;align-items:center;gap:10px}.drag-handle{color:#77736a;font-size:18px;line-height:1;cursor:grab;user-select:none}
.danger{background:transparent;color:#9c7770;border:1px solid #493a37;padding:8px 12px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}.danger:hover{border-color:#8c5f58;color:#caa39b}


/* ============================================================
   WWADON — VISION / FINAL REFERENCE COMPOSITION
   Canonical desktop composition based on VISION MAIN reference.
   JS/data model remains unchanged.
   ============================================================ */
#vision.view{background:#0d0f0d}
#vision .vision-shell{
  width:100%;height:100%;display:grid;grid-template-columns:50% 50%;overflow:hidden;
}

/* LEFT — VISION 1 */
#vision .vision-overview{
  position:relative;min-width:0;height:100%;overflow:hidden;
  border-right:1px solid rgba(183,164,123,.62);background:#10130f;
}
#vision .vision-overview-image{
  position:absolute;inset:0;z-index:0;background-color:#171a16;
  background-size:cover;background-position:center center;
  filter:saturate(.48) brightness(.52);opacity:.72;
}
#vision .vision-overview-image::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(8,10,9,.86),rgba(8,10,9,.60) 62%,rgba(8,10,9,.48)),
             linear-gradient(180deg,rgba(8,10,9,.12),rgba(8,10,9,.78));
}
#vision .vision-overview-copy{
  position:relative;z-index:2;width:100%;height:100%;
  padding:clamp(54px,7.1vw,76px) clamp(54px,4vw,68px) 42px;
  display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;
}
#vision .vision-overview-copy .eyebrow{
  margin:54px 0 25px;color:#b7a47b;font-size:9px;line-height:1;letter-spacing:.21em;
}
#vision .vision-overview-copy h2{
  margin:0;color:#f2eee6;font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(58px,5.2vw,82px);font-weight:300;line-height:.95;letter-spacing:-.045em;
}
#vision .vision-rule{width:73px;height:1px;margin:31px 0 36px;background:#b7a47b;flex:none}
/* The main copy is a real scroll viewport. Its width is intentionally narrower
   than the left half, matching the reference composition. */
#vision .vision-lead{
  width:min(74%,620px);max-width:620px;
  height:clamp(280px,34vh,340px);max-height:340px;
  min-height:240px;flex:0 1 auto;
  color:#dedbd3;font-size:clamp(14px,.98vw,16px);line-height:1.95;letter-spacing:0;
  overflow-y:auto;overflow-x:hidden;display:block;white-space:pre-line;
  padding-right:14px;scrollbar-width:thin;scrollbar-color:#756c59 transparent;
}
#vision .vision-lead::-webkit-scrollbar{width:5px}
#vision .vision-lead::-webkit-scrollbar-track{background:transparent}
#vision .vision-lead::-webkit-scrollbar-thumb{background:#756c59;border-radius:8px}
#vision .vision-lead.has-custom-viewport{
  width:calc(var(--vision-vp-width,74%) + var(--vision-vp-left,0px) + var(--vision-vp-right,0px));
  max-width:none;
  height:calc(var(--vision-vp-height,34%) + var(--vision-vp-top,0px) + var(--vision-vp-bottom,0px));
  max-height:none;
  min-width:120px;
  min-height:120px;
  margin-left:calc(-1 * var(--vision-vp-left,0px));
  margin-top:calc(-1 * var(--vision-vp-top,0px));
}
#vision .vision-read{
  margin-top:28px;padding:15px 25px;min-height:47px;align-self:flex-start;
  border:1px solid rgba(183,164,123,.74);background:rgba(8,10,9,.08);color:#e2d8c2;
  font-size:9px;line-height:1;letter-spacing:.17em;text-transform:uppercase;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
#vision .vision-read span{margin-left:31px;font-size:15px}
#vision .vision-read:hover{background:#b7a47b;border-color:#b7a47b;color:#0d100d}

/* RIGHT — ACTION */
#vision .vision-topics-wrap{
  min-width:0;height:100%;display:flex;flex-direction:column;background:#0f110f;
}
#vision .vision-topics-head{
  height:84px;min-height:84px;padding:0 clamp(42px,5.5vw,92px) 0 clamp(42px,3.1vw,52px);
  display:flex;align-items:center;justify-content:flex-start;
  border-bottom:1px solid rgba(238,233,223,.13);color:#85827a;
}
#vision .vision-topics-head span:first-child{
  color:#89867e;font-size:18px;font-style:italic;font-weight:400;line-height:1;
  letter-spacing:-.035em;text-transform:none;
}
/* The old 03 counter is removed from the markup. */
#vision .vision-topics-head span:last-child{display:none}
#vision .vision-tree{
  position:relative;flex:1;min-height:0;overflow:auto;
  padding:0 clamp(42px,5.5vw,92px) 0 clamp(42px,3.1vw,52px);
  display:grid;
  grid-template-rows:var(--vision-row-1,minmax(0,1fr)) var(--vision-row-2,minmax(0,1fr)) var(--vision-row-3,minmax(0,1fr));
}
#vision .vision-tree::before{
  content:"";position:absolute;left:clamp(43px,3.15vw,53px);top:42px;bottom:42px;width:1px;
  background:linear-gradient(to bottom,rgba(183,164,123,.62),rgba(183,164,123,.22));pointer-events:none;
}
#vision .vision-node{position:relative;min-width:0;min-height:0;height:calc(var(--vision-section-height,100%) + var(--vision-top,0px) + var(--vision-bottom,0px));width:calc(var(--vision-section-width,100%) + var(--vision-left,0px) + var(--vision-right,0px));margin-top:calc(-1 * var(--vision-top,0px));margin-left:calc(-1 * var(--vision-left,0px));margin-bottom:calc(-1 * var(--vision-bottom,0px));padding:0 0 0 51px}
#vision .vision-node.has-custom-section{
  width:calc(var(--vision-section-width,100%) + var(--vision-left,0px) + var(--vision-right,0px));
  height:calc(var(--vision-section-height,100%) + var(--vision-top,0px) + var(--vision-bottom,0px));
  margin-top:calc(-1 * var(--vision-top,0px));
  margin-left:calc(-1 * var(--vision-left,0px));
  margin-bottom:calc(-1 * var(--vision-bottom,0px));
}
#vision .vision-node::before{
  content:"";position:absolute;left:28px;top:56px;width:14px;height:14px;box-sizing:border-box;
  border:1px solid #958b78;border-radius:50%;background:#0f110f;box-shadow:0 0 0 4px #0f110f;z-index:4;
}
#vision .vision-node:first-child::before{background:#e0b968;border-color:#e0b968}
#vision .vision-node:nth-child(n+4){display:none}
#vision .vision-branch{display:none}
/* One separator per card: the ACTION header owns the first horizontal rule. */
#vision .vision-node-body{
  width:100%;height:100%;min-height:0;padding:34px 0 29px;
  display:grid;grid-template-columns:minmax(0,1fr) clamp(210px,15vw,245px);gap:30px;align-items:center;
  border-top:0;background:transparent;cursor:pointer;transition:background .2s ease;
}
#vision .vision-node + .vision-node .vision-node-body,
#vision .vision-node:last-child .vision-node-body{border-bottom:1px solid rgba(238,233,223,.16)}
#vision .vision-node + .vision-node .vision-node-body{border-top:1px solid rgba(238,233,223,.16)}
#vision .vision-node-body:hover,#vision .vision-node.is-active .vision-node-body{background:rgba(43,48,36,.15)}
#vision .vision-node-copy{
  min-width:0;width:100%;max-width:none;padding-left:0;overflow:hidden;
  height:clamp(120px,15vh,165px);display:flex;flex-direction:column;
}
#vision .vision-node-number{margin:0 0 9px;color:#b7a47b;font-size:8px;line-height:1;letter-spacing:.19em;text-transform:uppercase;flex:none}
#vision .vision-node h3{
  position:relative;margin:0 0 14px;padding-right:42px;color:#eee9df;
  font-family:Georgia,'Times New Roman',serif;font-size:clamp(29px,2.25vw,36px);font-weight:400;
  line-height:1.02;letter-spacing:0;flex:none;
}
#vision .vision-node h3::after{
  content:"→";position:absolute;right:3px;top:0;color:#b7a47b;
  font-family:Arial,Helvetica,sans-serif;font-size:20px;font-weight:300;
}
/* Topic text occupies the full copy column and scrolls instead of changing
   the height of the card. */
#vision .vision-node-text{
  width:100%;max-width:none;flex:1;min-height:0;max-height:none;overflow-y:auto;overflow-x:hidden;
  display:block;-webkit-line-clamp:unset;color:#aaa69d;font-size:12px;line-height:1.55;padding:0 10px 0 0;
  scrollbar-width:thin;scrollbar-color:#756c59 transparent;white-space:pre-line;
}
#vision .vision-node-text::-webkit-scrollbar{width:4px}
#vision .vision-node-text::-webkit-scrollbar-track{background:transparent}
#vision .vision-node-text::-webkit-scrollbar-thumb{background:#756c59;border-radius:8px}
#vision .vision-node-thumb{
  width:clamp(210px,15vw,245px);height:135px;justify-self:end;overflow:hidden;
  border:1px solid rgba(183,164,123,.68);border-radius:7px;background:#181a17;
}
#vision .vision-node-thumb img{display:block;width:100%;height:100%;object-fit:cover}

/* ---------------- DETAIL VIEW — keep existing behavior ---------------- */
.vision-detail{position:fixed;inset:72px 0 0;z-index:150;background:#0b0e0c;display:none;overflow:auto}
.vision-detail.open{display:block;animation:visionIn .35s ease both}
.vision-detail-inner{min-height:100%;padding:38px clamp(28px,5vw,76px) 60px}
.vision-back{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#b7a47b;padding:8px 0}
.vision-back:hover{color:#eee9df}
.vision-detail-grid{max-width:1320px;margin:45px auto 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:clamp(40px,6vw,90px);align-items:start}
.vision-detail-copy{padding:10px 0}
.vision-detail-copy .eyebrow{color:#b7a47b;margin-bottom:15px}
.vision-detail-copy h2{font-size:clamp(38px,4.3vw,68px);font-weight:300;letter-spacing:-.035em;margin:0;line-height:1.05}
.vision-detail-text{max-width:760px;color:#d6d1c7;font-size:15px;line-height:1.9;white-space:pre-line}
.vision-detail-media{min-height:500px;border:1px solid rgba(238,233,223,.14);border-radius:4px;overflow:hidden;background:#101510;position:sticky;top:0}
.vision-detail-media img{width:100%;height:100%;min-height:500px;object-fit:cover;display:block}
.vision-detail-media .placeholder{min-height:500px}
@keyframes visionIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
body.vision-detail-open{overflow:hidden}

/* ---------------- VISION RESPONSIVE ---------------- */
@media (max-width:1100px){
  #vision .vision-node-body{grid-template-columns:minmax(0,1fr) 190px;gap:20px}
  #vision .vision-node-thumb{width:190px;height:110px}
  #vision .vision-overview-copy{padding-left:48px;padding-right:48px}
}
@media (max-width:1000px){
  #vision .vision-shell{height:auto;min-height:100%;grid-template-columns:1fr;overflow:auto}
  #vision .vision-overview{height:auto;min-height:58vh;border-right:0;border-bottom:1px solid rgba(183,164,123,.62)}
  #vision .vision-overview-copy{min-height:58vh;height:auto;padding:40px 7vw 55px}
  #vision .vision-overview-copy .eyebrow{margin-top:22px}
  #vision .vision-lead{width:min(100%,690px);max-width:690px;height:260px;max-height:none;min-height:180px;font-size:14px;line-height:1.8}
  #vision .vision-topics-wrap{height:auto;min-height:42vh}
  #vision .vision-topics-head{height:64px;min-height:64px;padding:0 7vw}
  #vision .vision-tree{display:flex;flex-direction:column;overflow:visible;padding:0 7vw 45px}
  #vision .vision-tree::before{left:7vw;top:34px;bottom:38px}
  #vision .vision-node{height:auto;min-height:190px;padding-left:42px}
  #vision .vision-node::before{left:calc(7vw - 7px);top:43px;width:12px;height:12px}
  #vision .vision-node-body{min-height:190px;height:auto;grid-template-columns:minmax(0,1fr) 190px;gap:20px;padding:28px 0}
  #vision .vision-node-copy{height:145px;max-width:none}
  #vision .vision-node-text{max-width:none;font-size:10.5px}
  #vision .vision-node-thumb{width:190px;height:110px}
}
@media (max-width:650px){
  #vision .vision-overview{min-height:0}
  #vision .vision-overview-copy{min-height:0;padding:28px 24px 42px}
  #vision .vision-overview-copy .eyebrow{margin-top:8px;margin-bottom:20px}
  #vision .vision-overview-copy h2{font-size:52px}
  #vision .vision-rule{margin:25px 0 21px}
  #vision .vision-lead{width:100%;max-width:none;height:230px;min-height:160px;font-size:13px;line-height:1.65}
  #vision .vision-read{margin-top:25px}
  #vision .vision-topics-head{padding:0 24px}
  #vision .vision-tree{padding:0 24px 36px}
  #vision .vision-tree::before{left:25px;top:28px;bottom:30px}
  #vision .vision-node{padding-left:26px;min-height:0}
  #vision .vision-node::before{left:19px;top:35px;width:11px;height:11px}
  #vision .vision-node-body{min-height:0;height:auto;grid-template-columns:minmax(0,1fr) 105px;gap:13px;padding:24px 0}
  #vision .vision-node-copy{height:125px;max-width:none}
  #vision .vision-node-thumb{width:105px;height:68px;border-radius:5px}
  #vision .vision-node h3{font-size:25px;padding-right:28px}
  #vision .vision-node h3::after{font-size:15px;right:1px}
  #vision .vision-node-text{max-width:none;font-size:9.5px;line-height:1.5}
  .vision-detail{inset:58px 0 0}
  .vision-detail-grid{grid-template-columns:1fr;margin-top:30px;gap:28px}
  .vision-detail-media{min-height:280px;position:relative}
  .vision-detail-media img{min-height:280px}
}

/* ============================================================
   WWADON v8.4 — CHRONICLE / PUBLIC HISTORY
   Restores the canonical split composition used by the WWADON page.
   The layout is independent from HOME and VISION so route changes do not
   inherit their geometry or typography.
   ============================================================ */
#wwadon.view{background:#151512;color:#eee9df}
#wwadon .wwadon-history{
  width:100%;height:100%;display:grid;grid-template-columns:38% 62%;
  overflow:hidden;background:#151512;
}
#wwadon .wwadon-history-intro{
  min-width:0;height:100%;padding:clamp(54px,7vw,104px) clamp(48px,5.8vw,94px);
  display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(145deg,#1b1d18 0%,#25271f 100%);
  border-right:1px solid rgba(238,233,223,.13);
}
#wwadon .wwadon-history-intro .eyebrow{
  margin:0 0 24px;color:#aaa497;font-size:9px;line-height:1;
  letter-spacing:.22em;text-transform:uppercase;
}
#wwadon .wwadon-history-intro h2{
  margin:0 0 25px;color:#eee9df;font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(48px,5.5vw,78px);font-weight:400;line-height:.96;
  letter-spacing:-.035em;
}
#wwadon .wwadon-history-intro p{
  max-width:470px;margin:0;color:#c5bfb2;font-size:13px;line-height:1.8;
}
#wwadon .wwadon-history-panel{
  min-width:0;height:100%;padding:clamp(34px,3.2vw,54px) clamp(42px,5.5vw,92px) 40px;
  display:flex;flex-direction:column;overflow:hidden;background:#10110f;
}
#wwadon .history-head{
  flex:none;height:42px;padding:0 0 16px;display:flex;align-items:flex-start;
  justify-content:space-between;border-bottom:1px solid rgba(238,233,223,.16);
  color:#77746d;font-size:8px;line-height:1;letter-spacing:.2em;text-transform:uppercase;
}
#wwadon #wwadonDayCount{color:#77746d}
#wwadon .history-list{
  min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;
  scrollbar-width:thin;scrollbar-color:#756c59 transparent;
}
#wwadon .history-list::-webkit-scrollbar{width:5px}
#wwadon .history-list::-webkit-scrollbar-track{background:transparent}
#wwadon .history-list::-webkit-scrollbar-thumb{background:#756c59;border-radius:8px}
#wwadon .history-empty{
  padding-top:48px;color:#77746d;font-size:10px;line-height:1.6;
  letter-spacing:.13em;text-transform:uppercase;
}
#wwadon .history-item{
  position:relative;display:grid;grid-template-columns:100px minmax(0,1fr);
  gap:30px;min-height:150px;padding:38px 0 36px;
  border-bottom:1px solid rgba(238,233,223,.12);
}
#wwadon .history-item:first-child{padding-top:42px}
#wwadon .history-date{
  color:#b7a47b;font-size:8px;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;
  padding-top:3px;
}
#wwadon .history-body{min-width:0}
#wwadon .history-body h3{
  margin:0 0 13px;color:#eee9df;font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(25px,2.2vw,34px);font-weight:400;line-height:1.05;
}
#wwadon .history-body p{
  max-width:650px;margin:0;color:#aaa69d;font-size:12px;line-height:1.7;
  white-space:pre-line;
}
#wwadon .history-item::before{
  content:"";position:absolute;left:-26px;top:47px;width:8px;height:8px;border:1px solid #8d856f;
  border-radius:50%;background:#10110f;box-shadow:0 0 0 4px #10110f;
}
#wwadon .history-item:first-child::before{background:#e0b968;border-color:#e0b968}

@media(max-width:1000px){
  #wwadon .wwadon-history{grid-template-columns:1fr;overflow:auto}
  #wwadon .wwadon-history-intro{height:auto;min-height:46vh;border-right:0;border-bottom:1px solid rgba(238,233,223,.13);padding:52px 7vw 58px}
  #wwadon .wwadon-history-panel{height:auto;min-height:54vh;padding:34px 7vw 40px}
  #wwadon .history-list{overflow:visible}
}
@media(max-width:650px){
  #wwadon .wwadon-history-intro{min-height:0;padding:38px 24px 46px}
  #wwadon .wwadon-history-intro h2{font-size:52px}
  #wwadon .wwadon-history-panel{min-height:0;padding:28px 24px 36px}
  #wwadon .history-item{grid-template-columns:1fr;gap:10px;min-height:0;padding:28px 0}
  #wwadon .history-item::before{left:-15px;top:34px}
  #wwadon .history-date{padding-top:0}
}

/* WW-014.1 — Authentication UI */
.header-auth{display:flex;align-items:center;gap:10px;margin-left:auto;margin-right:28px;min-width:0}.auth-status{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#aaa69d;font-size:9px;letter-spacing:.08em;text-transform:uppercase}.auth-actions{display:flex;align-items:center;gap:8px}.auth-button{appearance:none;border:1px solid rgba(238,233,223,.28);background:transparent;color:#eee9df;padding:8px 12px;font:inherit;font-size:9px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}.auth-button:hover:not(:disabled){border-color:rgba(238,233,223,.65);background:rgba(238,233,223,.06)}.auth-button:focus-visible,.auth-submit:focus-visible,.auth-mode button:focus-visible,.auth-dialog-close:focus-visible{outline:2px solid #b7a47b;outline-offset:2px}.auth-button:disabled,.auth-submit:disabled{opacity:.55;cursor:wait}.auth-button-quiet{border-color:rgba(238,233,223,.16);color:#aaa69d}.auth-dialog{width:min(440px,calc(100vw - 32px));padding:0;border:1px solid rgba(238,233,223,.16);background:#151512;color:#eee9df;box-shadow:0 24px 80px rgba(0,0,0,.5)}.auth-dialog::backdrop{background:rgba(0,0,0,.68);backdrop-filter:blur(4px)}.auth-dialog-card{position:relative;padding:42px 40px 38px}.auth-dialog-card .eyebrow{margin-bottom:14px;color:#aaa497;font-size:9px;letter-spacing:.22em;text-transform:uppercase}.auth-dialog-card h2{margin:0 0 10px;font-family:Georgia,'Times New Roman',serif;font-size:42px;font-weight:400;line-height:1}.auth-dialog-card>p{margin:0 0 24px;color:#aaa69d;font-size:12px;line-height:1.6}.auth-dialog-close{position:absolute;top:12px;right:14px;border:0;background:transparent;color:#aaa69d;font-size:25px;line-height:1;cursor:pointer}.auth-mode{display:flex;gap:18px;margin-bottom:24px;border-bottom:1px solid rgba(238,233,223,.12)}.auth-mode button{border:0;border-bottom:1px solid transparent;margin-bottom:-1px;padding:0 0 10px;background:transparent;color:#77746d;font:inherit;font-size:9px;letter-spacing:.15em;text-transform:uppercase;cursor:pointer}.auth-mode button.is-active{border-color:#b7a47b;color:#eee9df}.auth-field{display:block;margin:0 0 16px}.auth-field.is-hidden{display:none!important}.auth-field span{display:block;margin-bottom:7px;color:#aaa69d;font-size:9px;letter-spacing:.14em;text-transform:uppercase}.auth-field input{box-sizing:border-box;width:100%;border:1px solid rgba(238,233,223,.16);background:#10110f;color:#eee9df;padding:12px 13px;font:inherit;font-size:13px}.auth-field input:focus{border-color:#b7a47b;outline:0}.auth-field input[readonly]{opacity:.72;cursor:default}.auth-submit{width:100%;margin-top:4px;border:1px solid #b7a47b;background:#b7a47b;color:#151512;padding:12px 16px;font:inherit;font-size:9px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}.auth-error{min-height:18px;margin:4px 0 10px!important;color:#dca7a0!important;font-size:11px!important}.auth-message{min-height:18px;margin:4px 0 10px!important;color:#aaa69d!important;font-size:11px!important}.auth-secondary-link{display:block;margin:8px auto 0;padding:0;border:0;background:transparent;color:#aaa69d;font:inherit;font-size:9px;letter-spacing:.12em;text-transform:uppercase;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.auth-secondary-link:hover{color:#eee9df}@media(max-width:900px){.header-auth{margin-right:14px}.auth-status{display:none}.auth-button{padding:7px 9px}}@media(max-width:650px){.header-auth{margin-right:8px}.auth-dialog-card{padding:36px 24px 28px}.auth-dialog-card h2{font-size:36px}}

/* WW-014.2 — Auction Authentication Bridge */
.account-links{display:flex;gap:16px;margin-top:12px;color:#6f6a61;font-size:8px;letter-spacing:.14em;text-transform:uppercase}
.account-links span{white-space:nowrap}
.auction-session-state{display:block;color:#77746d;font-size:8px;letter-spacing:.1em;text-transform:uppercase;margin-top:2px}
.auction-card.is-live{border-color:rgba(183,164,123,.34)}
.auction-card-auction-title{margin-top:9px;color:#77746d;font-size:8px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase}
.auction-bid-box{display:flex;flex-direction:column;align-items:flex-end;gap:7px;min-width:190px}
.auction-bid-box-static{justify-content:flex-end;min-height:82px}
.auction-bid-meta{display:flex;align-items:baseline;justify-content:flex-end;gap:8px;width:100%;color:#77746d;font-size:7px;letter-spacing:.12em;text-transform:uppercase}
.auction-bid-meta strong{color:#eee9df;font-size:11px;letter-spacing:.03em;font-weight:400;white-space:nowrap}
.auction-bid-input{width:100%}
.auction-bid-input input{box-sizing:border-box;width:100%;height:31px;border:1px solid rgba(238,233,223,.18);background:#10110f;color:#eee9df;padding:0 9px;font:inherit;font-size:10px;outline:none;text-align:right}
.auction-bid-input input:focus{border-color:#b7a47b}
.auction-bid-button{width:100%;min-height:31px;border:1px solid #b7a47b;background:#b7a47b;color:#151512;padding:0 10px;font:inherit;font-size:8px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.auction-bid-button:hover:not(:disabled){background:#eee9df;border-color:#eee9df}
.auction-bid-button:disabled{opacity:.5;cursor:not-allowed}
.auction-bid-min{width:100%;color:#77746d;font-size:7px;line-height:1.4;letter-spacing:.06em;text-align:right}
.auction-bid-message{width:100%;min-height:14px;color:#aaa69d;font-size:8px;line-height:1.4;text-align:right}
.auction-bid-message.is-error{color:#dca7a0}
@media(max-width:900px){
  .account-links{gap:12px}
  .auction-bid-box{min-width:0;width:100%;align-items:stretch}
  .auction-bid-meta,.auction-bid-min,.auction-bid-message{text-align:left;justify-content:space-between}
}
@media(max-width:650px){
  .auction-card-body{grid-template-columns:1fr}
  .auction-card-side{align-items:stretch}
  .auction-card .view-work{width:100%}
}

/* ============================================================
   VISION DETAIL — scroll-driven editorial gallery
   ============================================================ */

.vision-detail-copy{min-height:calc(100svh - 160px)}.vision-detail-text{min-height:calc(100svh - 250px)}
@media(max-width:1000px){.vision-detail-copy{min-height:auto}.vision-detail-text{min-height:0}.vision-detail-gallery-stage{min-height:280px}}
.vision-detail-copy{min-height:calc(var(--vision-gallery-steps,1) * (100svh - 160px))}
.vision-detail-text{min-height:calc(100svh - 250px)}
@media(max-width:1000px){.vision-detail-copy{min-height:auto}.vision-detail-text{min-height:0}}


/* ============================================================
   WWADON VISION DETAIL — FINAL TWO-IMAGE / TEXT-ONLY SCROLL
   Reference behavior:
   - browser/page does NOT scroll while a VISION detail is open
   - only the text field scrolls
   - right gallery is fixed in the viewport
   - exactly two gallery images are visible at a time
   - scrolling one text viewport advances the gallery by TWO images
   ============================================================ */

body.vision-detail-open{
  overflow:hidden !important;
  height:100%;
}

.vision-detail{
  position:fixed !important;
  inset:72px 0 0 !important;
  z-index:150;
  display:none;
  overflow:hidden !important;
  overscroll-behavior:none;
  height:calc(100dvh - 72px);
  max-height:calc(100dvh - 72px);
}

.vision-detail.open{
  display:block;
}

.vision-detail-inner{
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-height:0 !important;
  padding:24px clamp(28px,5vw,76px) 28px !important;
  display:flex;
  flex-direction:column;
  overflow:hidden !important;
}

.vision-back{
  flex:0 0 auto;
  height:34px;
  display:flex;
  align-items:center;
  padding:0 !important;
}

.vision-detail-grid{
  box-sizing:border-box;
  width:min(1320px,100%);
  height:auto !important;
  min-height:0 !important;
  flex:1 1 auto;
  margin:20px auto 0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(300px,360px) !important;
  gap:clamp(36px,5vw,78px) !important;
  align-items:stretch !important;
  overflow:hidden !important;
}

.vision-detail-copy{
  box-sizing:border-box;
  min-width:0;
  min-height:0 !important;
  height:100% !important;
  padding:8px 0 0 !important;
  display:flex;
  flex-direction:column;
  overflow:hidden !important;
}

.vision-detail-copy .eyebrow{
  flex:0 0 auto;
}

.vision-detail-copy h2{
  flex:0 0 auto;
}

.vision-detail-copy .vision-rule{
  flex:0 0 auto;
}

.vision-detail-text{
  box-sizing:border-box;
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  width:100%;
  max-width:760px;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:#756c59 transparent;
  padding:4px 18px 28px 0 !important;
  margin:0 !important;
  white-space:pre-line;
}

.vision-detail-text::-webkit-scrollbar{width:5px}
.vision-detail-text::-webkit-scrollbar-track{background:transparent}
.vision-detail-text::-webkit-scrollbar-thumb{
  background:#756c59;
  border-radius:8px;
}


.vision-detail-media{
  box-sizing:border-box;
  width:100%;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  position:relative !important;
  top:auto !important;
  align-self:stretch;
  overflow:hidden !important;
  border:0;
  border-radius:4px;
  background:#101510;
}

.vision-detail-gallery-stage{
  position:relative;
  width:100%;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden;
  background:transparent;
}

/* The track contains complete TWO-IMAGE pages. As the text viewport scrolls,
   the track moves upward continuously; one full page shift = exactly two
   gallery images. The gallery frame itself never scrolls. */
.vision-detail-gallery-track{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:0;
  will-change:transform;
  transform:translate3d(0,0,0);
}

.vision-detail-gallery-pair{
  flex:0 0 100%;
  width:100%;
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:minmax(0,1fr) minmax(0,1fr);
  gap:14px;
}

.vision-detail-gallery-image{
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  background:#101510;
  border:1px solid rgba(238,233,223,.14);
  border-radius:4px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.vision-detail-gallery-image.is-empty{visibility:hidden}

.vision-detail-gallery-image img{
  display:block;
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
}

.vision-detail-gallery-counter{
  position:absolute;
  right:12px;
  bottom:10px;
  z-index:3;
  padding:5px 8px;
  background:rgba(11,14,12,.72);
  color:#b7a47b;
  font-size:8px;
  letter-spacing:.16em;
  pointer-events:none;
}

.vision-detail-gallery-stage-single{
  display:block;
}

.vision-detail-gallery-stage-single .vision-detail-gallery-image-1{
  height:100%;
}

.vision-detail-media .placeholder{
  height:100%;
  min-height:0;
  display:grid;
  place-items:center;
}

/* Do not allow the legacy full-page gallery sizing rules to re-enable scroll. */
.vision-detail-copy,
.vision-detail-text{
  --vision-gallery-steps:initial;
}

@media(max-width:1000px){
  .vision-detail{
    inset:64px 0 0 !important;
    height:calc(100dvh - 64px);
    max-height:calc(100dvh - 64px);
  }

  .vision-detail-inner{
    padding:18px 24px 22px !important;
  }

  .vision-detail-grid{
    grid-template-columns:minmax(0,1fr) minmax(220px,34vw) !important;
    gap:24px !important;
    margin-top:14px !important;
  }

  .vision-detail-media{
    height:100% !important;
  }

  .vision-detail-gallery-stage{
    gap:10px;
  }

  .vision-detail-text{
    font-size:14px;
    line-height:1.75;
  }
}

@media(max-width:760px){
  .vision-detail-grid{
    grid-template-columns:1fr !important;
    grid-template-rows:minmax(0,1fr) minmax(230px,42vh) !important;
    overflow:hidden !important;
  }

  .vision-detail-copy{
    min-height:0 !important;
  }

  .vision-detail-media{
    min-height:0 !important;
    height:100% !important;
  }

  .vision-detail-gallery-stage{
    grid-template-columns:1fr 1fr;
    grid-template-rows:1fr;
  }
}



/* ============================================================
   WWADON — GLOBAL TYPOGRAPHY SYSTEM
   Typography variables are presentation-only overrides. Existing
   geometry, grid, scroll and gallery behavior remain untouched.
   ============================================================ */
.logo small{
  font-size:var(--home-header-tagline-size,8px);
  color:var(--home-header-tagline-color,#aaa497);
  font-weight:var(--home-header-tagline-weight,400);
  font-family:var(--home-header-tagline-font,Arial,Helvetica,sans-serif);
}
#home .home-intro > .eyebrow{
  font-size:var(--home-eyebrow-size,10px);
  color:var(--home-eyebrow-color,#aaa497);
  font-weight:var(--home-eyebrow-weight,400);
  font-family:var(--home-eyebrow-font,Arial,Helvetica,sans-serif);
}
#home #homeMainTitle{
  font-size:var(--home-main-title-size,clamp(43px,5.5vw,78px));
  color:var(--home-main-title-color,#eee9df);
  font-weight:var(--home-main-title-weight,400);
  font-family:var(--home-main-title-font,Georgia,serif);
}
#home #homeDescription{
  font-size:var(--home-main-description-size,14px);
  color:var(--home-main-description-color,#c5bfb2);
  font-weight:var(--home-main-description-weight,400);
  font-family:var(--home-main-description-font,Arial,Helvetica,sans-serif);
}
#home #homeSelectedLabel{
  font-size:var(--home-selected-works-size,10px);
  color:var(--home-selected-works-color,#999287);
  font-weight:var(--home-selected-works-weight,400);
  font-family:var(--home-selected-works-font,Arial,Helvetica,sans-serif);
}
#wwadon .history-date{
  font-size:var(--wwadon-date-size,8px);
  color:var(--wwadon-date-color,#b7a47b);
  font-weight:var(--wwadon-date-weight,400);
  font-family:var(--wwadon-date-font,Arial,Helvetica,sans-serif);
}
#wwadon .history-body h3{
  font-size:var(--wwadon-title-size,clamp(25px,2.2vw,34px));
  color:var(--wwadon-title-color,#eee9df);
  font-weight:var(--wwadon-title-weight,400);
  font-family:var(--wwadon-title-font,Georgia,'Times New Roman',serif);
}
#wwadon .history-body p{
  font-size:var(--wwadon-history-size,12px);
  color:var(--wwadon-history-color,#aaa69d);
  font-weight:var(--wwadon-history-weight,400);
  font-family:var(--wwadon-history-font,Arial,Helvetica,sans-serif);
}
#vision .vision-overview-copy > .eyebrow,
.vision-detail-copy > .eyebrow{
  font-size:var(--vision-number-size,10px);
  color:var(--vision-number-color,#b7a47b);
  font-weight:var(--vision-number-weight,400);
  font-family:var(--vision-number-font,Arial,Helvetica,sans-serif);
}
#vision #visionTitle{
  font-size:clamp(58px,5.2vw,var(--vision-title-size,82px));
  color:var(--vision-title-color,#eee9df);
  font-weight:var(--vision-title-weight,300);
  font-family:var(--vision-title-font,Arial,Helvetica,sans-serif);
}
.vision-detail-copy #visionDetailTitle{
  font-size:clamp(38px,4.3vw,calc(var(--vision-title-size,82px) * .829268));
  color:var(--vision-title-color,#eee9df);
  font-weight:var(--vision-title-weight,300);
  font-family:var(--vision-title-font,Arial,Helvetica,sans-serif);
}
#vision #visionContent,
.vision-detail-text{
  font-size:var(--vision-content-size,15px);
  color:var(--vision-content-color,#d6d1c7);
  font-weight:var(--vision-content-weight,400);
  font-family:var(--vision-content-font,Arial,Helvetica,sans-serif);
}
.slide-info-description,
.slide-info-description p,
#modalDescription{
  font-size:var(--artwork-description-size,13px);
  color:var(--artwork-description-color,#8f897d);
  font-weight:var(--artwork-description-weight,400);
  font-family:var(--artwork-description-font,Arial,Helvetica,sans-serif);
}
#modalStory{
  font-size:var(--artwork-story-size,13px);
  color:var(--artwork-story-color,#8f897d);
  font-weight:var(--artwork-story-weight,400);
  font-family:var(--artwork-story-font,Arial,Helvetica,sans-serif);
}
.slide-info-bottom .price,
.modal-meta .modal-meta-price{
  font-size:7.5px;
  color:#eee9df;
  font-weight:400;
  font-family:Arial,Helvetica,sans-serif;
}
@media(max-width:650px){
  #home #homeMainTitle{font-size:min(var(--home-main-title-size,78px),52px)}
  #wwadon .history-body h3{font-size:min(var(--wwadon-title-size,34px),52px)}
  #vision #visionTitle{font-size:min(var(--vision-title-size,82px),52px)}
  .vision-detail-copy #visionDetailTitle{font-size:min(calc(var(--vision-title-size,82px) * .829268),52px)}
}

/* ============================================================
   ADMIN — TYPOGRAPHY CONTROLS
   ============================================================ */
.typography-section{
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid #34372f;
}
.typography-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:15px;
}
.typography-section-head h3{
  margin:0;
  color:#eee9df;
  font-size:12px;
  font-weight:500;
  letter-spacing:.12em;
}
.typography-section-head p{
  margin:6px 0 0;
  color:#777a71;
  font-size:10px;
  line-height:1.5;
}
.typography-controls{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  padding:14px;
  background:rgba(255,255,255,.018);
  border:1px solid #292c26;
}
.typography-controls label{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin:0;
  color:#85877e;
  font-size:8px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.typography-controls input,
.typography-controls select{
  width:100%;
  box-sizing:border-box;
  min-height:38px;
  background:#11130f;
  border:1px solid #34372f;
  color:#eee9df;
  padding:9px 10px;
  font:inherit;
  letter-spacing:0;
  text-transform:none;
}
.typography-controls input:focus,
.typography-controls select:focus{
  outline:1px solid #77735f;
  outline-offset:1px;
}
.typography-size-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
}
.typography-size-row output{
  min-width:34px;
  color:#aaa497;
  font-size:9px;
  letter-spacing:0;
  text-transform:none;
}
.typography-color-row{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:7px;
}
.typography-color-row input[type="color"]{
  padding:3px;
  min-height:38px;
  cursor:pointer;
}
.typography-color-row input[type="text"]{
  text-transform:uppercase;
}
.custom-font-upload{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  gap:12px;
  align-items:end;
}
.custom-font-upload label{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:#85877e;
  font-size:8px;
  letter-spacing:.12em;
}
.custom-font-upload input{
  box-sizing:border-box;
  width:100%;
  min-height:38px;
  background:#11130f;
  border:1px solid #34372f;
  color:#eee9df;
  padding:9px 10px;
}
.custom-fonts-list{
  display:grid;
  gap:7px;
  margin-top:12px;
}
.custom-font-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:10px 12px;
  border:1px solid #292c26;
  background:rgba(255,255,255,.012);
}
.custom-font-name{color:#eee9df;font-size:10px}
.custom-font-file{color:#777a71;font-size:9px;margin-top:3px}
.custom-font-remove{
  flex:0 0 auto;
  border:1px solid #34372f;
  background:transparent;
  color:#aaa497;
  padding:7px 9px;
  font-size:8px;
  letter-spacing:.12em;
  cursor:pointer;
}
.custom-font-remove:hover{border-color:#77735f;color:#eee9df}
@media(max-width:800px){
  .typography-controls{grid-template-columns:1fr 1fr}
  .custom-font-upload{grid-template-columns:1fr}
}
@media(max-width:520px){
  .typography-controls{grid-template-columns:1fr}
}


/* ============================================================
   VISION — SINGLE CARD / ONE IMAGE PER TEXT VIEWPORT
   The public VISION page is one card only. There is no public
   VISION 2/3/4 navigation. The image viewport is exactly the
   same height as the scrollable text viewport.
   ============================================================ */

#vision .vision-main{
  box-sizing:border-box;
  width:min(1280px,calc(100% - clamp(48px,10vw,160px)));
  height:100%;
  margin:0 auto;
  padding:clamp(28px,3.2vh,44px) 0 clamp(24px,3vh,40px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

#vision .vision-main-head{
  flex:0 0 auto;
  padding-left:clamp(0px,1vw,14px);
}

#vision .vision-main-head .eyebrow{
  margin:0 0 20px;
  color:#b7a47b;
  font-size:var(--vision-number-size,9px);
  font-weight:var(--vision-number-weight,400);
  font-family:var(--vision-number-font,Arial,Helvetica,sans-serif);
}

#vision .vision-main-head h2{
  margin:0;
  color:var(--vision-title-color,#eee9df);
  font-size:clamp(52px,5.2vw,var(--vision-title-size,82px));
  font-weight:var(--vision-title-weight,300);
  font-family:var(--vision-title-font,Arial,Helvetica,sans-serif);
  line-height:.95;
  letter-spacing:-.045em;
}

#vision .vision-main-head .vision-rule{
  width:73px;
  height:1px;
  margin:28px 0 30px;
  background:#b7a47b;
}

#vision .vision-main-card{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
}

#vision .vision-main-row{
  flex:0 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,360px);
  gap:clamp(42px,5vw,78px);
  align-items:stretch;
  /* VISION reference axis: the complete text/image field is lowered
     together without changing its internal height or proportions. */
  transform:translateY(clamp(0px,3.5vh,38px));
}

#vision .vision-main-copy{
  min-width:0;
  height:clamp(300px,58vh,620px);
  min-height:260px;
  overflow:hidden;
}

#vision .vision-main-text{
  box-sizing:border-box;
  width:100%;
  height:100%;
  max-width:760px;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:#756c59 transparent;
  padding:4px 18px 24px 0;
  margin:0;
  white-space:pre-line;
  color:var(--vision-content-color,#d6d1c7);
  font-size:var(--vision-content-size,15px);
  font-weight:var(--vision-content-weight,400);
  font-family:var(--vision-content-font,Arial,Helvetica,sans-serif);
  line-height:1.9;
}

#vision .vision-main-text::-webkit-scrollbar{width:5px}
#vision .vision-main-text::-webkit-scrollbar-track{background:transparent}
#vision .vision-main-text::-webkit-scrollbar-thumb{background:#756c59;border-radius:8px}

#vision .vision-main-media{
  position:relative;
  width:100%;
  height:clamp(300px,58vh,620px);
  min-height:260px;
  overflow:hidden;
  border:1px solid rgba(238,233,223,.14);
  border-radius:4px;
  background:#101510;
}

#vision .vision-main-gallery-track{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  will-change:transform;
  transform:translate3d(0,0,0);
  transition:transform .48s cubic-bezier(.22,.61,.36,1);
}

#vision .vision-main-gallery-image{
  position:relative;
  flex:0 0 100%;
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  background:#101510;
}

#vision .vision-main-gallery-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

#vision .vision-main-gallery-image.is-empty{visibility:hidden}

#vision .vision-main-gallery-counter{
  position:absolute;
  right:12px;
  bottom:10px;
  z-index:4;
  padding:5px 8px;
  background:rgba(11,14,12,.72);
  color:#b7a47b;
  font-size:8px;
  letter-spacing:.16em;
  pointer-events:none;
}

/* The old multi-VISION overview/tree is no longer part of the public UI. */
#vision .vision-overview,
#vision .vision-topics-wrap{
  display:none !important;
}

@media(max-width:1000px){
  #vision .vision-main{
    width:calc(100% - 48px);
    padding-top:24px;
  }

  #vision .vision-main-row{
    grid-template-columns:minmax(0,1fr) minmax(220px,34vw);
    gap:24px;
  }

  #vision .vision-main-copy,
  #vision .vision-main-media{
    height:clamp(280px,57vh,560px);
  }

}

@media(max-width:760px){
  #vision .vision-main{
    width:calc(100% - 32px);
    padding:20px 0 24px;
    overflow:hidden;
  }

  #vision .vision-main-head .eyebrow{margin-bottom:14px}
  #vision .vision-main-head h2{font-size:clamp(48px,14vw,68px)}
  #vision .vision-main-head .vision-rule{margin:22px 0 22px}

  #vision .vision-main-row{
    grid-template-columns:1fr;
    grid-template-rows:minmax(240px,48vh) minmax(240px,48vh);
    gap:18px;
    overflow:hidden;
  }

  #vision .vision-main-copy{
    height:auto;
    min-height:0;
  }

  #vision .vision-main-media{
    height:auto;
    min-height:0;
  }

}

/* ============================================================
   WWADON CARD — PSD / JPG REFERENCE IMPLEMENTATION
   The public WWADON page uses the document scroll. The left intro is
   sticky; the right chronicle grows naturally with its entries.
   ============================================================ */
html.wwadon-route,
body.wwadon-route{
  height:auto;
  min-height:100%;
  overflow-x:hidden;
  overflow-y:auto;
}
body.wwadon-route main{
  position:relative;
  inset:auto;
  margin-top:72px;
  min-height:calc(100vh - 72px);
}
body.wwadon-route .view{
  position:relative;
  inset:auto;
}
body.wwadon-route #wwadon.view.active{
  display:block;
  overflow:visible;
}
#wwadon .wwadon-history{
  width:100%;
  min-height:calc(100vh - 72px);
  height:auto;
  display:grid;
  grid-template-columns:minmax(320px,38vw) minmax(0,1fr);
  overflow:visible;
  background:#10100e;
}
#wwadon .wwadon-history-intro{
  min-width:0;
  height:calc(100vh - 72px);
  position:sticky;
  top:72px;
  align-self:start;
  padding:clamp(48px,7vw,82px) clamp(40px,4.27vw,82px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(145deg,#1b1d18 0%,#22241d 100%);
  border-right:1px solid rgba(238,233,223,.13);
}
#wwadon .wwadon-history-intro .eyebrow{margin-bottom:24px}
#wwadon .wwadon-history-intro h2{
  margin:0 0 24px;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(48px,5.5vw,78px);
  font-weight:400;
  line-height:.96;
  letter-spacing:-.035em;
}
#wwadon .wwadon-history-intro p{
  max-width:470px;
  margin:0;
  color:#c5bfb2;
  font-size:13px;
  line-height:1.8;
}
#wwadon .wwadon-history-panel{
  min-width:0;
  height:auto;
  min-height:calc(100vh - 72px);
  padding:40px clamp(32px,3.35vw,66px) 84px;
  display:block;
  overflow:visible;
  background:#10100e;
}
#wwadon .history-head{
  width:100%;
  height:34px;
  padding:0 0 16px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  border-bottom:1px solid rgba(238,233,223,.16);
  color:#77746d;
  font-size:8px;
  line-height:1;
  letter-spacing:.2em;
  text-transform:uppercase;
}
#wwadon .history-list{
  width:100%;
  min-height:0;
  overflow:visible;
}
#wwadon .history-item{
  position:relative;
  display:grid;
  grid-template-columns:minmax(78px,100px) minmax(0,894px);
  gap:clamp(24px,2.14vw,41px);
  min-height:0;
  padding:38px 0 40px;
  border-bottom:1px solid rgba(238,233,223,.12);
}
#wwadon .history-item:first-child{padding-top:42px}
#wwadon .history-date{
  position:relative;
  min-width:0;
  padding-top:3px;
  color:#b7a47b;
  font-size:8px;
  line-height:1.5;
  letter-spacing:.16em;
  text-transform:uppercase;
}
#wwadon .history-item::before{
  content:"";
  position:absolute;
  left:32px;
  top:47px;
  width:1px;
  height:calc(100% - 68px);
  border:0;
  border-radius:0;
  background:rgba(238,233,223,.16);
  box-shadow:none;
}
#wwadon .history-item:first-child::after{
  content:"";
  position:absolute;
  left:29px;
  top:44px;
  width:7px;
  height:7px;
  border:1px solid #e0b968;
  border-radius:50%;
  background:#10100e;
}
#wwadon .history-body{
  min-width:0;
  max-width:894px;
}
#wwadon .history-body h3{
  margin:0 0 13px;
  color:#eee9df;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(25px,2.2vw,34px);
  font-weight:400;
  line-height:1.05;
}
#wwadon .history-body p{
  max-width:894px;
  margin:0 0 30px;
  color:#aaa69d;
  font-size:12px;
  line-height:1.7;
  white-space:pre-line;
}
#wwadon .history-gallery{
  width:100%;
  max-width:894px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(20px,1.62vw,31px);
  margin-top:28px;
}
#wwadon .history-gallery-item{
  min-width:0;
  margin:0;
  aspect-ratio:278 / 209;
  overflow:hidden;
  background:#171714;
}
#wwadon .history-gallery-item img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
#wwadon .sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
@media(max-width:1000px){
  html.wwadon-route,body.wwadon-route{overflow-y:auto}
  body.wwadon-route main{margin-top:72px}
  #wwadon .wwadon-history{grid-template-columns:1fr;min-height:0}
  #wwadon .wwadon-history-intro{
    position:relative;
    top:auto;
    height:auto;
    min-height:46vh;
    padding:52px 7vw 58px;
    border-right:0;
    border-bottom:1px solid rgba(238,233,223,.13);
  }
  #wwadon .wwadon-history-panel{min-height:0;padding:34px 7vw 70px}
  #wwadon .history-item{grid-template-columns:90px minmax(0,1fr);gap:24px}
  #wwadon .history-gallery{gap:18px}
}
@media(max-width:650px){
  #wwadon .wwadon-history-intro{min-height:0;padding:38px 24px 46px}
  #wwadon .wwadon-history-intro h2{font-size:52px}
  #wwadon .wwadon-history-panel{padding:28px 24px 56px}
  #wwadon .history-item{grid-template-columns:1fr;gap:10px;padding:28px 0 34px}
  #wwadon .history-date{padding-top:0}
  #wwadon .history-item::before,#wwadon .history-item:first-child::after{display:none}
  #wwadon .history-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}
}
@media(max-width:430px){
  #wwadon .history-gallery{grid-template-columns:1fr}
}



/* ============================================================
   WWADON — FINAL CHRONICLE SCROLL / IMAGE VIEWER
   Desktop keeps one viewport with an independent chronology scroller.
   The text column and image grid share the exact same content width.
   ============================================================ */
@media(min-width:1001px){
  html.wwadon-route,body.wwadon-route{
    width:100%;
    height:100%;
    min-height:100%;
    overflow:hidden;
  }
  body.wwadon-route main{
    position:absolute;
    inset:72px 0 0;
    width:100%;
    height:calc(100vh - 72px);
    min-height:0;
    margin:0;
    overflow:hidden;
  }
  body.wwadon-route #wwadon.view.active{
    position:absolute;
    inset:0;
    display:block;
    overflow:hidden;
  }
  #wwadon .wwadon-history{
    width:100%;
    height:100%;
    min-height:0;
    grid-template-columns:minmax(320px,38vw) minmax(0,1fr);
    overflow:hidden;
  }
  #wwadon .wwadon-history-intro{
    height:100%;
    min-height:0;
    position:relative;
    top:auto;
    align-self:stretch;
  }
  #wwadon .wwadon-history-panel{
    height:100%;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  #wwadon .history-list{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }
}

#wwadon .history-body{
  width:min(100%,894px);
  max-width:894px;
  min-width:0;
}
#wwadon .history-body p{
  width:100%;
  max-width:894px;
  overflow-wrap:anywhere;
  word-break:break-word;
  hyphens:auto;
}
#wwadon .history-gallery{
  width:100%;
  max-width:894px;
}
#wwadon .history-gallery-item{
  min-width:0;
}
#wwadon .history-gallery-button{
  display:block;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  cursor:zoom-in;
}
#wwadon .history-gallery-button:focus-visible{
  outline:1px solid #e0b968;
  outline-offset:-1px;
}
#wwadon .history-gallery-button img{
  cursor:zoom-in;
}

/* Full-size WWADON image viewer. Native image dimensions are preserved;
   oversized originals can be inspected with the stage scrollbars. */
.wwadon-image-lightbox{
  position:fixed;
  z-index:1100;
  inset:0;
  display:none;
  padding:0;
  background:rgba(8,8,7,.97);
}
.wwadon-image-lightbox.open{display:block}
.wwadon-image-lightbox-stage{
  position:relative;
  width:100%;
  height:100%;
  overflow:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:34px;
  box-sizing:border-box;
  overscroll-behavior:contain;
}
.wwadon-image-lightbox-stage img{
  display:block;
  width:auto;
  height:auto;
  /* Open the stored source image, but scale it down only when necessary
     so the complete photograph is visible without cropping. */
  max-width:calc(100vw - 96px);
  max-height:calc(100vh - 96px);
  flex:0 0 auto;
  object-fit:contain;
}
.wwadon-image-lightbox-close{
  position:fixed;
  z-index:2;
  top:12px;
  right:18px;
  width:38px;
  height:38px;
  border:1px solid rgba(238,233,223,.35);
  background:rgba(8,8,7,.72);
  color:#eee9df;
  font:400 25px/1 Arial,sans-serif;
  cursor:pointer;
}
.wwadon-image-lightbox-close:hover{
  border-color:#eee9df;
  background:rgba(8,8,7,.9);
}
.wwadon-image-lightbox-close:focus-visible{
  outline:1px solid #e0b968;
  outline-offset:3px;
}

@media(max-width:1000px){
  html.wwadon-route,body.wwadon-route{height:auto;min-height:100%;overflow-y:auto}
  body.wwadon-route main{position:relative;inset:auto;height:auto;min-height:0;margin-top:72px;overflow:visible}
  body.wwadon-route #wwadon.view.active{position:relative;inset:auto;overflow:visible}
  #wwadon .wwadon-history-panel{overflow:visible}
  #wwadon .history-list{overflow:visible}
  #wwadon .history-body,#wwadon .history-body p,#wwadon .history-gallery{max-width:100%;width:100%}
  .wwadon-image-lightbox-stage{padding:22px}
}
\n\n/* ============================================================\n   WWADON — FINAL VISUAL REFINEMENT\n   Timeline marker is aligned to the date column. The chronology\n   remains the only desktop scroll container.\n   ============================================================ */\n@media(min-width:1001px){\n  #wwadon .history-item{\n    grid-template-columns:minmax(78px,100px) minmax(0,894px);\n    position:relative;\n  }\n  #wwadon .history-date{\n    position:relative;\n    z-index:2;\n    padding-top:3px;\n  }\n  #wwadon .history-item::before{\n    content:"";\n    position:absolute;\n    left:32px;\n    top:59px;\n    bottom:0;\n    width:1px;\n    height:auto;\n    background:rgba(183,164,123,.34);\n    border:0;\n    box-shadow:none;\n    pointer-events:none;\n  }\n  #wwadon .history-item::after{\n    content:"";\n    position:absolute;\n    left:28px;\n    top:47px;\n    width:8px;\n    height:8px;\n    box-sizing:border-box;\n    border:1px solid #756c59;\n    border-radius:50%;\n    background:#10100e;\n    box-shadow:0 0 0 4px #10100e;\n    pointer-events:none;\n  }\n  #wwadon .history-item:first-child::after{\n    border-color:#e0b968;\n    background:#e0b968;\n  }\n  #wwadon .history-item:last-child::before{\n    bottom:calc(100% - 59px);\n    height:0;\n  }\n}\n\n/* ============================================================\n   VISION — KARTA VISION / canonical desktop composition\n   The existing single-card data model is preserved. Only visual\n   geometry is refined to match the supplied reference image.\n   ============================================================ */\n@media(min-width:1001px){\n  #vision .vision-main{\n    width:calc(100% - 264px);\n    max-width:none;\n    padding:58px 0 34px;\n    margin:0 auto;\n  }\n\n  #vision .vision-main-head{\n    padding-left:0;\n  }\n\n  #vision .vision-main-head .eyebrow{\n    margin:0 0 19px;\n    font-size:9px;\n    line-height:1;\n    letter-spacing:.21em;\n  }\n\n  #vision .vision-main-head h2{\n    font-size:clamp(58px,5.2vw,82px);\n    line-height:.95;\n    letter-spacing:-.045em;\n  }\n\n  #vision .vision-main-head .vision-rule{\n    width:57px;\n    margin:28px 0 22px;\n  }\n\n  #vision .vision-main-row{\n    grid-template-columns:minmax(0,1fr) minmax(420px,35%);\n    gap:clamp(72px,6.3vw,122px);\n    align-items:start;\n  }\n\n  #vision .vision-main-copy{\n    height:clamp(360px,51vh,460px);\n    min-height:360px;\n    overflow:hidden;\n  }\n\n  #vision .vision-main-text{\n    max-width:780px;\n    padding:0 18px 24px 16px;\n    font-size:var(--vision-content-size,15px);\n    line-height:1.72;\n  }\n\n  #vision .vision-main-media{\n    width:100%;\n    height:clamp(360px,51vh,460px);\n    min-height:360px;\n    border:0;\n    border-radius:0;\n    background:#11130f;\n  }\n\n  #vision .vision-main-gallery-image img{\n    width:100%;\n    height:100%;\n    object-fit:cover;\n  }\n\n  #vision .vision-main-gallery-counter{\n    right:12px;\n    bottom:10px;\n    font-size:7px;\n  }\n}\n\n@media(max-width:1000px){\n  #vision .vision-main{\n    width:calc(100% - 48px);\n    max-width:none;\n  }\n}\n
/* ============================================================
   VISION — KARTA VISION / FINAL EDITORIAL CARD
   Reference geometry: editorial copy on the left, image + colour
   field on the right. Existing data, gallery and typography remain.
   ============================================================ */
@media (min-width:1001px){
  #vision.view{
    overflow-y:auto;
    overflow-x:hidden;
    background:#0d0f0d;
  }

  #vision .vision-main{
    width:auto;
    max-width:none;
    height:auto;
    min-height:100%;
    margin:0;
    padding:58px clamp(48px,2.5vw,48px) 48px clamp(48px,6.875vw,132px);
    overflow:visible;
  }

  #vision .vision-main-head{
    padding:0;
    margin:0;
  }

  #vision .vision-main-head .eyebrow{
    margin:0 0 18px;
    font-size:var(--vision-number-size,9px);
    line-height:1;
    letter-spacing:.21em;
  }

  #vision .vision-main-head h2{
    font-size:clamp(58px,4.8vw,78px);
    line-height:.95;
    letter-spacing:-.045em;
  }

  #vision .vision-main-head .vision-rule{
    width:57px;
    margin:27px 0 22px;
  }

  #vision .vision-main-row{
    width:100%;
    display:grid;
    grid-template-columns:minmax(620px,1fr) minmax(620px,830px);
    gap:clamp(72px,6.4vw,124px);
    align-items:start;
  }

  #vision .vision-main-copy{
    width:100%;
    height:clamp(400px,42.7vh,462px);
    min-height:400px;
    overflow:hidden;
  }

  #vision .vision-main-text{
    width:100%;
    max-width:800px;
    height:100%;
    padding:0 18px 24px 16px;
    margin:0;
    overflow-y:auto;
    overflow-x:hidden;
    font-size:var(--vision-content-size,15px);
    line-height:1.72;
    color:var(--vision-content-color,#d6d1c7);
  }

  #vision .vision-main-media{
    width:100%;
    height:clamp(400px,42.7vh,462px);
    min-height:400px;
    margin:0;
    border:0;
    border-radius:0;
    overflow:hidden;
    background:#71112f;
  }

  #vision .vision-main-gallery-track{
    width:100%;
    height:100%;
  }

  #vision .vision-main-gallery-image{
    display:grid;
    grid-template-columns:33.333% 66.667%;
    width:100%;
    height:100%;
    background:#71112f;
  }

  #vision .vision-main-gallery-image::after{
    content:"";
    grid-column:2;
    grid-row:1;
    background:#71112f;
  }

  #vision .vision-main-gallery-image img{
    grid-column:1;
    grid-row:1;
    width:100%;
    height:100%;
    min-width:0;
    min-height:0;
    object-fit:cover;
    display:block;
  }

  #vision .vision-main-gallery-counter{
    right:18px;
    bottom:12px;
    padding:0;
    background:transparent;
    color:rgba(238,233,223,.58);
    font-size:7px;
    letter-spacing:.14em;
  }

  /* The supplied reference has no CTA or public action list. */
  #vision .vision-read,
  #vision .vision-overview,
  #vision .vision-topics-wrap{
    display:none !important;
  }
}

@media (max-width:1000px){
  #vision.view{
    overflow-y:auto;
    overflow-x:hidden;
  }

  #vision .vision-main{
    height:auto;
    min-height:100%;
    overflow:visible;
  }

  #vision .vision-main-gallery-image{
    display:grid;
    grid-template-columns:33.333% 66.667%;
    background:#71112f;
  }

  #vision .vision-main-gallery-image::after{
    content:"";
    grid-column:2;
    grid-row:1;
    background:#71112f;
  }

  #vision .vision-main-gallery-image img{
    grid-column:1;
    grid-row:1;
    width:100%;
    height:100%;
    object-fit:cover;
  }
}

/* ============================================================
   WWADON — VISION CARD v2.1 / PSD GEOMETRY CORRECTION
   Source of truth: supplied VISION karta(6).jpg + Vision kart(3).psd.

   Desktop reference geometry at ~1920px viewport:
   - left composition edge: ~150px (aligned with end of WWADON logo)
   - right composition edge: ~42px (aligned with AUCTIONS navigation edge)
   - text viewport: fixed ~480px high; width is the primary variable
   - image viewport: fixed ~330px high, vertically centred against text
   - image uses the full image area; no colour panel / 1:3 image split
   - text scrollbar is on the LEFT edge of the text viewport
   ============================================================ */

@media (min-width:1001px){
  #vision.view{
    overflow-y:auto;
    overflow-x:hidden;
    background:#0d0f0d;
  }

  #vision .vision-main{
    width:auto;
    max-width:none;
    min-height:100%;
    height:auto;
    margin:0;
    padding:26px clamp(32px,2.2vw,42px) 80px clamp(56px,7.82vw,150px);
    overflow:visible;
  }

  /* VISION 1 / VISION starts on the exact same left construction line
     as the text viewport and the left scroll rail. */
  #vision .vision-main-head{
    margin:0;
    padding:0;
  }

  #vision .vision-main-head .eyebrow{
    margin:0 0 18px;
    font-size:var(--vision-number-size,9px);
    line-height:1;
    letter-spacing:.21em;
  }

  #vision .vision-main-head h2{
    margin:0;
    font-size:clamp(58px,4.15vw,72px);
    line-height:.95;
    letter-spacing:-.045em;
  }

  #vision .vision-main-head .vision-rule{
    width:57px;
    height:1px;
    margin:27px 0 21px;
  }

  #vision .vision-main-row{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1.38fr) minmax(500px,1fr);
    gap:clamp(72px,5.7vw,110px);
    align-items:center;
    /* Canonical V2.3 composition axis: text and image share one
       horizontal centreline and the complete row moves together. */
    transform:translate3d(0,clamp(0px,3.5vh,38px),0);
  }

  /* Height intentionally remains fixed. Only the horizontal measure
     expands to match the supplied reference. */
  #vision .vision-main-copy{
    width:100%;
    height:480px;
    min-height:480px;
    overflow:visible;
    min-width:0;
    position:relative;
  }

  /* Scroll rail belongs to the TEXT AREA and is on its LEFT edge. */
  #vision .vision-main-text{
    box-sizing:border-box;
    width:100%;
    max-width:none;
    height:100%;
    margin:0;
    padding:0 18px 18px 14px;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:#756c59 transparent;
    direction:rtl;
    color:var(--vision-content-color,#d6d1c7);
    font-size:var(--vision-content-size,15px);
    font-weight:var(--vision-content-weight,400);
    font-family:var(--vision-content-font,Arial,Helvetica,sans-serif);
    line-height:1.72;
    white-space:normal;
  }

  #vision .vision-main-text > #visionContentText{
    direction:ltr;
    text-align:left;
    white-space:pre-line;
    min-height:100%;
  }

  #vision .vision-main-text::-webkit-scrollbar{width:5px}
  #vision .vision-main-text::-webkit-scrollbar-track{background:transparent}
  #vision .vision-main-text::-webkit-scrollbar-thumb{background:#756c59;border-radius:8px}

  /* Image is deliberately smaller in height than the text viewport and
     vertically centred — exactly as in the PSD/JPG reference. */
  #vision .vision-main-media{
    position:relative;
    width:100%;
    height:330px;
    min-height:330px;
    margin:0;
    overflow:hidden;
    border:0;
    border-radius:0;
    background:#101510;
  }

  #vision .vision-main-gallery-track{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    will-change:transform;
    transform:translate3d(0,0,0);
    transition:transform .48s cubic-bezier(.22,.61,.36,1);
  }

  #vision .vision-main-gallery-image{
    position:relative;
    flex:0 0 100%;
    width:100%;
    height:100%;
    min-height:330px;
    display:block;
    overflow:hidden;
    background:#101510;
  }

  /* CRITICAL: the artwork fills the entire Image Area. */
  #vision .vision-main-gallery-image::after{display:none !important}

  #vision .vision-main-gallery-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
  }

  #vision .vision-main-gallery-counter{
    right:12px;
    bottom:10px;
    padding:0;
    background:transparent;
    color:rgba(238,233,223,.58);
    font-size:7px;
    letter-spacing:.14em;
  }
}

@media (min-width:1001px) and (max-width:1250px){
  #vision .vision-main{
    padding-left:clamp(48px,7.82vw,98px);
  }
  #vision .vision-main-row{
    grid-template-columns:minmax(0,1.25fr) minmax(430px,1fr);
    gap:64px;
  }
  #vision .vision-main-media{height:330px;min-height:330px}
}

@media (max-width:1000px){
  #vision.view{
    overflow-y:auto;
    overflow-x:hidden;
  }

  #vision .vision-main{
    height:auto;
    min-height:100%;
    overflow:visible;
    width:calc(100% - 48px);
    margin:0 auto;
    padding:24px 0 40px;
  }

  #vision .vision-main-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(240px,42%);
    gap:28px;
    align-items:center;
  }

  #vision .vision-main-copy{
    height:420px;
    min-height:420px;
  }

  #vision .vision-main-media{
    height:300px;
    min-height:300px;
  }
}

@media (max-width:760px){
  #vision .vision-main{
    width:calc(100% - 32px);
    padding:20px 0 32px;
  }

  #vision .vision-main-row{
    grid-template-columns:1fr;
    gap:18px;
    align-items:start;
  }

  #vision .vision-main-copy{
    height:auto;
    min-height:0;
  }

  #vision .vision-main-text{
    height:auto;
    max-height:none;
    overflow:visible;
    padding:0 0 0 14px;
    direction:ltr;
  }

  #vision .vision-main-text > #visionContentText{
    min-height:0;
  }

  #vision .vision-main-media{
    height:48vh;
    min-height:240px;
    max-height:420px;
  }
}

/* ============================================================
   WWADON — VISION CARD v2.1 / CENTER AXIS CORRECTION
   The complete VISION composition (header + text + image) is
   horizontally centered on the viewport axis. The internal
   geometry and fixed text/image heights remain unchanged.
   ============================================================ */
@media (min-width:1001px){
  #vision .vision-main{
    box-sizing:border-box;
    width:100%;
    margin-inline:auto;
    padding-left:clamp(32px,2.2vw,42px);
    padding-right:clamp(32px,2.2vw,42px);
  }

  #vision .vision-main-head,
  #vision .vision-main-row{
    width:min(100%, 1776px);
    margin-inline:auto;
  }
}

@media (min-width:1001px) and (max-width:1250px){
  #vision .vision-main{
    padding-left:clamp(48px,7.82vw,98px);
    padding-right:clamp(48px,3.36vw,42px);
  }
}

/* Keep the centered axis on the entire desktop range; no asymmetric
   horizontal padding at tablet/compact-desktop widths. */
@media (min-width:1001px) and (max-width:1250px){
  #vision .vision-main{
    padding-left:clamp(32px,3.2vw,48px);
    padding-right:clamp(32px,3.2vw,48px);
  }
}

/* ============================================================
   WWADON — VISION CARD v2.3 / RESPONSIVE COMPOSITION QA
   Responsive audit correction only. Desktop geometry above 1000px
   remains unchanged. Compact/tablet widths transition to a single
   vertical composition before the image becomes visually undersized.
   ============================================================ */
@media (min-width:821px) and (max-width:1000px){
  #vision .vision-main{
    width:calc(100% - 48px);
    max-width:1100px;
    margin-inline:auto;
    padding:32px 0 36px;
    overflow:visible;
  }

  #vision .vision-main-head,
  #vision .vision-main-row{
    width:100%;
    margin-inline:auto;
  }

  #vision .vision-main-head h2{
    font-size:clamp(54px,7.2vw,68px);
  }

  #vision .vision-main-row{
    grid-template-columns:minmax(0,1fr) minmax(280px,34vw);
    gap:clamp(28px,4vw,48px);
    align-items:start;
  }

  #vision .vision-main-copy,
  #vision .vision-main-media{
    height:clamp(300px,52vh,460px);
    min-height:300px;
  }
}

@media (max-width:820px){
  #vision.view{
    overflow-x:hidden;
    overflow-y:auto;
  }

  #vision .vision-main{
    box-sizing:border-box;
    width:calc(100% - 32px);
    max-width:none;
    min-height:100%;
    margin-inline:auto;
    padding:28px 0 40px;
    overflow:visible;
  }

  #vision .vision-main-head,
  #vision .vision-main-row{
    width:100%;
    margin-inline:auto;
  }

  #vision .vision-main-head .eyebrow{
    margin-bottom:14px;
  }

  #vision .vision-main-head h2{
    font-size:clamp(46px,12vw,68px);
    line-height:.94;
  }

  #vision .vision-main-head .vision-rule{
    width:57px;
    margin:22px 0 26px;
  }

  #vision .vision-main-row{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto;
    gap:28px;
    overflow:visible;
  }

  #vision .vision-main-copy{
    width:100%;
    height:auto;
    min-height:0;
    overflow:visible;
  }

  #vision .vision-main-text{
    width:100%;
    height:auto;
    max-width:none;
    max-height:none;
    overflow:visible;
    padding:0;
    overscroll-behavior:auto;
    scrollbar-width:none;
    line-height:1.72;
  }

  #vision .vision-main-text::-webkit-scrollbar{display:none}

  #vision .vision-main-media{
    width:100%;
    height:min(72vw,520px);
    min-height:260px;
    max-height:520px;
    overflow:hidden;
  }
}

@media (max-width:420px){
  #vision .vision-main{
    width:calc(100% - 24px);
    padding-top:24px;
    padding-bottom:32px;
  }

  #vision .vision-main-head h2{
    font-size:clamp(44px,13vw,58px);
  }

  #vision .vision-main-row{
    gap:24px;
  }

  #vision .vision-main-media{
    height:min(78vw,420px);
    min-height:240px;
  }
}

@media (max-width:360px){
  #vision .vision-main{
    width:calc(100% - 20px);
  }

  #vision .vision-main-head h2{
    font-size:46px;
  }

  #vision .vision-main-text{
    font-size:14px;
    line-height:1.68;
  }
}


/* ============================================================
   WWADON — VISION CARD / FINAL COMPOSITION LOCK
   V2.3 approved geometry.
   Desktop: the text viewport and artwork share the same vertical
   centreline; the complete row is lowered as one composition.
   The row itself remains horizontally centred to the viewport.
   Text viewport height is fixed; only its width may vary.
   Mobile/tablet intentionally keep their responsive composition.
   ============================================================ */
@media (min-width:1001px){
  #vision .vision-main{
    width:100%;
    max-width:none;
    margin-inline:auto;
    padding-left:clamp(32px,2.2vw,42px);
    padding-right:clamp(32px,2.2vw,42px);
    box-sizing:border-box;
  }

  #vision .vision-main-head,
  #vision .vision-main-row{
    width:min(100%,1776px);
    margin-inline:auto;
  }

  #vision .vision-main-row{
    align-items:center;
    transform:translate3d(0,clamp(0px,3.5vh,38px),0);
  }

  #vision .vision-main-copy{
    height:480px;
    min-height:480px;
  }

  #vision .vision-main-media{
    height:330px;
    min-height:330px;
  }
}

/* ============================================================
   ETAP 7 — SALES / CHECKOUT / ORDERS
   ============================================================ */
.order-account-panel{margin-top:28px;border-top:1px solid rgba(0,0,0,.12);padding-top:24px;}
.order-account-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:16px;}
.order-account-head h2{margin:4px 0 0;font-size:clamp(22px,2.2vw,34px);font-weight:400;letter-spacing:-.03em;}
.my-orders-list{display:grid;gap:10px;height:310px;max-height:310px;overflow-y:scroll;overflow-x:hidden;padding-right:10px;scrollbar-width:thin;scrollbar-color:#8f897d transparent;overscroll-behavior:contain;scroll-behavior:auto;}
.my-orders-list::-webkit-scrollbar{width:6px}
.my-orders-list::-webkit-scrollbar-track{background:transparent}
.my-orders-list::-webkit-scrollbar-thumb{background:#8f897d;border-radius:6px}
.my-order{display:grid;grid-template-columns:minmax(240px,1.45fr) minmax(100px,.65fr) minmax(90px,.55fr) minmax(150px,.8fr);gap:16px;align-items:center;padding:12px 0;border-top:1px solid rgba(0,0,0,.08);min-height:74px;}
.my-order strong{font-weight:500;}
.my-order-meta{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.65;}
.my-order-status{text-transform:uppercase;font-size:11px;letter-spacing:.1em;}
.my-order-action{text-align:right;}
.my-order-work{display:flex;align-items:center;gap:12px;min-width:0;}
.my-order-work-copy{min-width:0;display:flex;flex-direction:column;gap:5px;}
.my-order-work-copy strong{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.my-order-thumb{width:64px;height:48px;flex:0 0 64px;display:block;object-fit:cover;background:#10100e;border:1px solid rgba(0,0,0,.14);}
.my-order-thumb--placeholder{display:grid;place-items:center;color:#77746d;font-size:7px;letter-spacing:.12em;text-transform:uppercase;}
.checkout-message{margin-top:12px;font-size:12px;line-height:1.5;}
.checkout-message.is-error{color:#8b1e1e;}
@media(max-width:1000px){.my-order{grid-template-columns:minmax(210px,1.5fr) minmax(90px,.7fr) minmax(80px,.6fr);}.my-order-action{text-align:left;grid-column:2 / -1;}.my-orders-list{height:300px;max-height:300px;}}
@media(max-width:700px){.my-order{grid-template-columns:1fr 1fr;gap:10px;}.my-order-action{text-align:left;grid-column:auto;}.my-orders-list{height:280px;max-height:280px;}.my-order-thumb{width:56px;height:44px;flex-basis:56px;}.my-order-meta{font-size:10px;}}

.sales-ops-admin{margin-top:24px;padding:20px;}
.sales-ops-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.sales-ops-list{margin-top:10px;display:grid;gap:8px;}
.sales-ops-row{display:grid;grid-template-columns:1.2fr .7fr .7fr .8fr;gap:10px;align-items:center;border-top:1px solid rgba(0,0,0,.08);padding:11px 0;font-size:12px;}
.sales-ops-row div{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sales-ops-row span{display:block;font-size:9px;opacity:.45;overflow:hidden;text-overflow:ellipsis;}
@media(max-width:900px){.sales-ops-grid{grid-template-columns:1fr;}.sales-ops-row{grid-template-columns:1fr 1fr;}}

.sales-ops-admin{margin-top:24px;padding:20px;}
.sales-ops-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.sales-ops-list{margin-top:10px;display:grid;gap:8px;}
.sales-ops-row{display:grid;grid-template-columns:1.2fr .7fr .7fr .8fr;gap:10px;align-items:center;border-top:1px solid rgba(0,0,0,.08);padding:11px 0;font-size:12px;}
.sales-ops-row div{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sales-ops-row span{display:block;font-size:9px;opacity:.45;overflow:hidden;text-overflow:ellipsis;}
@media(max-width:900px){.sales-ops-grid{grid-template-columns:1fr;}.sales-ops-row{grid-template-columns:1fr 1fr;}}

/* ============================================================
   WWADON — RESPONSIVE RWD IMPLEMENTATION
   Based on WWADON_RESPONSIVE_REPAIR_INSTRUCTION.md
   This layer establishes the responsive composition model without
   changing application/data/security logic. Desktop geometry above
   1024px remains the visual baseline; smaller viewports reflow into
   normal document flow instead of shrinking/overflowing desktop layout.
   ============================================================ */
@media (max-width: 1024px){
  html,body{
    width:100%;
    min-width:0;
    height:auto;
    min-height:100%;
    overflow-x:hidden;
    overflow-y:auto;
  }
  body{padding:0;}
  header{
    height:auto;
    min-height:64px;
    padding:10px 20px;
    gap:16px;
    flex-wrap:wrap;
  }
  .logo{
    min-width:0;
    max-width:58vw;
    font-size:clamp(17px,4vw,21px);
    line-height:1.1;
    white-space:normal;
  }
  .logo small{
    display:block;
    margin:6px 0 0;
    max-width:100%;
    font-size:7px;
    line-height:1.35;
    white-space:normal;
  }
  header nav,
  header nav.home-geometry-nav{
    position:static;
    width:auto;
    left:auto;
    top:auto;
    transform:none;
    display:flex;
    flex:1 1 auto;
    min-width:0;
    justify-content:flex-end;
    align-items:center;
    gap:clamp(10px,3vw,22px);
  }
  header nav a,
  header nav.home-geometry-nav a{
    min-width:0;
    padding:10px 2px;
    font-size:clamp(8px,1.7vw,10px);
    line-height:1.1;
    text-align:center;
    white-space:nowrap;
  }
  main{
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    min-height:calc(100vh - 64px);
    margin-top:64px;
  }
  .view,
  .view.active{
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    min-height:calc(100vh - 64px);
    overflow:visible;
  }
  .view:not(.active){display:none;}
  .view.active{display:block;}

  /* HOME: deliberate vertical composition, not a scaled desktop canvas. */
  #home .home{
    width:100%;
    height:auto;
    min-height:calc(100vh - 64px);
    display:flex;
    flex-direction:column;
  }
  #home .home-intro{
    display:flex;
    width:100%;
    min-height:0;
    padding:clamp(32px,7vw,56px) clamp(20px,6vw,48px);
    justify-content:flex-start;
  }
  #home .home-intro h1{
    font-size:clamp(42px,11vw,68px);
    line-height:.96;
    margin-bottom:20px;
  }
  #home .home-intro p{
    max-width:48rem;
    font-size:clamp(13px,2vw,15px);
    line-height:1.7;
  }
  #home .home-note{margin-top:28px;}
  #home .home-contact{margin-bottom:0;}
  #home .featured{
    width:100%;
    height:auto;
    min-height:0;
    overflow:visible;
  }
  #home .slider{
    width:100%;
    height:auto;
    align-items:flex-start;
  }
  #home .slide{
    min-width:100%;
    width:100%;
    height:auto;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto;
    align-content:start;
  }
  #home .art-visual{
    width:100%;
    height:clamp(280px,72vw,560px);
    min-height:0;
    max-height:72vh;
  }
  #home .art-visual img{
    width:100%;
    height:100%;
    max-width:100%;
    object-fit:contain;
  }
  #home .slide-info{
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    min-height:0;
    padding:clamp(22px,5vw,34px) clamp(20px,6vw,42px) clamp(30px,6vw,46px);
    background:#171714;
    overflow:visible;
  }
  #home .slide-info-inner{
    position:relative;
    inset:auto;
    width:100%;
    min-height:0;
    display:grid;
    grid-template-rows:max-content auto max-content;
    row-gap:18px;
    overflow:visible;
  }
  #home .slide-info-description{
    max-height:none;
    overflow:visible;
    padding:0;
  }
  #home .slide-info-bottom{
    align-items:flex-start;
    justify-content:flex-start;
  }
  #home .slide-info-bottom .price{text-align:left;}
  #home .slide-info-bottom .collect{align-self:flex-start;}
  #home .slider-controls{
    position:relative;
    right:auto;
    bottom:auto;
    justify-content:flex-end;
    padding:12px 20px 20px;
    background:#10100e;
  }

  /* VISION */
  #vision .vision-main{
    box-sizing:border-box;
    width:100%;
    max-width:none;
    min-height:calc(100vh - 64px);
    margin:0;
    padding:clamp(28px,6vw,48px) clamp(20px,5vw,48px) 44px;
    overflow:visible;
  }
  #vision .vision-main-head,
  #vision .vision-main-row{width:100%;margin-inline:auto;}
  #vision .vision-main-head h2{
    font-size:clamp(44px,12vw,72px);
    line-height:.94;
  }
  #vision .vision-main-row{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:clamp(24px,5vw,36px);
    align-items:start;
    transform:none;
  }
  #vision .vision-main-copy{
    width:100%;
    height:auto;
    min-height:0;
    overflow:visible;
  }
  #vision .vision-main-text{
    width:100%;
    height:auto;
    max-height:none;
    padding:0;
    overflow:visible;
    direction:ltr;
    font-size:clamp(14px,2.2vw,16px);
    line-height:1.72;
  }
  #vision .vision-main-media{
    width:100%;
    height:auto;
    min-height:0;
    aspect-ratio:16 / 10;
    max-height:none;
  }
  #vision .vision-main-gallery-image,
  #vision .vision-main-gallery-image img{
    width:100%;
    height:100%;
  }

  /* AUCTIONS */
  #auctions .auctions-page{
    width:100%;
    height:auto;
    min-height:calc(100vh - 64px);
    display:flex;
    flex-direction:column;
    overflow:visible;
  }
  #auctions .auctions-hero{
    width:100%;
    height:auto;
    min-height:0;
    padding:clamp(34px,7vw,60px) clamp(20px,6vw,48px) 34px;
    border-right:0;
    border-bottom:1px solid rgba(238,233,223,.13);
  }
  #auctions .auctions-hero h1{font-size:clamp(44px,12vw,72px);}
  #auctions .auctions-hero>p{max-width:48rem;}
  #auctions .auction-account{max-width:none;}
  #auctions .auctions-catalogue{
    width:100%;
    height:auto;
    min-height:0;
    padding:28px clamp(16px,5vw,42px) 38px;
    overflow:visible;
  }
  #auctions .auctions-toolbar{
    align-items:stretch;
    flex-direction:column;
    gap:18px;
  }
  #auctions .auction-controls{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  #auctions .auction-search{grid-column:1 / -1;min-width:0;}
  #auctions .auction-search input,
  #auctions .auction-select select{width:100%;min-width:0;max-width:100%;}
  #auctions .auction-grid{
    width:100%;
    grid-template-columns:repeat(2,minmax(0,1fr));
    overflow:visible;
    padding:20px 0 30px;
  }

  /* Artwork modal: vertical flow with independently scrollable copy. */
  .modal{
    align-items:stretch;
    justify-content:stretch;
    padding:8px;
    overflow:auto;
  }
  .modal-box{
    width:100%;
    height:auto;
    min-height:calc(100vh - 16px);
    max-height:none;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr);
    overflow:hidden;
  }
  .modal-image{
    width:100%;
    height:min(68vh,560px);
    min-height:220px;
    padding:8px;
  }
  .modal-copy{
    width:100%;
    height:auto;
    min-height:0;
    padding:24px clamp(18px,5vw,30px) 30px;
    overflow:auto;
  }
  .modal-copy h2{font-size:clamp(28px,8vw,40px);}
  .artwork-description,
  .artwork-story{
    height:auto;
    max-height:none;
    flex:0 0 auto;
    overflow:visible;
  }
  .wwadon-image-lightbox-stage{padding:16px;}
  .wwadon-image-lightbox-stage img{
    max-width:calc(100vw - 32px);
    max-height:calc(100vh - 32px);
  }
}

@media (max-width: 700px){
  header{
    min-height:60px;
    padding:9px 14px;
    gap:8px;
  }
  .logo{max-width:43vw;font-size:16px;letter-spacing:.16em;}
  .logo small{font-size:6px;letter-spacing:.18em;}
  header nav,
  header nav.home-geometry-nav{gap:7px;}
  header nav a,
  header nav.home-geometry-nav a{
    padding:10px 1px;
    font-size:8px;
    letter-spacing:.08em;
  }
  main{margin-top:60px;min-height:calc(100vh - 60px);}
  .view,.view.active{min-height:calc(100vh - 60px);}

  #home .home-intro{padding:30px 18px 34px;}
  #home .home-intro h1{font-size:clamp(40px,12vw,56px);}
  #home .home-intro p{font-size:13px;line-height:1.68;}
  #home .art-visual{height:min(76vw,430px);}
  #home .slide-info{padding:22px 18px 30px;}
  #home .slide-info h2{font-size:clamp(27px,8vw,36px);}
  #home .slide-info-description{font-size:12px;line-height:1.65;}
  #home .slider-controls{padding:10px 14px 16px;}

  #vision .vision-main{padding:24px 16px 36px;}
  #vision .vision-main-head .eyebrow{margin-bottom:12px;}
  #vision .vision-main-head h2{font-size:clamp(42px,14vw,58px);}
  #vision .vision-main-row{gap:22px;}
  #vision .vision-main-text{font-size:14px;line-height:1.68;}
  #vision .vision-main-media{aspect-ratio:4 / 3;}

  #auctions .auctions-hero{padding:30px 18px 28px;}
  #auctions .auctions-catalogue{padding:24px 14px 30px;}
  #auctions .auction-controls{grid-template-columns:1fr;}
  #auctions .auction-search{grid-column:auto;}
  #auctions .auction-grid{grid-template-columns:1fr;gap:14px;}
  #auctions .auction-card{min-width:0;}
  #auctions .auction-account-row{align-items:flex-start;flex-direction:column;gap:12px;}
  #auctions .auth-actions{width:100%;justify-content:flex-start;}
  #auctions .auth-button{min-height:42px;}

  .modal{padding:0;}
  .modal-box{min-height:100vh;}
  .modal-image{height:min(62vh,420px);min-height:210px;}
  .modal-copy{padding:22px 18px 28px;}

  .wwadon-image-lightbox-stage{padding:12px;}
  .wwadon-image-lightbox-stage img{max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);}
  .wwadon-image-lightbox-close{top:8px;right:8px;width:42px;height:42px;}
}

@media (max-width: 430px){
  #home .home-intro{padding:26px 16px 30px;}
  #home .home-intro h1{font-size:clamp(38px,12.5vw,52px);}
  #home .home-intro p{font-size:12.5px;}
  #home .art-visual{height:min(82vw,390px);}
  #home .slide-info{padding:20px 16px 28px;}
  #home .slide-info .number{margin-bottom:12px;font-size:9px;}
  #home .slide-info h2{font-size:30px;margin-bottom:10px;}
  #home .slide-info-description{font-size:11.5px;}
  #home .slide-info-bottom .price{font-size:14px;}
  #home .slide-info-bottom .collect{width:100%;text-align:center;}

  #vision .vision-main{padding:22px 12px 32px;}
  #vision .vision-main-head h2{font-size:clamp(40px,14vw,54px);}
  #vision .vision-main-media{aspect-ratio:1 / .82;min-height:230px;}

  #auctions .auctions-hero{padding:28px 16px 26px;}
  #auctions .auctions-catalogue{padding-inline:12px;}

  .auth-dialog{width:calc(100vw - 20px);max-width:none;}
  .auth-dialog-card{padding:32px 20px 26px;}
  .auth-dialog-card h2{font-size:32px;}
}

@media (max-width: 360px){
  header{padding-inline:10px;}
  .logo{max-width:40vw;font-size:15px;}
  header nav,
  header nav.home-geometry-nav{gap:4px;}
  header nav a,
  header nav.home-geometry-nav a{font-size:7px;letter-spacing:.05em;}
  #home .home-intro{padding-inline:14px;}
  #home .home-intro h1{font-size:40px;}
  #home .art-visual{height:290px;}
  #vision .vision-main{padding-inline:10px;}
  #vision .vision-main-head h2{font-size:42px;}
  #vision .vision-main-text{font-size:13.5px;}
  #auctions .auctions-hero{padding-inline:14px;}
  #auctions .auctions-catalogue{padding-inline:10px;}
}

@media (orientation: landscape) and (max-width: 1024px){
  /* Landscape has less vertical space: keep header compact and use a
     two-column media/info composition on HOME, while other routes remain
     vertically scrollable. */
  header{min-height:54px;padding-block:7px;}
  .logo small{display:inline;margin:0 0 0 8px;white-space:normal;}
  main{margin-top:54px;}
  .view,.view.active{min-height:calc(100vh - 54px);}

  #home .home{min-height:calc(100vh - 54px);}
  #home .home-intro{padding:24px 28px;}
  #home .home-intro h1{font-size:clamp(34px,6vw,54px);}
  #home .featured{display:block;}
  #home .art-visual{height:min(62vw,360px);}
  #home .slide-info{padding:20px 28px 28px;}

  #vision .vision-main{padding-top:22px;padding-bottom:30px;}
  #vision .vision-main-row{grid-template-columns:minmax(0,1.05fr) minmax(260px,.95fr);gap:28px;align-items:center;}
  #vision .vision-main-media{aspect-ratio:16 / 10;}

  #auctions .auctions-hero{padding-top:26px;padding-bottom:26px;}
  #auctions .auctions-catalogue{padding-top:22px;}

  .modal-box{grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);grid-template-rows:1fr;min-height:calc(100vh - 12px);}
  .modal-image{height:100%;min-height:0;}
  .modal-copy{height:100%;overflow:auto;}
}

/* Responsive safety invariant: flex/grid children must be allowed to shrink. */
@media (max-width: 1024px){
  header *,main *,#home .slide *,#vision .vision-main *,#auctions .auctions-page *{min-width:0;}
  img,svg,video,canvas{max-width:100%;}
  button,input,select,textarea{max-width:100%;}
  p,h1,h2,h3,h4,h5,h6{overflow-wrap:anywhere;}
}


/* ============================================================
   WWADON VISION CARD — REFERENCE IMPLEMENTATION
   Restores VISION KART composition:
   cinematic background, centered title hierarchy,
   two editorial information blocks, bottom landscape field.
   ============================================================ */

#vision.view{
  background:#080b09;
}

#vision .vision-main{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  position:relative;
  height:100%;
}

#vision .vision-main::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:42%;
  background:
    linear-gradient(180deg,rgba(8,11,9,0),rgba(8,11,9,.45)),
    var(--vision-background-image);
  background-size:cover;
  background-position:center bottom;
  z-index:0;
  pointer-events:none;
}

#vision .vision-main-head{
  position:relative;
  z-index:2;
  padding:68px clamp(42px,8vw,132px) 0;
}

#vision .vision-main-head .eyebrow{
  color:#b7a47b;
  margin-bottom:22px;
}

#vision .vision-main-head h2{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:300;
  font-size:clamp(48px,4.4vw,70px);
  letter-spacing:.08em;
  text-transform:uppercase;
  line-height:1;
}

#vision .vision-main-head .vision-rule{
  margin:30px 0 0;
  width:36px;
}

#vision .vision-main-card{
  position:relative;
  z-index:2;
  height:auto;
}

#vision .vision-main-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(70px,10vw,160px);
  padding:70px clamp(42px,8vw,132px) 0;
  transform:none;
}

#vision .vision-main-copy,
#vision .vision-main-media{
  height:300px;
  min-height:300px;
}

#vision .vision-main-copy{
  overflow:hidden;
}

#vision .vision-main-text{
  max-width:560px;
  font-size:15px;
  line-height:1.85;
  color:#dedbd3;
  padding-right:20px;
}

#vision .vision-main-media{
  border:0;
  background:transparent;
}

#vision .vision-main-gallery-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:brightness(.72) saturate(.75);
}

@media(max-width:900px){
  #vision .vision-main-head{
    padding:42px 28px 0;
  }

  #vision .vision-main-row{
    grid-template-columns:1fr;
    gap:32px;
    padding:40px 28px 0;
  }

  #vision .vision-main-copy,
  #vision .vision-main-media{
    height:260px;
    min-height:260px;
  }

  #vision .vision-main::after{
    height:35%;
  }
}


/* ============================================================
   WWADON VISION CARD — TARGET PRODUCTION IMPLEMENTATION
   Source of truth: supplied clean JPG/PSD + implementation spec.
   ============================================================ */
#vision.view{
  --vision-gold:#c9a15c;
  --vision-paper:#eee9df;
  --vision-muted:#aaa69d;
  --vision-line:rgba(201,161,92,.46);
  --vision-text-align:left;
  background:#050707;
  color:var(--vision-paper);
  overflow:hidden;
}
#vision .vision-card-layout{
  position:relative;
  width:100%;
  height:100%;
  min-height:100%;
  overflow:hidden;
  isolation:isolate;
  background:var(--vision-base-background,#10110f);
}
#vision .vision-background{
  position:absolute;
  inset:72px 0 0;
  z-index:0;
  overflow:hidden;
  background:var(--vision-base-background,#10110f);
}
#vision .vision-background img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center bottom;
  opacity:var(--vision-background-opacity,100%);
  filter:saturate(.94) contrast(1.03) brightness(.94);
}
#vision .vision-atmosphere{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 92% 62%,rgba(201,161,92,.10),transparent 24%),
    linear-gradient(180deg,rgba(5,7,7,.34) 0%,rgba(5,7,7,.16) 42%,rgba(5,7,7,.02) 64%,rgba(5,7,7,.24) 100%),
    linear-gradient(90deg,rgba(5,7,7,.16),transparent 58%);
}
#vision .vision-content{
  position:relative;
  z-index:2;
  width:min(100%,1671px);
  height:100%;
  min-height:0;
  margin-inline:auto;
  padding:clamp(52px,6.1vh,78px) clamp(48px,7.6vw,128px) 92px;
  display:grid;
  grid-template-columns:minmax(430px,.98fr) minmax(560px,.92fr);
  grid-template-rows:auto minmax(0,1fr);
  column-gap:clamp(70px,7vw,128px);
}
#vision .vision-card-head{
  grid-column:1;
  grid-row:1;
  align-self:start;
  min-width:0;
}
#vision .vision-eyebrow-row{
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:20px;
}
#vision .vision-card-head .eyebrow{
  margin:0;
  color:var(--vision-gold);
  font-size:clamp(10px,.76vw,13px);
  line-height:1;
  letter-spacing:.31em;
  text-transform:uppercase;
}
#vision .vision-eyebrow-line{
  width:36px;
  height:1px;
  background:var(--vision-gold);
  opacity:.72;
}
#vision .vision-card-head h1{
  margin:0;
  max-width:760px;
  color:var(--vision-paper);
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(42px,3.55vw,61px);
  font-weight:400;
  line-height:1.04;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#vision .vision-card-head h1{font-size:var(--vision-cms-size,clamp(42px,3.55vw,61px));font-weight:var(--vision-cms-weight,400);font-family:var(--vision-cms-font,Georgia,'Times New Roman',serif);color:var(--vision-cms-color,var(--vision-paper));text-align:var(--vision-cms-align,left)}
#vision .vision-card-head h1 span{color:var(--vision-gold)}
#vision .vision-subtitle{
  margin:24px 0 0;
  color:#a7a8a4;
  font-size:clamp(11px,.82vw,14px);
  line-height:1.2;
  letter-spacing:.43em;
  text-transform:uppercase;
}
#vision .vision-cards{
  grid-column:2;
  grid-row:1 / 3;
  align-self:start;
  justify-self:end;
  width:min(100%,690px);
  padding-top:clamp(94px,13vh,132px);
  display:flex;
  flex-direction:column;
  gap:clamp(34px,5.5vh,58px);
}
#vision .vision-statement-card{
  display:grid;
  grid-template-columns:clamp(128px,9.2vw,158px) 1px minmax(0,1fr);
  align-items:center;
  gap:clamp(28px,2.6vw,42px);
  min-width:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--vision-paper);
  text-align:var(--vision-text-align,left);
}
#vision .statement-icon{
  width:100%;
  aspect-ratio:1;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}
#vision .statement-icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 0 10px rgba(201,161,92,.08));
}
#vision .statement-divider{
  width:1px;
  height:clamp(132px,18vh,190px);
  align-self:center;
  background:var(--vision-line);
}
#vision .statement-content{min-width:0}
#vision .statement-number{
  display:block;
  margin:0 0 16px;
  color:var(--vision-gold);
  font-size:clamp(12px,.9vw,15px);
  line-height:1;
  letter-spacing:.31em;
  text-transform:uppercase;
}
#vision .vision-statement-card h2{
  margin:0 0 18px;
  color:var(--vision-paper);
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(30px,2.25vw,39px);
  font-weight:400;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  text-align:var(--vision-text-align,left);
}
#vision .vision-statement-card p{
  margin:0;
  max-width:470px;
  color:#d4d0c7;
  font-size:clamp(16px,1.22vw,21px);
  line-height:1.48;
  letter-spacing:.015em;
  text-align:var(--vision-text-align,left);
  text-wrap:pretty;
}
#vision .vision-footer-line{
  position:absolute;
  z-index:2;
  left:50%;
  bottom:clamp(24px,3.2vh,34px);
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  width:max-content;
  max-width:calc(100% - 48px);
  color:#dad7cf;
  font-size:clamp(8px,.64vw,11px);
  line-height:1;
  letter-spacing:.34em;
  text-transform:uppercase;
  white-space:nowrap;
  text-shadow:0 1px 8px rgba(0,0,0,.8);
}
#vision .vision-footer-line::before,
#vision .vision-footer-line::after{
  content:"";
  width:62px;
  height:1px;
  flex:none;
  background:var(--vision-gold);
  opacity:.82;
}


/* VISION CMS — per-element typography controls */
#vision .vision-eyebrow-row .eyebrow{
  font-size:var(--vision-cms-size,clamp(10px,.76vw,13px));
  font-weight:var(--vision-cms-weight,400);
  font-family:var(--vision-cms-font,Arial,Helvetica,sans-serif);
  color:var(--vision-cms-color,var(--vision-gold));
  text-align:var(--vision-cms-align,left);
}
#vision .vision-subtitle{
  font-size:var(--vision-cms-size,clamp(11px,.82vw,14px));
  font-weight:var(--vision-cms-weight,400);
  font-family:var(--vision-cms-font,Arial,Helvetica,sans-serif);
  color:var(--vision-cms-color,#a7a8a4);
  text-align:var(--vision-cms-align,left);
}
#vision .mission-card .statement-number,#vision .vision-card .statement-number{
  font-size:var(--vision-cms-size,clamp(12px,.9vw,15px));
  font-weight:var(--vision-cms-weight,400);
  font-family:var(--vision-cms-font,Arial,Helvetica,sans-serif);
  color:var(--vision-cms-color,var(--vision-gold));
  text-align:var(--vision-cms-align,left);
}
#vision .mission-card h2,#vision .vision-card h2{
  font-size:var(--vision-cms-size,clamp(30px,2.25vw,39px));
  font-weight:var(--vision-cms-weight,400);
  font-family:var(--vision-cms-font,Georgia,'Times New Roman',serif);
  color:var(--vision-cms-color,var(--vision-paper));
  text-align:var(--vision-cms-align,left);
}
#vision .mission-card p,#vision .vision-card p{
  font-size:var(--vision-cms-size,clamp(16px,1.22vw,21px));
  font-weight:var(--vision-cms-weight,400);
  font-family:var(--vision-cms-font,Arial,Helvetica,sans-serif);
  color:var(--vision-cms-color,#d4d0c7);
  text-align:var(--vision-cms-align,left);
}
#vision .vision-footer-line{
  font-size:var(--vision-cms-size,clamp(8px,.64vw,11px));
  font-weight:var(--vision-cms-weight,400);
  font-family:var(--vision-cms-font,Arial,Helvetica,sans-serif);
  color:var(--vision-cms-color,#dad7cf);
  text-align:var(--vision-cms-align,center);
}

/* Desktop 1280–1439 */
@media (max-width:1439px){
  #vision .vision-content{
    padding-inline:clamp(42px,6.2vw,86px);
    grid-template-columns:minmax(390px,.92fr) minmax(520px,1fr);
    column-gap:56px;
  }
  #vision .vision-card-head h1{font-size:clamp(39px,3.55vw,51px)}
  #vision .vision-cards{width:min(100%,620px);padding-top:90px;gap:34px}
  #vision .vision-statement-card{grid-template-columns:128px 1px minmax(0,1fr);gap:28px}
  #vision .statement-divider{height:142px}
}

/* Tablet landscape 1024–1279 */
@media (max-width:1279px){
  #vision .vision-content{
    padding:46px 5vw 82px;
    grid-template-columns:minmax(340px,.86fr) minmax(455px,1fr);
    column-gap:42px;
  }
  #vision .vision-card-head h1{font-size:clamp(34px,3.65vw,46px);white-space:normal;max-width:520px}
  #vision .vision-subtitle{letter-spacing:.34em}
  #vision .vision-cards{width:100%;padding-top:76px;gap:32px}
  #vision .vision-statement-card{grid-template-columns:108px 1px minmax(0,1fr);gap:23px}
  #vision .statement-divider{height:128px}
  #vision .vision-statement-card h2{font-size:30px;margin-bottom:13px}
  #vision .vision-statement-card p{font-size:16px;line-height:1.45}
}

/* Tablet portrait 768–1023: intentionally reflow into a vertical editorial composition. */
@media (max-width:1023px){
  #vision.view{overflow:auto}
  #vision .vision-card-layout{height:auto;min-height:calc(100vh - 72px);overflow:hidden}
  #vision .vision-background{inset:72px 0 0}
  #vision .vision-background img{object-position:68% bottom}
  #vision .vision-atmosphere{
    background:linear-gradient(180deg,rgba(5,7,7,.52) 0%,rgba(5,7,7,.26) 52%,rgba(5,7,7,.10) 76%,rgba(5,7,7,.36) 100%);
  }
  #vision .vision-content{
    height:auto;
    min-height:calc(100vh - 72px);
    padding:44px clamp(28px,7vw,64px) 128px;
    display:block;
  }
  #vision .vision-card-head{max-width:720px}
  #vision .vision-card-head h1{max-width:700px;font-size:clamp(38px,6.2vw,56px)}
  #vision .vision-cards{
    width:min(100%,700px);
    margin:clamp(54px,7vw,72px) 0 0 auto;
    padding:0;
    gap:40px;
  }
  #vision .vision-statement-card{grid-template-columns:118px 1px minmax(0,1fr);gap:28px}
  #vision .statement-divider{height:136px}
  #vision .vision-footer-line{position:absolute;bottom:28px}
}

/* Mobile landscape 568–767 */
@media (max-width:767px){
  #vision .vision-card-layout{min-height:760px}
  #vision .vision-background img{object-position:72% bottom}
  #vision .vision-content{padding:34px 28px 126px;min-height:760px}
  #vision .vision-eyebrow-row{margin-bottom:16px}
  #vision .vision-card-head h1{font-size:clamp(31px,7vw,44px);line-height:1.08;letter-spacing:.045em}
  #vision .vision-subtitle{margin-top:18px;font-size:10px;letter-spacing:.28em}
  #vision .vision-cards{margin-top:44px;gap:34px}
  #vision .vision-statement-card{grid-template-columns:96px 1px minmax(0,1fr);gap:20px}
  #vision .statement-divider{height:118px}
  #vision .statement-number{margin-bottom:11px;font-size:11px}
  #vision .vision-statement-card h2{font-size:26px;margin-bottom:11px}
  #vision .vision-statement-card p{font-size:15px;line-height:1.43}
  #vision .vision-footer-line{bottom:24px;gap:12px;font-size:8px;letter-spacing:.21em}
  #vision .vision-footer-line::before,#vision .vision-footer-line::after{width:34px}
}

/* Mobile portrait 390–567 */
@media (max-width:567px){
  #vision .vision-card-layout{min-height:920px}
  #vision .vision-background img{object-position:76% bottom}
  #vision .vision-content{padding:32px 22px 116px;min-height:920px}
  #vision .vision-card-head h1{font-size:clamp(30px,9.5vw,42px);white-space:normal}
  #vision .vision-subtitle{max-width:100%;font-size:9px;letter-spacing:.22em}
  #vision .vision-cards{width:100%;margin-top:44px;gap:42px}
  #vision .vision-statement-card{
    grid-template-columns:84px minmax(0,1fr);
    grid-template-areas:"icon content";
    gap:22px;
    align-items:start;
  }
  #vision .statement-icon{grid-area:icon;margin-top:19px}
  #vision .statement-divider{display:none}
  #vision .statement-content{grid-area:content;padding-left:18px;border-left:1px solid var(--vision-line)}
  #vision .statement-number{font-size:10px;margin-bottom:10px}
  #vision .vision-statement-card h2{font-size:24px;letter-spacing:.13em}
  #vision .vision-statement-card p{font-size:14px;line-height:1.5;color:#d9d5cc}
  #vision .vision-footer-line{max-width:calc(100% - 28px);font-size:7px;letter-spacing:.14em;gap:8px}
  #vision .vision-footer-line::before,#vision .vision-footer-line::after{width:20px}
}

/* Small mobile 320–389 */
@media (max-width:389px){
  #vision .vision-card-layout{min-height:900px}
  #vision .vision-content{padding:28px 16px 106px;min-height:900px}
  #vision .vision-card-head h1{font-size:29px;letter-spacing:.032em}
  #vision .vision-subtitle{font-size:8px;letter-spacing:.17em}
  #vision .vision-cards{margin-top:38px;gap:36px}
  #vision .vision-statement-card{grid-template-columns:72px minmax(0,1fr);gap:16px}
  #vision .statement-content{padding-left:14px}
  #vision .vision-statement-card h2{font-size:22px}
  #vision .vision-statement-card p{font-size:13px}
  #vision .vision-footer-line{font-size:6.5px;letter-spacing:.09em;gap:6px}
  #vision .vision-footer-line::before,#vision .vision-footer-line::after{width:14px}
}

@media (prefers-reduced-motion:reduce){
  #vision *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}



/* ============================================================
   VISION CARD — USER REQUESTED COMPOSITION ADJUSTMENTS
   ============================================================ */

/* The Vision canvas owns the full viewport. The landscape continues
   behind the global header so there is no hard horizontal seam. */
html.vision-route,
body.vision-route{background:#050707}
body.vision-route header{
  background:#10110f;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom-color:transparent;
  box-shadow:none;
}
body.vision-route header::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  height:52px;
  pointer-events:none;
  background:linear-gradient(180deg,#10110f 0%,rgba(16,17,15,.78) 28%,rgba(16,17,15,.24) 68%,rgba(16,17,15,0) 100%);
}
body.vision-route main{inset:0}
body.vision-route #vision.view{inset:0}
body.vision-route #vision .vision-card-layout{min-height:100vh}

/* Desktop composition:
   Mission group = exactly 0.5in / 48 CSS px lower.
   Header/title group = left-shifted toward the requested 3in target,
   with a safe boundary so the H1 never becomes clipped. */
@media (min-width:1440px){
  #vision .vision-card-head{
    position:relative;
    left:max(-3in, calc((100vw - 1680px) / -2));
  }
  #vision .mission-card{transform:translateY(48px)}
  #vision .vision-background img{object-position:center bottom}
}
@media (min-width:1024px) and (max-width:1439px){
  #vision .vision-card-head{
    position:relative;
    left:clamp(-96px,-6vw,-48px);
  }
  #vision .mission-card{transform:translateY(48px)}
  #vision .vision-background img{object-position:center bottom}
}

/* ============================================================
   VISION CARD — SECOND COMPOSITION TUNING
   Requested against the supplied "Układ vision.jpg":
   - Mission group: additional 0.5in = 48px downward.
   - Header/title group: additional 0.5in = 48px left.
   - Main Title: finite editorial measure; wrapping is allowed.
   - The Vision canvas remains behind the fixed global header.
   ============================================================ */
@media (min-width:1024px){
  #vision .vision-card-head{
    left:calc(
      clamp(-96px,-6vw,-48px) - 48px
    );
  }

  #vision .mission-card{
    transform:translateY(96px);
  }

  #vision .vision-card-head h1{
    width:min(760px,48vw);
    max-width:min(760px,48vw);
    white-space:normal;
    overflow-wrap:normal;
    word-break:normal;
  }
}

@media (min-width:1440px){
  #vision .vision-card-head{
    left:calc(
      max(-3in, calc((100vw - 1680px) / -2)) - 48px
    );
  }
}

@media (max-width:1023px){
  #vision .vision-card-head{
    left:0;
  }
}

@media (max-width:767px){
  #vision .mission-card{
    transform:none;
  }

  #vision .vision-card-head h1{
    width:100%;
    max-width:100%;
    white-space:normal;
  }
}
@media (max-width:1023px){
  body.vision-route main{inset:0}
  #vision .vision-card-head{left:0}
  #vision .vision-background{inset:72px 0 0}
  #vision .vision-background img{object-position:68% bottom}
}
@media (max-width:767px){
  #vision .mission-card{transform:none}
}

/* ============================================================
   VISION CARD — CMS GROUP POSITION VARIABLES
   Values are additive to the established target composition.
   ============================================================ */
#vision .vision-card-layout{
  --vision-card-mission-x:0px;
  --vision-card-mission-y:0px;
  --vision-card-vision-x:0px;
  --vision-card-vision-y:0px;
  --vision-card-head-x:0px;
  --vision-card-head-y:0px;
}
@media (min-width:1024px){
  #vision .vision-card-head{
    top:var(--vision-card-head-y);
  }
  #vision .mission-card{
    transform:translate(var(--vision-card-mission-x),calc(96px + var(--vision-card-mission-y)));
  }
  #vision .vision-card{
    transform:translate(var(--vision-card-vision-x),var(--vision-card-vision-y));
  }
}
@media (min-width:1024px) and (max-width:1439px){
  #vision .vision-card-head{
    left:calc(clamp(-96px,-6vw,-48px) - 48px + var(--vision-card-head-x));
  }
}
@media (min-width:1440px){
  #vision .vision-card-head{
    left:calc(max(-3in, calc((100vw - 1680px) / -2)) - 48px + var(--vision-card-head-x));
  }
}
@media (max-width:1023px){
  #vision .vision-card-head{top:0}
  #vision .mission-card,#vision .vision-card{transform:none}
}

/* ============================================================
   VISION — TEXT MEASURE / WRAPPING SAFETY
   Keep Mission/Vision copy inside its editorial column even when
   CMS text is long or a stale duplicated value exists.
   ============================================================ */
#vision .vision-card-head h1{
  width:min(760px,100%);
  max-width:760px;
  white-space:normal;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
}
#vision .statement-content{
  min-width:0;
  width:100%;
  max-width:470px;
  overflow:hidden;
}
#vision .vision-statement-card p{
  display:block;
  width:100%;
  max-width:470px;
  min-width:0;
  white-space:normal;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:auto;
  text-wrap:pretty;
}
@media (min-width:1024px){
  #vision .vision-card-head h1{width:min(760px,100%);max-width:760px}
}
@media (max-width:1023px){
  #vision .vision-card-head h1{width:100%;max-width:700px}
  #vision .statement-content{max-width:100%}
  #vision .vision-statement-card p{max-width:100%}
}


/* ============================================================
   WWADON VISION — ETAP 11.1.6
   Header/image separation + stable CMS composition
   ============================================================ */

/* The VISION background starts below the global header. The header
   remains a solid navigation surface with a single clean separator. */
body.vision-route header{
  background:#10110f !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  border-bottom:1px solid rgba(238,233,223,.18) !important;
  box-shadow:none !important;
}
body.vision-route header::after{display:none !important;content:none !important}
#vision .vision-background{
  inset:72px 0 0 !important;
  background:#10110f !important;
}
#vision .vision-background img{
  height:100%;
  max-height:none;
}

/* ============================================================
   VISION CARD — CMS-safe text measure
   Long CMS values must wrap inside the editorial content column.
   ============================================================ */
#vision .vision-card-head{
  min-width:0;
}
#vision .vision-card-head h1{
  width:min(760px,100%);
  max-width:760px;
  min-width:0;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
}
#vision .statement-content{
  min-width:0;
  max-width:470px;
  overflow:hidden;
}
#vision .vision-statement-card p{
  width:100%;
  max-width:470px;
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
  white-space:normal;
}

/* Keep the saved CMS positioning independent from the header/image fix. */
@media (min-width:1024px){
  #vision .vision-background{top:72px !important}
}

/* ============================================================
   ETAP 11.1.12 — WWADON TIMELINE DATE MARKERS
   Keep the date clear of the timeline graphics. Every chronology
   item gets a circular marker below its date; the vertical rule
   begins beneath the marker. The first marker retains the accent.
   ============================================================ */
@media (min-width: 1001px){
  #wwadon .history-item::before{
    left:32px;
    top:76px;
    bottom:0;
    width:1px;
    height:auto;
    background:rgba(238,233,223,.16);
    border:0;
    border-radius:0;
    box-shadow:none;
    pointer-events:none;
  }

  #wwadon .history-item::after{
    content:"";
    position:absolute;
    left:28px;
    top:61px;
    width:9px;
    height:9px;
    box-sizing:border-box;
    border:1px solid #756c59;
    border-radius:50%;
    background:#10100e;
    box-shadow:0 0 0 4px #10100e;
    pointer-events:none;
  }

  #wwadon .history-item:first-child::after{
    border-color:#e0b968;
    background:#e0b968;
  }

  #wwadon .history-item:last-child::before{
    bottom:calc(100% - 76px);
    height:0;
  }
}


/* ============================================================
   ETAP 11.1.14 — ORDERS / TIMELINE REFINEMENT
   ============================================================ */
@media(min-width:901px){
  #auctions .order-account-panel{
    max-height:none;
    overflow:visible;
  }
  #auctions .my-orders-list{
    height:310px;
    max-height:310px;
    min-height:90px;
    overflow-y:scroll;
    overflow-x:hidden;
    overscroll-behavior:contain;
  }
}
#wwadon .history-item::before{display:block;}
#wwadon .history-item::after{display:block;}

/* ============================================================
   ETAP 11.1.17 — MY ORDERS COLUMN FIT / TEXT VISIBILITY
   Keep every order column inside the fixed account panel width.
   ============================================================ */
.my-orders-list{width:100%;min-width:0;box-sizing:border-box;}
.my-order{grid-template-columns:minmax(155px,1.35fr) minmax(78px,.62fr) minmax(72px,.55fr) minmax(105px,.82fr);gap:12px;box-sizing:border-box;width:100%;}
.my-order > *{min-width:0;max-width:100%;}
.my-order-action{min-width:0;text-align:right;overflow-wrap:anywhere;word-break:normal;}
.my-order-action .my-order-meta{white-space:normal;line-height:1.35;overflow-wrap:anywhere;}
.my-order-work-copy strong{white-space:normal;overflow-wrap:anywhere;line-height:1.25;}
@media(max-width:1000px){
  .my-order{grid-template-columns:minmax(175px,1.4fr) minmax(82px,.65fr) minmax(76px,.6fr);gap:10px;}
  .my-order-action{text-align:left;grid-column:2 / -1;}
}
@media(max-width:700px){
  .my-order{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;}
  .my-order-action{grid-column:auto;text-align:left;}
}


/* ============================================================
   ETAP 11.1.18 — MY ORDERS: THREE-ROW VIEW + COMPACT TYPOGRAPHY
   Keep exactly three order cards visible in the fixed scroll area
   before the user scrolls to older/newer records.
   ============================================================ */
#auctions .my-orders-list{
  height:240px;
  max-height:240px;
  min-height:240px;
  overflow-y:auto;
  overflow-x:hidden;
  box-sizing:border-box;
}
#auctions .my-order{
  box-sizing:border-box;
  min-height:70px;
  height:70px;
  padding:8px 0;
  gap:10px;
  font-size:12px;
}
#auctions .my-order strong{
  font-size:12px;
  line-height:1.2;
}
#auctions .my-order-meta{
  font-size:10px;
  line-height:1.25;
}
#auctions .my-order-status{
  font-size:10px;
  line-height:1.25;
}
#auctions .my-order-work{
  gap:9px;
}
#auctions .my-order-thumb{
  width:58px;
  height:42px;
  flex-basis:58px;
}
#auctions .my-order-work-copy{
  gap:3px;
}
@media(max-width:1000px){
  #auctions .my-orders-list{
    height:240px;
    max-height:240px;
    min-height:240px;
  }
  #auctions .my-order{
    min-height:70px;
    height:70px;
  }
}
@media(max-width:700px){
  #auctions .my-orders-list{
    height:240px;
    max-height:240px;
    min-height:240px;
  }
  #auctions .my-order{
    height:auto;
    min-height:70px;
  }
}

/* ============================================================
   ETAP 11.1.19 — WWADON TIMELINE DATE / RULE SEPARATION
   The date remains visually isolated. Every day gets the same
   circular marker below its date, followed by the vertical rule.
   ============================================================ */
@media (min-width:1001px){
  #wwadon .history-date{
    position:relative;
    z-index:5;
    padding-top:3px;
    background:#10110f;
  }

  #wwadon .history-item::after{
    content:"";
    position:absolute;
    left:28px;
    top:61px;
    width:9px;
    height:9px;
    box-sizing:border-box;
    border:1px solid #756c59;
    border-radius:50%;
    background:#10110f;
    box-shadow:0 0 0 4px #10110f;
    z-index:4;
    pointer-events:none;
  }

  #wwadon .history-item:first-child::after{
    border-color:#e0b968;
    background:#e0b968;
  }

  #wwadon .history-item::before{
    left:32px;
    top:76px;
    bottom:0;
    width:1px;
    height:auto;
    z-index:1;
    background:rgba(238,233,223,.16);
    border:0;
    box-shadow:none;
    pointer-events:none;
  }

  #wwadon .history-item:last-child::before{
    bottom:calc(100% - 76px);
    height:0;
  }
}


/* ============================================================
   ETAP 11.1.20 — WWADON TIMELINE TO DESCRIPTION
   Desktop: the vertical timeline rule ends exactly at the bottom
   of the description paragraph, not at the bottom of the whole day item.
   The date and circular marker remain visually separated.
   ============================================================ */
@media (min-width:1001px){
  #wwadon .history-item::before{
    top:76px;
    bottom:auto;
    height:var(--wwadon-timeline-line-height, 120px);
    width:1px;
    background:rgba(238,233,223,.16);
    border:0;
    box-shadow:none;
    pointer-events:none;
  }
  #wwadon .history-item:last-child::before{
    bottom:auto;
    height:var(--wwadon-timeline-line-height, 120px);
  }
}

/* ============================================================
   ETAP 19.5 — RESPONSIVE NAVIGATION / PUBLIC LAYOUT HARDENING
   Scope: public frontend only. No data, auth, payment, or API changes.
   ============================================================ */

/* One stable navigation model. HOME artwork geometry must not reposition it. */
header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(16px,2.5vw,42px);
  min-width:0;
}
header .logo{
  display:flex;
  align-items:baseline;
  flex:1 1 auto;
  min-width:0;
  max-width:none;
  overflow:visible;
}
header .logo small{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}
header nav,
header nav.home-geometry-nav{
  position:static !important;
  inset:auto !important;
  width:auto !important;
  left:auto !important;
  top:auto !important;
  transform:none !important;
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:nowrap;
  min-width:0;
  gap:clamp(12px,2vw,30px);
}
header nav a,
header nav.home-geometry-nav a{
  flex:0 0 auto;
  min-width:max-content;
  white-space:nowrap;
  text-align:center;
  padding-inline:0;
}
header nav a.is-active::after,
header nav a[aria-current="page"]::after{
  bottom:-10px;
}

/* The historical vertical rule and marker were removed from the public design.
   Disable every legacy pseudo-element layer, including late overrides. */
#wwadon .history-item::before,
#wwadon .history-item::after,
#wwadon .history-item:first-child::before,
#wwadon .history-item:first-child::after{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  pointer-events:none !important;
}
#wwadon .history-item{
  padding-left:0 !important;
}

/* Tablet and phone: keep the header in one controlled row. */
@media (max-width:1024px){
  header{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:clamp(8px,2vw,18px);
    flex-wrap:nowrap !important;
    padding-inline:clamp(12px,3vw,24px);
  }
  header .logo{
    display:block;
    width:auto;
    max-width:none !important;
    min-width:0;
    font-size:clamp(16px,3.4vw,21px);
    line-height:1.1;
    white-space:normal;
  }
  header .logo small{
    display:block;
    margin:5px 0 0;
    max-width:100%;
    font-size:clamp(5.5px,1.05vw,7px);
    line-height:1.35;
    letter-spacing:.16em;
    white-space:normal;
  }
  header nav,
  header nav.home-geometry-nav{
    width:max-content !important;
    max-width:100%;
    gap:clamp(8px,2.2vw,18px);
    justify-self:end;
  }
  header nav a,
  header nav.home-geometry-nav a{
    font-size:clamp(7px,1.45vw,10px);
    line-height:1.15;
    letter-spacing:.07em;
    padding:8px 0;
  }
  main{
    margin-top:64px;
  }
}

/* Narrow phone: retain all three links without collision. */
@media (max-width:700px){
  header{
    min-height:60px;
    padding:8px 12px;
    gap:8px;
  }
  header .logo{
    font-size:clamp(14px,4.2vw,18px);
    letter-spacing:.14em;
  }
  header .logo small{
    margin-top:5px;
    font-size:6px;
    letter-spacing:.12em;
    line-height:1.35;
  }
  header nav,
  header nav.home-geometry-nav{
    gap:clamp(5px,1.8vw,10px);
  }
  header nav a,
  header nav.home-geometry-nav a{
    font-size:clamp(7px,2vw,9px);
    letter-spacing:.035em;
    padding:8px 0;
  }
  main{
    margin-top:60px;
  }
}

/* Very narrow screens: reduce typography, never remove VISION. */
@media (max-width:430px){
  header{
    padding-inline:10px;
    gap:6px;
  }
  header .logo{
    font-size:15px;
    letter-spacing:.12em;
  }
  header .logo small{
    font-size:5.5px;
    letter-spacing:.08em;
  }
  header nav,
  header nav.home-geometry-nav{
    gap:5px;
  }
  header nav a,
  header nav.home-geometry-nav a{
    font-size:7px;
    letter-spacing:.02em;
  }
}

/* Landscape phones: keep the compact header and allow the page to scroll vertically. */
@media (orientation:landscape) and (max-width:1024px){
  header{
    min-height:58px;
    padding-block:7px;
  }
  header .logo small{
    display:block;
    margin-top:4px;
    font-size:5.5px;
  }
  header nav,
  header nav.home-geometry-nav{
    gap:clamp(7px,1.8vw,14px);
  }
  header nav a,
  header nav.home-geometry-nav a{
    font-size:clamp(7px,1.35vw,9px);
  }
  main{
    margin-top:58px;
  }
  .view,
  .view.active{
    min-height:calc(100vh - 58px);
  }
  #home .home,
  #auctions .auctions-page,
  #vision .vision-card-layout{
    min-height:calc(100vh - 58px);
  }
}

/* VISION is a permanent primary navigation destination. */
header nav a:nth-child(3),
header nav.home-geometry-nav a:nth-child(3){
  display:flex !important;
}


/* ============================================================
   ETAP 19.6 — LANDSCAPE MOBILE CONTENT FIT / MOTO G15
   Target: landscape phones with limited viewport height.
   Goals:
   - no horizontal clipping;
   - no fixed fullscreen canvas trapping page content;
   - vertical scrolling remains available;
   - HOME, AUCTIONS and VISION reflow into a readable mobile layout.
   ============================================================ */

@media (orientation: landscape) and (max-height: 700px) and (max-width: 1400px){

  html,
  body{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  main{
    position:relative !important;
    inset:auto !important;
    width:100%;
    max-width:100%;
    margin-top:58px !important;
    overflow:visible !important;
  }

  .view,
  .view.active{
    position:relative !important;
    inset:auto !important;
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }

  /* HOME: replace the desktop fullscreen canvas with a scrollable
     single-column composition on short landscape screens. */
  #home .home{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:visible !important;
  }

  #home .home-intro{
    display:flex !important;
    width:100%;
    max-width:100%;
    height:auto;
    min-height:0;
    padding:28px clamp(20px,5vw,48px) 32px !important;
    justify-content:flex-start;
    box-sizing:border-box;
  }

  #home .home-intro h1{
    font-size:clamp(36px,7vw,58px) !important;
    line-height:.96;
  }

  #home .home-intro p{
    max-width:48rem;
    font-size:clamp(12px,1.8vw,15px);
  }

  #home .featured{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }

  #home .slider{
    width:100%;
    height:auto !important;
    display:block !important;
    overflow:visible !important;
  }

  #home .slide{
    width:100%;
    min-width:0 !important;
    height:auto !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
  }

  #home .art-visual{
    width:100%;
    height:clamp(240px,58vw,460px) !important;
    min-height:0 !important;
    max-height:none !important;
  }

  #home .art-visual img{
    width:100%;
    height:100%;
    max-width:100%;
    object-fit:contain;
  }

  #home .slide-info{
    position:relative !important;
    inset:auto !important;
    width:100%;
    height:auto !important;
    min-height:0 !important;
    padding:28px clamp(20px,5vw,48px) 36px !important;
    box-sizing:border-box;
    background:#12120f;
  }

  #home .slide-info-inner{
    position:relative !important;
    inset:auto !important;
    width:100%;
    max-width:48rem;
    overflow:visible !important;
  }

  #home .slide-info-description{
    overflow:visible !important;
    max-height:none !important;
  }

  /* AUCTIONS: allow the two desktop columns to become a
     vertically scrollable mobile composition. */
  #auctions .auctions-page{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:visible !important;
  }

  #auctions .auctions-hero{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    padding:32px clamp(20px,5vw,48px) 30px !important;
    box-sizing:border-box;
    border-right:0;
    border-bottom:1px solid rgba(238,233,223,.13);
  }

  #auctions .auctions-hero h1{
    font-size:clamp(42px,10vw,70px) !important;
  }

  #auctions .auctions-catalogue{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    padding:26px clamp(16px,4vw,40px) 36px !important;
    box-sizing:border-box;
    overflow:visible !important;
  }

  #auctions .auction-grid{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  /* VISION: remove the fullscreen clipping boundary and use the
     existing tablet/mobile editorial reflow. */
  #vision.view{
    width:100%;
    max-width:100%;
    overflow:visible !important;
  }

  #vision .vision-card-layout{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:760px !important;
    overflow:hidden;
  }

  #vision .vision-content{
    width:100%;
    max-width:100%;
    height:auto !important;
    min-height:760px !important;
    display:block !important;
    box-sizing:border-box;
    padding:34px clamp(22px,5vw,48px) 126px !important;
  }

  #vision .vision-card-head{
    position:relative !important;
    left:0 !important;
    top:0 !important;
    width:100%;
    max-width:100%;
  }

  #vision .vision-card-head h1{
    width:100%;
    max-width:100%;
    font-size:clamp(30px,6.5vw,46px) !important;
    white-space:normal;
    overflow-wrap:normal;
  }

  #vision .vision-cards{
    width:100%;
    max-width:100%;
    margin:44px 0 0 !important;
    padding:0 !important;
    gap:34px;
  }

  #vision .vision-statement-card{
    grid-template-columns:96px 1px minmax(0,1fr);
    gap:20px;
    min-width:0;
  }

  #vision .statement-content,
  #vision .vision-statement-card p{
    min-width:0;
    max-width:100%;
    overflow-wrap:anywhere;
  }

  #vision .mission-card,
  #vision .vision-card{
    transform:none !important;
  }

  /* Prevent transformed or oversized children from creating a
     non-scrollable horizontal canvas. */
  header,
  header .logo,
  header nav,
  #home,
  #auctions,
  #vision,
  #home *,
  #auctions *,
  #vision *{
    max-width:100%;
    box-sizing:border-box;
  }

  img,
  svg,
  video,
  canvas{
    max-width:100%;
  }
}