/* True Heritage v2 · production additions for the Home v2 template.
   Everything visual comes from th-system.css (verbatim Home v2). This file only adds what
   the mock-up didn't need: real images, cart states, fallbacks and small-screen fixes. */

html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body.th2{margin:0;background:#08090D}
.th2-root *,.th2-root *::before,.th2-root *::after{box-sizing:border-box}
.th2-root img{max-width:100%}
.th2-root a{color:inherit;text-decoration:none}
.th2-root h1,.th2-root h2,.th2-root h3{text-wrap:balance}
/* 0.2.2 guard: Avada can still print CSS straight into <head> (critical / dynamic CSS) after the
   plugin has removed its stylesheets. Keep v2 headings on the page's own colour and font
   (staging QA: AI page headings came out dark grey on a white box). Classes and inline styles still win. */
.th2-root :is(h1,h2,h3,h4,h5,h6){color:inherit;font-family:inherit}
.th2-root .subhero,.th2-root [data-th2-hero]{background-color:#08090D}
/* Home v2 sets display inline on cards etc.; make the hidden attribute always win */
.th2-root [hidden],[data-th2-toast][hidden]{display:none!important}

/* skip link */
.th2-skip{position:absolute;left:16px;top:-80px;z-index:100000;padding:12px 18px;background:#FAFBFF;color:#08090D;font:700 15px 'Space Grotesk',sans-serif;border-radius:999px}
.th2-skip:focus,.th2-skip:focus-visible{top:calc(16px + var(--wp-admin--admin-bar--height, 0px));outline:3px solid #00E4CD;outline-offset:3px}
#shop:focus,#th2-main:focus{outline:none}
.th2-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* product images inside the Home v2 boxes */
.th2-img{display:block;width:100%;height:100%}
.th2-fit-contain{object-fit:contain;background:transparent}
/* 0.3.6: fitted artwork (vector CADs, graphics) is usually drawn on a white background. It sits on a soft
   light tile and blends into it, so no hard white rectangle shows inside the dark card; photos and
   swatches still fill their box edge to edge. */
.th2-tile{background:radial-gradient(circle at 30% 25%,#FFFFFF,#ECEEF4 78%)!important}
.th2-tile .th2-img{mix-blend-mode:multiply;padding:7%;box-sizing:border-box}
.th2-fit-cover{object-fit:cover}
.th2-noimg{display:block;width:40%;aspect-ratio:1/1;border:1px dashed rgba(250,251,255,.25);border-radius:50%}
.th2-imgbox:focus-visible{outline:3px solid #00E4CD;outline-offset:3px}
.th2-featimg .th2-img{transition:opacity .35s ease}
.th2-featimg.is-swapping .th2-img{opacity:0}

/* featured dots (Home v2 numbers with growing accent line) */
[data-th2-dot]{min-height:44px;padding:0 8px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;gap:8px;font:700 13px 'Space Grotesk',sans-serif;color:#6B7083;transition:color .4s,font-size .4s}
[data-th2-dot] span{display:block;width:0;height:2px;background:var(--dc);transition:width .4s}
[data-th2-dot][aria-pressed="true"]{color:#FAFBFF;font-size:20px}
[data-th2-dot][aria-pressed="true"] span{width:22px;box-shadow:0 0 10px var(--dc)}

/* add-to-cart states on Home v2's sliding "rm" button */
.rm{white-space:nowrap}
.rm[aria-busy="true"]{opacity:.65;pointer-events:none}
.rm.is-added{border-color:#00E4CD}
.rm.is-error{border-color:#FF6B6B}

/* "show all" + sale filter chip */
.th2-more{display:flex;justify-content:center;margin-top:40px}
.th2-chip-x{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border:1px solid #00E4CD;border-radius:18px;background:rgba(0,228,205,.12);color:#FAFBFF;font:500 12px 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}

/* toast */
.th2-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:100001;transform:translateX(-50%);display:flex;align-items:center;gap:16px;max-width:calc(100% - 32px);padding:12px 12px 12px 20px;border-radius:999px;background:#FAFBFF;color:#08090D;font:700 15px 'Space Grotesk',sans-serif;box-shadow:0 0 40px rgba(250,251,255,.35);animation:fd .35s ease both}
.th2-toast a{padding:8px 14px;border-radius:999px;background:#08090D;color:#FAFBFF;white-space:nowrap}
.th2-toast.is-error{background:#FFE1E1}

/* 3D badge fallbacks: shown when the engine isn't loaded (no WebGL 2, reduced motion, or it failed) */
.th2-intro-still,.th2-badge-still{display:none}
html.th2-nogl .th2-badge-scene{height:auto!important}
html.th2-nogl .th2-badge-scene>div{position:relative!important;height:auto!important;padding:96px 16px;display:flex;justify-content:center}
html.th2-nogl .th2-badge-scene [data-th2-badge-slot]{display:none}
html.th2-nogl .th2-badge-still{display:block;width:min(560px,86vw)}
html.th2-nogl .th2-badge-still svg{width:100%;height:auto}
#th2-intro.is-still [data-th-badge]{display:none}
#th2-intro.is-still .th2-intro-still{display:flex;position:absolute;top:0;left:0;right:0;bottom:0;align-items:center;justify-content:center}
#th2-intro.is-still .th2-intro-still svg{width:min(420px,78vw);height:auto}
#th2-intro.is-leaving{transition:opacity .7s ease;opacity:0}

/* Elements placed by WordPress (admin bar) */
body.th2.admin-bar #th2-intro{top:32px}
@media (max-width:782px){body.th2.admin-bar #th2-intro{top:46px}}

/* newsletter form slot: keep third-party form fields on-brand */
.th2-newsletter input[type="email"],.th2-newsletter input[type="text"]{width:100%;min-height:52px;padding:0 16px;border:1px solid rgba(250,251,255,.28);border-radius:14px;background:rgba(16,18,27,.72);color:#FAFBFF;font:17px 'Space Grotesk',sans-serif}
.th2-newsletter button,.th2-newsletter input[type="submit"]{min-height:48px;padding:0 24px;border:0;border-radius:999px;background:#FAFBFF;color:#08090D;font:700 16px 'Space Grotesk',sans-serif;cursor:pointer}

/* small screens: Home v2's desktop sizes scale down */
@media (max-width:600px){
  .th2-wrap{padding-left:max(16px,env(safe-area-inset-left,0px))!important;padding-right:max(16px,env(safe-area-inset-right,0px))!important}
  .th2-h2{font-size:clamp(36px,10vw,64px)!important}
  .th2-promo-num{font-size:clamp(56px,17vw,104px)!important}
  .th2-promo-head{font-size:clamp(28px,8vw,44px)!important}
  .th2-pad{padding:28px!important;min-height:0!important}
  .lamp .lt{min-width:62px}
}

@media (prefers-reduced-motion: reduce){
  .th2-toast,.th2-featimg .th2-img,[data-th2-dot],[data-th2-dot] span{animation:none!important;transition:none!important}
}

/* 0.3.0 · header menu with the "street light" from the category lamp bar (owner request, 3 Nov).
   0.3.1 · each tab has its own colour (--c, set per link), like the category bar.
   The current page is lit (bar + light cone + coloured label); hover/focus shows a faint version. */
.th2-navlamp{display:flex;align-items:stretch;max-width:100%;overflow-x:auto;scrollbar-width:none;background:rgba(16,18,27,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(250,251,255,.12);border-radius:18px;padding:0 4px;box-shadow:0 24px 50px -24px rgba(0,0,0,.9)}
.th2-navlamp::-webkit-scrollbar{display:none}
.th2-navlamp .nl{--c:#FAFBFF;position:relative;display:flex;align-items:center;justify-content:center;min-height:54px;padding:0 16px;white-space:nowrap;color:rgba(250,251,255,.55);transition:color .45s,text-shadow .45s}
.th2-navlamp .nl::before{content:'';position:absolute;top:0;left:50%;width:42px;height:4px;border-radius:0 0 4px 4px;background:var(--c);box-shadow:0 0 14px var(--c),0 0 28px var(--c);transform:translateX(-50%) scaleX(0);transition:transform .45s cubic-bezier(.3,1.3,.5,1);pointer-events:none}
.th2-navlamp .nl::after{content:'';position:absolute;top:4px;left:50%;right:auto;bottom:0;width:calc(100% + 24px);max-width:120px;height:auto;transform:translateX(-50%);transform-origin:center;background:linear-gradient(180deg,var(--c),transparent);clip-path:polygon(32% 0,68% 0,100% 100%,0 100%);opacity:0;transition:opacity .45s;pointer-events:none}
.th2-navlamp .nl:hover,.th2-navlamp .nl:focus-visible{color:var(--c)}
.th2-navlamp .nl:hover::before,.th2-navlamp .nl:focus-visible::before{transform:translateX(-50%) scaleX(.6)}
.th2-navlamp .nl:hover::after,.th2-navlamp .nl:focus-visible::after{transform:translateX(-50%);opacity:.12}
.th2-navlamp .nl[aria-current="page"]{color:var(--c);text-shadow:0 0 12px var(--c)}
.th2-navlamp .nl[aria-current="page"]::before{transform:translateX(-50%) scaleX(1)}
.th2-navlamp .nl[aria-current="page"]::after{transform:translateX(-50%);opacity:.26}
.th2-navright{min-width:0;max-width:100%}
@media (max-width:760px){.th2-navright{flex:1 1 100%}.th2-navlamp{flex:1 1 100%}.th2-navlamp .nl{flex:1 0 auto;padding:0 12px;min-height:50px}}

/* 0.3.0 · secondary buttons with Home v2's moving light orbiting the edge (owner request: "Apply to sell") */
.gbtn.th2-orbit::before{content:'';position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:inherit;padding:2px;background:conic-gradient(from var(--a),transparent 0deg,transparent 235deg,var(--lit,#A855F7) 300deg,#FAFBFF 346deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 4s linear infinite;opacity:.9;transition:opacity .4s;pointer-events:none}
.gbtn.th2-orbit{border:1px solid rgba(250,251,255,.16)}
.gbtn.th2-orbit:hover::before,.gbtn.th2-orbit:focus-visible::before{opacity:1;animation-duration:2s}

/* 0.3.5: the Add button is a switch (Live · Home switch). ON = in the cart, card turns white. */
.th2-addsw{display:inline-block;width:116px;text-decoration:none;text-transform:uppercase}
.th2-addsw .swk{transform:translateX(54px)}
.th2-addsw[aria-checked="true"] .swk{transform:none}
.th2-addsw .swo{left:16px;color:#FAFBFF;text-shadow:0 0 10px var(--lit)}
.th2-addsw .swn{right:12px}
.th2-addsw::after{background:radial-gradient(circle at 30% 50%,var(--lit),transparent 80%);opacity:.4}
.th2-addsw:not([aria-checked="true"]){box-shadow:inset 0 3px 8px rgba(0,0,0,.85),0 0 0 2px #1d1f2a,0 0 22px -6px var(--lit)}
.th2-addsw[aria-busy="true"]{opacity:.65;pointer-events:none}
.th2-addsw.is-error{box-shadow:inset 0 3px 8px rgba(0,0,0,.85),0 0 0 2px #FF6B6B}
.th2-addsw:focus-visible{outline:2px solid var(--lit);outline-offset:3px}

/* Band layer for th2_design_bands() (the design's 820×190 / 960×210 bands, repeated down each section). */
.th2-wbands{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none}
.th2-band-v{background:linear-gradient(180deg,rgba(58,30,98,.9),rgba(22,15,40,.9))!important;border-color:rgba(168,85,247,.16)!important}

/* 0.3.6: soft section edges. Each section clips its own smoke and bands, which left hard horizontal
   seams between sections (most visible on phones). The background now fades to the page black at the top
   and bottom of these sections, so one section flows into the next. Content stays above the fade. */
.th2-softedge::before,.th2-softedge::after{content:'';position:absolute;left:0;right:0;height:min(160px,18vh);pointer-events:none;z-index:1}
.th2-softedge::before{top:0;background:linear-gradient(180deg,#08090D,rgba(8,9,13,0))}
.th2-softedge::after{bottom:0;background:linear-gradient(0deg,#08090D,rgba(8,9,13,0))}
.th2-softedge>.th2-wrap{z-index:2}

/* 0.3.8: language switcher, a compact dropdown in the v2 header (built-in languages, or Polylang/WPML) */
/* the header sits above hero content (the featured card's tilt animation makes its own layer) so the menu is never hidden */
.th2-root nav.in.d1{position:relative;z-index:30}
.th2-lang{position:relative;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.04em;text-transform:none}
.th2-lang summary{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid rgba(250,251,255,.25);border-radius:20px;color:#FAFBFF;cursor:pointer;list-style:none;user-select:none}
.th2-lang summary::-webkit-details-marker{display:none}
.th2-lang summary:hover{border-color:#FAFBFF}
.th2-lang summary:focus-visible{outline:2px solid #00E4CD;outline-offset:2px}
.th2-lang-caret{font-size:10px;opacity:.7;transition:transform .2s}
.th2-lang[open] .th2-lang-caret{transform:rotate(180deg)}
.th2-lang-menu{position:absolute;top:calc(100% + 8px);inset-inline-end:0;z-index:50;min-width:180px;max-height:min(70vh,440px);overflow:auto;padding:6px;border:1px solid rgba(250,251,255,.18);border-radius:14px;background:rgba(10,11,18,.97);box-shadow:0 18px 40px -12px rgba(0,0,0,.8),0 0 30px -12px rgba(168,85,247,.5);backdrop-filter:blur(14px)}
.th2-lang-menu ul{margin:0;padding:0;list-style:none}
@media (max-width:760px){.th2-lang-menu{inset-inline-end:auto;inset-inline-start:0}}
.th2-lang-menu a{display:flex;align-items:center;min-height:40px;padding:0 12px;border-radius:9px;color:#C3C7D9;font-family:'Space Grotesk',sans-serif;font-size:15px;letter-spacing:0;text-decoration:none}
.th2-lang-menu a:hover,.th2-lang-menu a:focus-visible{background:rgba(250,251,255,.08);color:#FAFBFF;outline:none}
.th2-lang-menu a.on{background:#FAFBFF;color:#08090D}

/* 0.3.6: Chinese (Simplified) and Hindi. The design's Latin fonts have no Chinese or Devanagari letters,
   so those characters use good system fonts (unicode-range keeps Latin text in the design fonts).
   Tight Latin letter-spacing and line-heights are relaxed so the scripts read and never clip. */
@font-face{font-family:'Space Grotesk';src:local('PingFang SC'),local('Hiragino Sans GB'),local('Microsoft YaHei'),local('Noto Sans CJK SC'),local('Noto Sans SC'),local('Source Han Sans SC');unicode-range:U+2E80-2FDF,U+3000-303F,U+3400-4DBF,U+4E00-9FFF,U+F900-FAFF,U+FF00-FFEF}
@font-face{font-family:'Space Grotesk';src:local('Nirmala UI'),local('Kohinoor Devanagari'),local('Noto Sans Devanagari'),local('Mangal');unicode-range:U+0900-097F,U+A8E0-A8FF,U+1CD0-1CFF}
@font-face{font-family:'IBM Plex Mono';src:local('PingFang SC'),local('Microsoft YaHei'),local('Noto Sans CJK SC'),local('Noto Sans SC');unicode-range:U+2E80-2FDF,U+3000-303F,U+3400-4DBF,U+4E00-9FFF,U+F900-FAFF,U+FF00-FFEF}
@font-face{font-family:'IBM Plex Mono';src:local('Nirmala UI'),local('Kohinoor Devanagari'),local('Noto Sans Devanagari'),local('Mangal');unicode-range:U+0900-097F,U+A8E0-A8FF,U+1CD0-1CFF}
@font-face{font-family:'Saira Condensed';src:local('PingFang SC'),local('Microsoft YaHei'),local('Noto Sans CJK SC'),local('Noto Sans SC');unicode-range:U+2E80-2FDF,U+3000-303F,U+3400-4DBF,U+4E00-9FFF,U+F900-FAFF,U+FF00-FFEF}
@font-face{font-family:'Saira Condensed';src:local('Nirmala UI'),local('Kohinoor Devanagari'),local('Noto Sans Devanagari'),local('Mangal');unicode-range:U+0900-097F,U+A8E0-A8FF,U+1CD0-1CFF}
@font-face{font-family:'Space Grotesk';src:local('Geeza Pro'),local('Segoe UI'),local('Noto Sans Arabic'),local('Tahoma');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:'Space Grotesk';src:local('Kohinoor Bangla'),local('Nirmala UI'),local('Noto Sans Bengali'),local('Vrinda');unicode-range:U+0980-09FF}
@font-face{font-family:'IBM Plex Mono';src:local('Geeza Pro'),local('Segoe UI'),local('Noto Sans Arabic'),local('Tahoma');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:'IBM Plex Mono';src:local('Kohinoor Bangla'),local('Nirmala UI'),local('Noto Sans Bengali'),local('Vrinda');unicode-range:U+0980-09FF}
@font-face{font-family:'Saira Condensed';src:local('Geeza Pro'),local('Segoe UI'),local('Noto Sans Arabic'),local('Tahoma');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:'Saira Condensed';src:local('Kohinoor Bangla'),local('Nirmala UI'),local('Noto Sans Bengali'),local('Vrinda');unicode-range:U+0980-09FF}
/* Arabic and Urdu letters join up, so they must never be letter-spaced; Bengali and Urdu need taller lines. */
html:lang(zh) .th2-root *,html:lang(hi) .th2-root *,html:lang(ar) .th2-root *,html:lang(ur) .th2-root *,html:lang(bn) .th2-root *,html:lang(bn-BD) .th2-root *{letter-spacing:normal!important}
html:lang(bn) .th2-root :is(h1,h2,h3,.th2-h1,.th2-h2,.th2-h3,.th2-big,.gl),html:lang(bn-BD) .th2-root :is(h1,h2,h3,.th2-h1,.th2-h2,.th2-h3,.th2-big,.gl){line-height:1.3!important}
html:lang(ar) .th2-root :is(h1,h2,h3,.th2-h1,.th2-h2,.th2-h3,.th2-big,.gl){line-height:1.25!important}
html:lang(ur) .th2-root :is(h1,h2,h3,.th2-h1,.th2-h2,.th2-h3,.th2-big,.gl){line-height:1.45!important}
html:lang(ur) .th2-root :is(p,li,label,.th2-lead,.th2-muted),html:lang(ar) .th2-root :is(p,li,label,.th2-lead,.th2-muted){line-height:1.8}
/* Right-to-left (Arabic, Urdu): text starts on the right; flex rows mirror automatically. */
html[dir=rtl] .th2-root{text-align:start}
html[dir=rtl] .th2-root .ar,html[dir=rtl] .th2-root .th2-arrow{display:inline-block;transform:scaleX(-1)}
html[dir=rtl] .th2-skip{left:auto;right:16px}
html[dir=rtl] .vsoc{right:auto!important;left:24px}

html:lang(zh) .th2-root{line-break:strict;word-break:normal}
html:lang(zh) .th2-root :is(h1,h2,h3,.th2-h1,.th2-h2,.th2-h3,.th2-big){line-height:1.2!important}
html:lang(hi) .th2-root :is(h1,h2,h3,.th2-h1,.th2-h2,.th2-h3,.th2-big,.gl){line-height:1.35!important}
html:lang(hi) .th2-root :is(p,li,label,.th2-lead,.th2-muted){line-height:1.7}

@media (prefers-reduced-motion: reduce){
  .th2-navlamp .nl,.th2-navlamp .nl::before,.th2-navlamp .nl::after,.th2-addsw .swk{transition:none!important}
  .gbtn.th2-orbit::before{animation:none!important}
}