/* Auverian storefront */
:root{
  --ink:#11231F; --deep:#0B1512; --green:#1E4A3C;
  --gold:#C9A25A; --gold-d:#B8903F; --gold-t:#8A6420; --gold-l:#F1DDA0;
  --cream:#FCF6E6; --line:#D9C48E; --body:#3F504A;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Jost',system-ui,sans-serif;background:#fff;color:var(--ink)}
a{color:var(--ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold-t);outline-offset:3px}
button{font-family:inherit;cursor:pointer}
img,video{max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}

/* Header */
.topbar{background:var(--ink);border-bottom:1px solid var(--gold);position:sticky;top:0;z-index:50}
.topgrid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:14px 24px;
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#F3F4F1}
.topgrid a,.topgrid button{color:#F3F4F1;text-decoration:none}
.wordmark{font-family:'Bodoni Moda',serif;font-size:clamp(18px,5vw,26px);letter-spacing:.28em;white-space:nowrap}
.menubtn{min-height:44px;background:none;border:none;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:8px}
.cartbtn{min-height:44px;background:none;border:none;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold) !important}
.topgrid button:hover,.topgrid a:hover{color:var(--gold) !important}
.dropdown{position:absolute;top:calc(100% + 14px);left:-24px;z-index:60;min-width:260px;background:var(--deep);
  border:1px solid var(--gold);box-shadow:0 24px 48px rgba(0,0,0,.45);padding:6px 0;display:flex;flex-direction:column}
.dropdown a{display:flex;align-items:center;min-height:52px;padding:0 32px;text-decoration:none;color:#F3F4F1;
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:22px;text-transform:none;letter-spacing:.02em;
  transition:background .25s,color .25s,padding-left .25s}
.dropdown a+a{border-top:1px solid rgba(201,162,90,.25)}
.dropdown a:hover{color:var(--gold) !important;background:rgba(201,162,90,.14);padding-left:40px}
.hidden{display:none !important}

/* Hero */
.hero{position:relative;background:var(--deep);overflow:hidden;min-height:clamp(560px,86vh,840px);display:flex;align-items:flex-end}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 1s ease}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,21,18,.45),rgba(11,21,18,.2) 38%,rgba(11,21,18,.88))}
.hero .inner{position:relative;width:100%;padding:120px 24px 64px;color:#F3F4F1;display:flex;flex-direction:column;gap:24px}
.eyebrow{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-t)}
.hero .eyebrow{font-size:14px;letter-spacing:.22em;color:var(--gold)}
h1.display{margin:0;font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(56px,10vw,128px);line-height:.96;letter-spacing:-.01em}
h1.display em{font-style:italic;font-weight:500;color:var(--gold)}
.lede{margin:0;font-size:20px;line-height:1.55;max-width:540px;color:#E3E8E4}
.btn-ghost-light{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 40px;
  border:1px solid var(--gold);color:#F3F4F1;text-decoration:none;font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  background:rgba(11,21,18,.25);transition:background .3s}
.btn-ghost-light:hover{background:rgba(201,162,90,.22);color:#fff}
.herolink{min-height:50px;background:none;border:none;color:#E3E8E4;font-size:15px;text-decoration:underline;
  text-underline-offset:6px;text-decoration-color:var(--gold)}

/* Section furniture */
.keystrip{animation:keyscroll 2.6s linear infinite;height:16px;width:100%;background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Cpath d='M0 14H2V2H20V14H24M20 11H8V6H14' fill='none' stroke='%23B8903F' stroke-width='1.6' stroke-linecap='square'/%3E%3C/svg%3E") repeat-x left center}
@keyframes keyscroll{from{background-position-x:0}to{background-position-x:-24px}}
.foil{font-style:italic;background:linear-gradient(135deg,#7A5A1E,#D9B96B 38%,#F1DDA0 50%,#B8903F 68%,#7A5A1E);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.diamond{display:flex;align-items:center;gap:14px}
.diamond span:first-child{width:70px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.diamond span:last-child{width:70px;height:1px;background:linear-gradient(270deg,transparent,var(--gold))}
.diamond i{width:8px;height:8px;transform:rotate(45deg);border:1px solid var(--gold-d)}
.center{display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px}
h2.display{margin:0;font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(44px,6vw,76px);line-height:1;letter-spacing:-.01em}
h2.display em{font-style:italic;color:var(--gold-t)}
.italic{font-family:'Cormorant Garamond',serif;font-style:italic}

/* Why */
#why{position:relative;background:radial-gradient(ellipse at 28% 62%,#fff,#fff 55%,#FBF8F0);overflow:hidden}
#why .topfade{position:absolute;left:0;right:0;top:0;height:120px;background:linear-gradient(180deg,rgba(11,21,18,.55),rgba(11,21,18,0));pointer-events:none}
.whybody{padding:112px 24px;display:flex;flex-direction:column;gap:72px}
.whyrow{display:flex;flex-wrap:wrap;align-items:center;gap:64px 88px}
#why-stage{position:relative;aspect-ratio:4/5;background:radial-gradient(ellipse at 50% 42%,var(--green),#0F2A24 55%,#0A1B17);
  border:1px solid var(--gold);box-shadow:0 30px 60px rgba(17,35,31,.3),inset 0 0 0 6px #0A1B17,inset 0 0 0 7px rgba(201,162,90,.5)}
#why-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#0A1B17;transition:opacity 1.2s ease}
#why-cap{position:absolute;left:0;right:0;bottom:0;padding:56px 24px 22px;text-align:center;cursor:pointer;
  background:linear-gradient(180deg,rgba(10,27,23,0),rgba(10,27,23,.88))}
#why-cap .nm{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:34px;color:#F3F4F1}
#why-cap .pr{margin-top:6px;font-size:14px;letter-spacing:.12em;color:#E3E8E4}
.points{flex:1 1 400px;display:flex;flex-direction:column;border-bottom:1px solid var(--gold)}
.point{display:flex;gap:28px;align-items:center;padding:26px 0;border-top:1px solid var(--gold)}
.point .num{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(56px,8vw,96px);line-height:.8;min-width:64px;text-align:center}
.point h3{margin:0;font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:500;line-height:1.1}
.point p{margin:6px 0 0;font-size:16px;line-height:1.6;color:var(--body)}

/* Collection */
#shop{padding:88px 24px;display:flex;flex-direction:column;gap:48px}
.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 36px}
.tab{min-height:44px;padding:0 2px;background:none;border:none;border-bottom:1px solid transparent;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--body)}
.tab[aria-pressed="true"]{border-bottom-color:var(--gold-d);color:var(--gold-t);font-weight:500}
.tab:hover{color:var(--gold-t)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:64px 40px}
.card{display:flex;flex-direction:column;gap:20px}
.card .pic{display:block;width:100%;padding:0;border:1px solid rgba(184,144,63,.55);background:none;overflow:hidden}
.card .pic img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.card .pic:hover img{transform:scale(1.05)}
.card .meta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:0 8px}
.card h3{margin:0;font-weight:400}
.card .title{padding:0;border:none;background:none;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:34px;line-height:1.05;color:var(--ink)}
.card .title:hover{text-decoration:underline}
.card .desc{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:19px;line-height:1.4;color:var(--gold-t);max-width:300px}
.card .price{font-size:17px;letter-spacing:.14em;color:var(--gold-t);margin-top:4px}
.btn-outline{min-height:46px;padding:0 34px;background:transparent;border:1px solid var(--gold-d);color:var(--ink);
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;transition:background .25s,color .25s}
.btn-outline:hover{background:var(--ink);color:#F3F4F1}
.empty{padding:48px 24px;border:1px dashed #9AA79F;text-align:center;font-size:18px;color:var(--body)}

/* Product page */
#detail{background:#fff}
.detailwrap{padding:56px 24px 96px;display:flex;flex-wrap:wrap;gap:56px}
.back{flex:0 0 100%;padding:0;border:none;background:none;text-align:left;font-size:12px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-t);min-height:32px}
.gallery{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:18px}
.frame{padding:10px;border:1px solid var(--gold-d);background:#fff}
.frame img,.frame video{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.thumbs{display:flex;flex-wrap:wrap;gap:12px}
.thumbs button{padding:0;width:72px;height:72px;background:var(--cream);border:1px solid #E3D3A4;opacity:.75}
.thumbs button[aria-pressed="true"]{border-color:var(--gold-d);opacity:1}
.thumbs img{display:block;width:100%;height:100%;object-fit:cover}
.info{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:30px;padding-top:8px}
.info h2{margin:0;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:clamp(44px,6vw,72px);line-height:1}
.rule{display:flex;align-items:center;gap:12px}
.rule span:first-child{width:56px;height:1px;background:var(--gold-d)}
.rule i{width:6px;height:6px;background:var(--gold-d);transform:rotate(45deg)}
.bigprice{font-size:26px;letter-spacing:.12em;color:var(--gold-t)}
.desc-l{margin:0;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:23px;line-height:1.5;color:var(--body)}
.chips{display:flex;flex-wrap:wrap;gap:12px}
.chips button{padding:0;width:56px;height:56px;background:var(--cream);border:1px solid var(--line);overflow:hidden}
.chips button[aria-pressed="true"]{border-color:var(--gold-d);box-shadow:0 0 0 2px #fff,0 0 0 3px var(--gold-d)}
.chips img{display:block;width:100%;height:100%;object-fit:cover}
dl.specs{margin:0;display:flex;flex-direction:column;font-size:17px;border-bottom:1px solid var(--line)}
dl.specs>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding:14px 0;border-top:1px solid var(--line)}
dl.specs dt{color:var(--gold-t);font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding-top:3px}
dl.specs dd{margin:0}
.note{margin:0;font-size:16px;line-height:1.6;color:var(--body)}
.actions{display:flex;flex-wrap:wrap;gap:16px}
.btn-solid{min-height:56px;padding:0 44px;background:var(--ink);color:var(--gold-l);border:1px solid var(--gold-d);
  font-size:12px;letter-spacing:.28em;text-transform:uppercase;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;
  transition:background .25s}
.btn-solid:hover{background:var(--green);color:var(--gold-l)}
.btn-ghost{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 32px;
  border:1px solid var(--gold-d);text-decoration:none;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink);background:none;
  transition:background .25s}
.btn-ghost:hover{background:rgba(201,162,90,.16)}
.trust{display:flex;flex-direction:column;gap:12px;padding-top:22px;border-top:1px solid var(--line);font-size:16px;color:var(--body)}
.trust b{color:var(--gold-d);font-weight:400}

/* More watches */
#related{border-top:1px solid var(--gold-d);background:#fff}
#related .inner{padding:88px 24px;display:flex;flex-direction:column;gap:40px}
#related h2{margin:0;text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:clamp(36px,5vw,54px)}
.row{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.row::-webkit-scrollbar{display:none}
.row>div{flex:0 0 min(260px,78%);scroll-snap-align:start;display:flex;flex-direction:column;gap:14px}
.row img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.row .title{padding:0;border:none;background:none;text-align:left;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:28px;color:var(--ink)}
.row .price{color:var(--gold-t);letter-spacing:.12em;font-size:18px}

/* Cart drawer */
.scrim{position:fixed;inset:0;z-index:100;display:flex;justify-content:flex-end}
.scrim .bg{position:absolute;inset:0;background:rgba(10,27,23,.55)}
#cartpanel{position:relative;width:min(440px,100%);height:100%;background:#fff;
  border-left:1px solid var(--gold-d);display:flex;flex-direction:column;animation:slide .35s cubic-bezier(.2,.7,.2,1)}
@keyframes slide{from{transform:translateX(100%)}to{transform:none}}
.carthead{display:flex;align-items:center;justify-content:space-between;padding:22px 28px;border-bottom:1px solid var(--gold-d);background:var(--ink)}
.carthead .ttl{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:28px;color:var(--gold-l)}
.carthead button{background:none;border:none;color:var(--gold);font-size:12px;letter-spacing:.22em;text-transform:uppercase;min-height:44px}
.cartbody{flex:1;overflow-y:auto;padding:8px 28px}
.line{display:flex;gap:18px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}
.line img{width:88px;height:110px;object-fit:cover;border:1px solid var(--gold-d);flex:none}
.line .nm{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:26px;line-height:1.1}
.line .cl{font-size:13px;color:var(--body)}
.line .pr{color:var(--gold-t);letter-spacing:.12em}
.qty{display:flex;align-items:center;gap:10px;margin-top:4px}
.qty button:not(.rm){width:30px;height:30px;background:none;border:1px solid var(--line);color:var(--ink);font-size:15px;line-height:1;flex:none}
.qty button:not(.rm):hover{border-color:var(--gold-d);color:var(--gold-t)}
.qty .rm{width:auto;height:auto;border:none;padding:0 2px;background:none}
.qty span{min-width:18px;text-align:center}
.rm{padding:0;background:none;border:none;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#5C6B65;min-height:32px}
.rm:hover{color:var(--gold-t)}
.cartfoot{padding:22px 28px 28px;border-top:1px solid var(--gold-d);display:flex;flex-direction:column;gap:14px;background:#fff}
.subtotal{display:flex;justify-content:space-between;align-items:baseline}
.subtotal span:first-child{font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-t)}
.subtotal span:last-child{font-size:24px;letter-spacing:.1em}
.cartnote{font-size:14px;line-height:1.6;color:var(--body)}
.choice{display:flex;gap:10px;margin-top:4px}
.choice button{flex:1;min-height:46px;background:none;border:1px solid var(--line);color:var(--body);
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;transition:border-color .2s,color .2s,background .2s}
.choice button[aria-pressed="true"]{border-color:var(--gold-d);color:var(--ink);background:rgba(201,162,90,.12);font-weight:500}
.choice button:hover{border-color:var(--gold-d);color:var(--ink)}
.choicenote{font-size:13px;line-height:1.55;color:#5C6B65}
.msg{padding:14px 16px;border:1px solid var(--gold-d);font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:19px;line-height:1.4;background:#fff}
.linkbtn{background:none;border:none;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-t);min-height:36px}

/* Contact + footer */
#contact{position:relative;background:radial-gradient(ellipse at 50% 30%,#fff,#fff 60%,#FBF8F0)}
#contact .botfade{position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(180deg,rgba(17,35,31,0),rgba(17,35,31,.9));pointer-events:none}
#contact .inner{padding:104px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
#contact p{margin:0;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:24px;line-height:1.45;color:var(--body);max-width:560px}
.btn-call{margin-top:8px;display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 44px;
  border:1px solid var(--gold-d);color:var(--ink);text-decoration:none;font-size:13px;letter-spacing:.24em;text-transform:uppercase}
.btn-call:hover{background:rgba(201,162,90,.16)}
footer{background:var(--ink);color:#D4DCD7;border-top:1px solid #2A3F39}
footer .inner{padding:28px 24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;font-size:15px}
footer .brand{display:flex;align-items:center;gap:16px}
footer .brand span{font-family:'Bodoni Moda',serif;letter-spacing:.28em;font-size:18px;color:#F3F4F1}
footer .links{display:flex;flex-wrap:wrap;gap:12px 28px;width:100%;order:3;padding-top:16px;border-top:1px solid #2A3F39}
footer .links a{color:#F3F4F1;text-decoration:none;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
footer .links a:hover{color:var(--gold)}
footer .fine{display:flex;flex-wrap:wrap;gap:8px 24px}

/* Mobile */
@media (max-width:760px){
  .whybody{padding:72px 24px;gap:48px}
  .whyrow{gap:40px}
  .point{gap:18px;padding:20px 0}
  .point .num{min-width:54px;font-size:42px;line-height:1}
  .point h3{font-size:26px}
  #shop{padding:64px 20px;gap:36px}
  .grid{grid-template-columns:repeat(2,1fr);gap:40px 16px}
  .card{gap:12px}
  .card .title{font-size:24px}
  .card .desc{font-size:15px;line-height:1.35}
  .card .price{font-size:15px}
  .btn-outline{padding:0 18px;font-size:11px;letter-spacing:.18em;min-height:42px}
  .card .meta{padding:0;gap:6px}
  .detailwrap{padding:32px 24px 72px;gap:36px}
  .tabs{gap:6px 22px}
  .hero .inner{padding:96px 24px 48px}
  .actions .btn-solid,.actions .btn-ghost{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}

/* Narrow phones: keep the header on one line */
@media (max-width:560px){
  .topgrid{padding:10px 14px;gap:6px}
  .wordmark{font-size:17px;letter-spacing:.16em}
  .menubtn,.cartbtn{font-size:10px;letter-spacing:.1em;white-space:nowrap}
  .menubtn svg{width:8px;height:8px}
  .dropdown{left:0;min-width:220px}
  .dropdown a{font-size:19px;padding:0 20px;min-height:48px}
}
@media (max-width:420px){
  .wordmark{font-size:15px;letter-spacing:.1em}
  .menubtn,.cartbtn{font-size:9px;letter-spacing:.04em}
  .grid{gap:32px 12px}
  .card .title{font-size:21px}
  .card .desc{font-size:14px}
}
