/*
Theme Name: Sankofa Sovereign
Theme URI: https://sankofasovereign.com
Author: Sankofa Sovereign
Author URI: https://sankofasovereign.com
Description: A sleek, editorial WooCommerce theme for the Sankofa Sovereign clothing house. Photo-light, typographic-forward, with a switchable Dark/Light brand mode, full Customizer control over every section, and native WooCommerce support. Bodoni Moda + Jost. Built from the founding-drop concept.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sankofa-sovereign
Tags: e-commerce, editorial, custom-colors, custom-logo, custom-menu, featured-images, full-width-template, footer-widgets, translation-ready
WC requires at least: 7.0
WC tested up to: 9.0
*/

/* ============================================================
   TOKENS — Dark mode is the default (:root). Light mode lives
   under body.mode-light. Every component reads semantic vars,
   so the toggle swaps the whole brand without touching markup.
============================================================ */
:root{
  --bg:#121110;            /* page base                    */
  --surface:#181614;       /* alt section surfaces         */
  --surface-2:#221F1C;     /* cards / panels               */
  --text:#F7F4EE;          /* primary text                 */
  --text-dim:rgba(247,244,238,.78);
  --muted:#8C867E;         /* secondary text               */
  --gold:#C9A86A;          /* accent                       */
  --gold-line:rgba(201,168,106,.38);
  --gold-soft:rgba(201,168,106,.14);
  --line:rgba(247,244,238,.10);
  --line-strong:rgba(247,244,238,.18);

  --ribbon-bg:#181614;
  --footer-bg:#181614;
  --nav-bg:rgba(18,17,16,.86);

  --contrast-bg:#121110;   /* editorial band               */
  --contrast-text:#F7F4EE;
  --contrast-text-dim:rgba(247,244,238,.78);
  --contrast-line:rgba(247,244,238,.12);

  --on-gold:#121110;       /* text sitting on gold         */
  --shadow:0 18px 50px -28px rgba(0,0,0,.6);

  --display:'Bodoni Moda', Georgia, serif;
  --sans:'Jost', system-ui, -apple-system, sans-serif;

  --container:1280px;
  --pad:clamp(1.25rem, 5vw, 4rem);
  --section:clamp(5rem, 11vw, 9.5rem);
}

body.mode-light{
  --bg:#F7F4EE;
  --surface:#EFEAE0;
  --surface-2:#E7E1D5;
  --text:#1A1714;
  --text-dim:rgba(26,23,20,.66);
  --muted:#8C867E;
  --gold:#C9A86A;
  --gold-line:rgba(201,168,106,.55);
  --gold-soft:rgba(201,168,106,.14);
  --line:rgba(26,23,20,.12);
  --line-strong:rgba(26,23,20,.22);

  --ribbon-bg:#1A1714;
  --footer-bg:#121110;
  --nav-bg:rgba(247,244,238,.88);

  --contrast-bg:#121110;
  --contrast-text:#F7F4EE;
  --contrast-text-dim:rgba(247,244,238,.78);
  --contrast-line:rgba(247,244,238,.12);

  --on-gold:#1A1714;
  --shadow:0 18px 50px -28px rgba(26,23,20,.4);
}

/* ============================================================ RESET ============================================================ */
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);color:var(--text);font-family:var(--sans);
  font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  transition:background .4s ease,color .4s ease;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;height:auto;}
ul{list-style:none;}
::selection{background:var(--gold);color:var(--on-gold);}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}
.wrap{max-width:var(--container);margin:0 auto;padding-inline:var(--pad);}
.skip-link{position:absolute;left:-9999px;}
.skip-link:focus{left:1rem;top:1rem;z-index:200;background:var(--gold);color:var(--on-gold);padding:.7em 1.2em;}

/* ============================================================ TYPE ROLES ============================================================ */
.eyebrow{font-family:var(--sans);font-size:.7rem;font-weight:500;letter-spacing:.34em;
  text-transform:uppercase;color:var(--gold);}
.lede{color:var(--text-dim);font-size:clamp(1rem,1.4vw,1.12rem);font-weight:300;}

/* ============================================================ BUTTONS / LINKS ============================================================ */
.btn{display:inline-flex;align-items:center;gap:.6em;font-family:var(--sans);font-size:.76rem;
  font-weight:500;letter-spacing:.22em;text-transform:uppercase;padding:1.05em 2.1em;
  border:1px solid transparent;cursor:pointer;
  transition:background .35s ease,color .35s ease,border-color .35s ease,transform .35s ease;}
.btn--gold{background:var(--gold);color:var(--on-gold);}
.btn--gold:hover{background:var(--text);color:var(--bg);transform:translateY(-2px);}
.btn--ghost{border-color:var(--line-strong);color:var(--text);background:transparent;}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold);}
.arrow{transition:transform .35s ease;}
.btn:hover .arrow,.txtlink:hover .arrow{transform:translateX(4px);}

.txtlink{display:inline-flex;align-items:center;gap:.55em;font-size:.74rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--text);padding-bottom:.4em;
  border-bottom:1px solid var(--gold-line);transition:color .3s ease,border-color .3s ease;}
.txtlink:hover{color:var(--gold);border-color:var(--gold);}
.txtlink.ondark{color:var(--contrast-text);}
.txtlink.ondark:hover{color:var(--gold);}

/* ============================================================ BRAND MARK ============================================================ */
.mark{display:block;fill:none;stroke:var(--gold);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;}

/* ============================================================ RIBBON ============================================================ */
.ribbon{background:var(--ribbon-bg);text-align:center;border-bottom:1px solid var(--contrast-line);}
.ribbon p{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--contrast-text-dim);
  padding:.85em 1rem;font-weight:400;}
.ribbon b{color:var(--gold);font-weight:500;}

/* ============================================================ NAV ============================================================ */
.nav{position:sticky;top:0;z-index:60;transition:background .4s ease,border-color .4s ease;
  border-bottom:1px solid transparent;}
.nav.scrolled{background:var(--nav-bg);backdrop-filter:blur(14px);border-color:var(--line);}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:1.15rem;}
.brand{display:flex;align-items:center;gap:.7rem;}
.brand img{width:auto;max-height:42px;}
.brand svg{width:30px;height:30px;}
.brand__name{font-family:var(--display);font-weight:600;font-size:1.18rem;letter-spacing:.16em;
  text-transform:uppercase;line-height:1;color:var(--text);}
.brand__name span{display:block;font-size:.52rem;letter-spacing:.42em;color:var(--muted);
  font-family:var(--sans);font-weight:400;margin-top:.32em;}
.nav__links{display:flex;gap:2.4rem;}
.nav__links a{font-size:.74rem;font-weight:400;letter-spacing:.2em;text-transform:uppercase;
  color:var(--text-dim);position:relative;padding-block:.3rem;}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:width .35s ease;}
.nav__links a:hover{color:var(--text);}
.nav__links a:hover::after{width:100%;}
.nav__links .current-menu-item>a{color:var(--text);}
.nav__utils{display:flex;align-items:center;gap:1.4rem;}
.iconbtn{background:none;border:none;color:var(--text-dim);cursor:pointer;display:flex;align-items:center;transition:color .3s ease;}
.iconbtn:hover{color:var(--gold);}
.iconbtn svg{width:19px;height:19px;}
.cart{position:relative;}
.cart__count{position:absolute;top:-7px;right:-9px;background:var(--gold);color:var(--on-gold);font-size:.55rem;
  font-weight:600;min-width:15px;height:15px;padding:0 3px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.burger{display:none;background:none;border:none;color:var(--text);cursor:pointer;}
.burger svg{width:24px;height:24px;}

.mobilemenu{position:fixed;inset:0;z-index:80;background:var(--bg);transform:translateX(100%);
  transition:transform .45s cubic-bezier(.7,0,.2,1);display:flex;flex-direction:column;padding:var(--pad);}
.mobilemenu.open{transform:translateX(0);}
.mobilemenu__top{display:flex;justify-content:space-between;align-items:center;padding-bottom:2.5rem;border-bottom:1px solid var(--line);}
.mobilemenu nav{display:flex;flex-direction:column;gap:.4rem;margin-top:2.5rem;}
.mobilemenu nav a{font-family:var(--display);font-size:2rem;font-weight:500;padding-block:.4rem;color:var(--text);}
.mobilemenu nav a:hover{color:var(--gold);}

/* ============================================================ HERO ============================================================ */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(120% 90% at 78% 18%, var(--gold-soft), transparent 55%),var(--bg);}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);
  align-items:center;padding-block:clamp(3.5rem,9vw,7rem);}
.hero__eyebrow{margin-bottom:1.8rem;}
.hero h1{font-family:var(--display);font-weight:500;font-size:clamp(3.1rem,8.2vw,7rem);
  line-height:.92;letter-spacing:-.015em;color:var(--text);}
.hero h1 em{font-style:italic;color:var(--gold);font-weight:500;}
.hero__sub{margin:2rem 0 2.6rem;max-width:34ch;}
.hero__cta{display:flex;flex-wrap:wrap;gap:1rem;}
.hero__meta{margin-top:3rem;display:flex;gap:2.2rem;flex-wrap:wrap;}
.hero__meta div{display:flex;flex-direction:column;gap:.35rem;}
.hero__meta dt{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);}
.hero__meta dd{font-family:var(--display);font-size:1.05rem;color:var(--text);}

.hero__frame{position:relative;aspect-ratio:4/5;background:linear-gradient(160deg,var(--surface-2),var(--surface));
  border:1px solid var(--gold-line);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.hero__frame::before{content:"";position:absolute;inset:12px;border:1px solid var(--line);z-index:2;pointer-events:none;}
.hero__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero__frame .watermark{width:46%;opacity:.5;}
.hero__frame .watermark .mark{stroke-width:2.2;}
.hero__frame__tag{position:absolute;top:18px;left:18px;z-index:3;}
.hero__frame__tag span{display:block;font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);}
.hero__frame__tag b{font-family:var(--display);font-size:1.1rem;color:var(--gold);font-weight:500;}
.hero__frame__note{position:absolute;bottom:18px;right:18px;z-index:3;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);}

.reveal-load{opacity:0;transform:translateY(20px);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards;}
.d1{animation-delay:.05s}.d2{animation-delay:.2s}.d3{animation-delay:.35s}.d4{animation-delay:.5s}.d5{animation-delay:.65s}
@keyframes rise{to{opacity:1;transform:none;}}

/* ============================================================ MARQUEE ============================================================ */
.strip{border-block:1px solid var(--line);background:var(--surface);overflow:hidden;}
.strip__track{display:flex;gap:3.5rem;white-space:nowrap;padding-block:1.15rem;
  animation:slide 28s linear infinite;width:max-content;}
.strip__track span{font-family:var(--display);font-style:italic;font-size:1.05rem;color:var(--text-dim);
  display:inline-flex;align-items:center;gap:3.5rem;}
@keyframes slide{to{transform:translateX(-50%);}}

/* ============================================================ ANCIENT FUTURE COLLECTION ============================================================ */
.collection{padding-block:var(--section);background:var(--bg);position:relative;overflow:hidden;}
.collection::before{content:"";position:absolute;left:50%;top:-8%;transform:translateX(-50%);
  width:min(60vw,640px);height:min(60vw,640px);background:radial-gradient(circle,var(--gold-soft),transparent 62%);pointer-events:none;}
.collection__head{max-width:60ch;margin:0 auto clamp(2.6rem,5vw,4.2rem);text-align:center;position:relative;}
.collection__head .eyebrow{display:block;margin-bottom:1.4rem;}
.collection__title{font-family:var(--display);font-weight:500;line-height:.95;letter-spacing:-.015em;
  font-size:clamp(2.8rem,8vw,5.6rem);color:var(--text);}
.collection__title em{font-style:italic;color:var(--gold);}
.collection__lede{margin:1.8rem auto 0;max-width:54ch;}
.collection__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;position:relative;}
.motif{display:block;}
.motif__media{position:relative;aspect-ratio:4/5;background:linear-gradient(160deg,var(--surface-2),var(--surface));
  border:1px solid var(--gold-line);overflow:hidden;display:flex;align-items:center;justify-content:center;
  transition:border-color .4s ease,box-shadow .4s ease;}
.motif__media::before{content:"";position:absolute;inset:12px;border:1px solid var(--line);z-index:2;pointer-events:none;}
.motif__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1);}
.motif:hover .motif__media{border-color:var(--gold);box-shadow:var(--shadow);}
.motif:hover .motif__media img{transform:scale(1.05);}
.motif__mark{width:46%;opacity:.55;fill:none;stroke:var(--gold);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.motif__index{position:absolute;top:16px;left:16px;z-index:3;font-family:var(--display);font-size:1rem;color:var(--muted);}
.motif__note-empty{position:absolute;bottom:16px;right:16px;z-index:3;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);}
.motif__body{padding-top:1.1rem;}
.motif__title{font-family:var(--display);font-size:1.3rem;font-weight:500;color:var(--text);}
.motif__note{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:.4rem;}
.collection__cta{text-align:center;margin-top:clamp(2.5rem,5vw,3.5rem);}

/* ============================================================ STORY ============================================================ */
.story{padding-block:var(--section);background:var(--bg);}
.story__inner{display:grid;grid-template-columns:auto 1fr;gap:clamp(2rem,6vw,6rem);align-items:center;}
.story__glyph{width:clamp(90px,12vw,150px);}
.story__glyph .mark{stroke-width:2.4;}
.story blockquote{max-width:54ch;}
.story__proverb{font-family:var(--display);font-style:italic;font-weight:500;
  font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:1.22;color:var(--text);margin:1.4rem 0;}
.story__trans{color:var(--muted);font-size:.95rem;margin-bottom:1.8rem;font-style:normal;}
.story p:not(.eyebrow):not(.story__trans){color:var(--text-dim);max-width:52ch;margin-bottom:1.8rem;}

/* ============================================================ PRODUCTS ============================================================ */
.drop{padding-block:var(--section);background:var(--surface);border-block:1px solid var(--line);}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:clamp(2.5rem,5vw,4rem);}
.sec-head h2{font-family:var(--display);font-size:clamp(2rem,4.4vw,3.4rem);font-weight:500;line-height:1;color:var(--text);}
.sec-head .eyebrow{margin-bottom:1rem;display:block;}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem;}
.card{display:block;}
.card__media{position:relative;aspect-ratio:4/5;background:var(--surface-2);border:1px solid var(--line);
  overflow:hidden;display:flex;align-items:center;justify-content:center;transition:border-color .4s ease,box-shadow .4s ease;}
body.mode-light .card__media{box-shadow:var(--shadow);}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1);}
.card__media .tee{width:62%;transition:transform .6s cubic-bezier(.2,.7,.2,1);}
.card:hover .card__media{border-color:var(--gold-line);}
.card:hover .tee,.card:hover .card__media img{transform:scale(1.05);}
.card__flag{position:absolute;top:14px;left:14px;z-index:2;font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--on-gold);background:var(--gold);padding:.5em .85em;font-weight:500;}
.card__quick{position:absolute;inset-inline:14px;bottom:14px;z-index:2;text-align:center;
  background:rgba(18,17,16,.82);backdrop-filter:blur(6px);color:#F7F4EE;font-size:.66rem;letter-spacing:.22em;
  text-transform:uppercase;padding:.9em;opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .4s ease;}
.card:hover .card__quick{opacity:1;transform:none;}
.card__body{padding-top:1.1rem;display:flex;justify-content:space-between;align-items:baseline;gap:1rem;}
.card__name{font-family:var(--display);font-size:1.12rem;font-weight:500;color:var(--text);}
.card__meta{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:.35rem;}
.card__price{font-size:.95rem;color:var(--gold);font-weight:400;white-space:nowrap;}
.card__price del{color:var(--muted);opacity:.7;margin-right:.4em;}
.card__price ins{text-decoration:none;}

.tee .body{fill:var(--gold-soft);stroke:var(--muted);stroke-width:2;}
.tee .glyph{fill:none;stroke:var(--gold);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.tee--script .glyph{display:none;}
.tee--script text{fill:var(--gold);font-family:var(--display);font-style:italic;}

/* ============================================================ EDITORIAL BAND ============================================================ */
.editorial{padding-block:var(--section);background:var(--contrast-bg);color:var(--contrast-text);position:relative;overflow:hidden;}
.editorial::before{content:"";position:absolute;right:-6%;top:-10%;width:min(40vw,460px);height:min(40vw,460px);
  background:radial-gradient(circle,rgba(201,168,106,.14),transparent 65%);}
.editorial__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;position:relative;}
.editorial__media{aspect-ratio:5/6;border:1px solid var(--gold-line);position:relative;
  background:linear-gradient(150deg,#221F1C,#181614);overflow:hidden;display:flex;align-items:center;justify-content:center;}
.editorial__media::before{content:"";position:absolute;inset:14px;border:1px solid var(--contrast-line);z-index:2;}
.editorial__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.editorial__media .watermark{width:40%;opacity:.45;}
.editorial__media .label{position:absolute;bottom:18px;left:18px;z-index:3;font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}
.editorial h2{font-family:var(--display);font-weight:500;line-height:1.02;font-size:clamp(2rem,4.4vw,3.4rem);color:var(--contrast-text);margin:1rem 0 1.6rem;}
.editorial p{color:var(--contrast-text-dim);max-width:46ch;margin-bottom:1.4rem;}
.editorial ul{margin:0 0 2rem;}
.editorial li{display:flex;gap:.9rem;align-items:flex-start;padding-block:.7rem;border-top:1px solid var(--contrast-line);color:var(--contrast-text-dim);font-size:.95rem;}
.editorial li:last-child{border-bottom:1px solid var(--contrast-line);}
.editorial li svg{width:16px;height:16px;flex:none;margin-top:.35rem;}

/* ============================================================ CATEGORIES ============================================================ */
.cats{padding-block:var(--section);background:var(--surface);border-top:1px solid var(--line);}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;}
.cat{position:relative;aspect-ratio:1/1.15;border:1px solid var(--line);
  background:linear-gradient(165deg,var(--surface-2),var(--bg));padding:2rem;display:flex;flex-direction:column;
  justify-content:space-between;transition:border-color .4s ease,transform .4s ease,box-shadow .4s ease;overflow:hidden;}
.cat:hover{border-color:var(--gold-line);transform:translateY(-4px);box-shadow:var(--shadow);}
.cat__glyph{width:54px;opacity:.8;}
.cat__glyph .mark{stroke-width:3;}
.cat h3{font-family:var(--display);font-size:1.7rem;font-weight:500;color:var(--text);}
.cat__status{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;}
.cat__status.live{color:var(--gold);}
.cat__status.soon{color:var(--muted);}
.cat p{color:var(--text-dim);font-size:.92rem;margin-top:.6rem;max-width:30ch;}
.cat__index{position:absolute;top:1.5rem;right:1.8rem;font-family:var(--display);font-size:1rem;color:var(--muted);}

/* ============================================================ NEWSLETTER ============================================================ */
.list{padding-block:var(--section);background:var(--bg);text-align:center;border-top:1px solid var(--line);}
.list .wrap{max-width:760px;}
.list .mark-lg{width:60px;margin:0 auto 2rem;}
.list h2{font-family:var(--display);font-weight:500;font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.04;color:var(--text);margin-bottom:1.2rem;}
.list p{color:var(--text-dim);max-width:48ch;margin:0 auto 2.6rem;}
.form{display:flex;gap:.8rem;max-width:480px;margin:0 auto;flex-wrap:wrap;}
.form input{flex:1;min-width:200px;background:transparent;border:1px solid var(--line-strong);color:var(--text);
  font-family:var(--sans);font-size:.9rem;padding:1.05em 1.3em;transition:border-color .3s ease;}
.form input::placeholder{color:var(--muted);letter-spacing:.05em;}
.form input:focus{outline:none;border-color:var(--gold);}
.form__note{margin-top:1.4rem;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.form__done{color:var(--gold);font-family:var(--display);font-style:italic;font-size:1.2rem;display:none;margin-top:1rem;}

/* ============================================================ FOOTER ============================================================ */
footer.site-footer{background:var(--footer-bg);color:var(--contrast-text);border-top:1px solid var(--contrast-line);padding-block:clamp(3.5rem,7vw,6rem) 2.5rem;}
.foot__top{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:2.5rem;padding-bottom:3.5rem;border-bottom:1px solid var(--contrast-line);}
.foot__brand .brand{margin-bottom:1.4rem;}
.foot__brand .brand__name{color:var(--contrast-text);}
.foot__brand p{color:var(--muted);font-size:.88rem;max-width:30ch;}
.foot__col h4{font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:1.3rem;}
.foot__col a{display:block;color:var(--contrast-text-dim);font-size:.86rem;padding-block:.42rem;transition:color .3s ease;}
.foot__col a:hover{color:var(--gold);}
.foot__col ul{margin:0;}
.foot__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;padding-top:2rem;}
.foot__bottom p{font-size:.7rem;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;}
.foot__pay{display:flex;gap:.7rem;flex-wrap:wrap;}
.foot__pay span{font-size:.6rem;letter-spacing:.14em;color:var(--muted);border:1px solid var(--contrast-line);padding:.45em .7em;text-transform:uppercase;}

/* ============================================================ SCROLL REVEAL ============================================================ */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);}
[data-reveal].is-in{opacity:1;transform:none;}

/* ============================================================ WOOCOMMERCE ============================================================ */
.woo-wrap{padding-block:clamp(2.5rem,6vw,5rem);}
.woocommerce .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce .woocommerce-message a.button{
  background:var(--gold);color:var(--on-gold);font-family:var(--sans);font-size:.74rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;padding:1em 2em;border-radius:0;border:none;transition:background .3s ease,transform .3s ease;}
.woocommerce .button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,
.woocommerce input.button:hover,.woocommerce #respond input#submit:hover{background:var(--text);color:var(--bg);transform:translateY(-2px);}
.woocommerce ul.products li.product .price,.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--gold);font-family:var(--sans);}
.woocommerce ul.products li.product h2,.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--display);color:var(--text);}
.woocommerce div.product .product_title{font-family:var(--display);color:var(--text);}
.woocommerce-breadcrumb{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.woocommerce span.onsale{background:var(--gold);color:var(--on-gold);}
.woocommerce .star-rating span{color:var(--gold);}
.woocommerce-store-notice,p.demo_store{background:var(--gold);color:var(--on-gold);}

/* Form controls — keep inputs/selects legible in both modes (fixes invisible
   variation dropdowns on product pages). */
select,
textarea,
.site-main input[type="text"],
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce table.variations select,
.woocommerce .quantity input.qty{
  background-color:var(--surface-2);
  color:var(--text);
  border:1px solid var(--line-strong);
  border-radius:0;
  padding:.7em .9em;
  font-family:var(--sans);
}
select:focus,textarea:focus,.woocommerce form .form-row input.input-text:focus{outline:none;border-color:var(--gold);}
/* Native dropdown option list — explicit per mode so it never renders
   text-on-same-colour. */
select option{background-color:#181614;color:#F7F4EE;}
body.mode-light select option{background-color:#F7F4EE;color:#1A1714;}
.woocommerce table.variations td.value{position:relative;}
.woocommerce a.reset_variations{color:var(--muted);}

/* ============================================================ RESPONSIVE ============================================================ */
@media(max-width:1000px){
  .grid4{grid-template-columns:repeat(2,1fr);}
  .foot__top{grid-template-columns:1fr 1fr;}
  .foot__brand{grid-column:1/-1;}
}
@media(max-width:860px){
  .nav__links{display:none;}
  .nav__utils .iconbtn.search{display:none;}
  .burger{display:flex;}
  .hero__grid{grid-template-columns:1fr;}
  .hero__frame{order:-1;max-height:48vh;aspect-ratio:16/10;}
  .story__inner{grid-template-columns:1fr;}
  .editorial__inner{grid-template-columns:1fr;}
  .editorial__media{order:-1;aspect-ratio:16/11;}
  .grid3{grid-template-columns:1fr;}
  .collection__grid{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .grid4{grid-template-columns:1fr 1fr;gap:1rem;}
  .foot__top{grid-template-columns:1fr;}
  .hero__meta{gap:1.6rem;}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
  [data-reveal],.reveal-load{opacity:1;transform:none;}
}