/* MintMade design styles — ported verbatim from the mintmade-v2_22.html mockup. */
/* ─────────────────────────────────
   TOKENS
───────────────────────────────── */
:root{
  --dark:#0A0F0D;--deep:#085041;--mid:#0F6E56;--mint:#1D9E75;
  --light-mint:#5DCAA5;--pale-mint:#E1F5EE;--white:#F5FAF8;
  --muted:rgba(93,202,165,0.45);--border:rgba(93,202,165,0.15);
  --border-mid:rgba(93,202,165,0.28);
}

/* ─────────────────────────────────
   RESET
───────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto}
body{background:var(--dark);color:var(--white);font-family:'DM Sans',sans-serif;font-weight:400;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
button{cursor:pointer;font-family:inherit}
a{text-decoration:none;color:inherit}

/* ─────────────────────────────────
   TRUST STRIP
───────────────────────────────── */
/* Only scroll on screens too narrow to show all items */
@media(max-width:860px){
}
/* On wide screens: centre items, hide duplicate set */
@media(min-width:861px){
}

/* ─────────────────────────────────
   BREADCRUMB
───────────────────────────────── */
.breadcrumb{display:flex;align-items:center;gap:6px;font-size:11px;color:rgba(245,250,248,0.3);letter-spacing:0.5px;text-transform:uppercase;margin-bottom:32px;flex-wrap:wrap}
.breadcrumb a{cursor:pointer;transition:color 0.2s}
.breadcrumb a:hover{color:var(--light-mint)}
.breadcrumb-sep{opacity:0.3}
.breadcrumb-current{color:rgba(245,250,248,0.55)}

/* ─────────────────────────────────
   STICKY ADD TO CART BAR
───────────────────────────────── */
.sticky-atc{position:fixed;bottom:0;left:0;right:0;z-index:150;background:rgba(10,15,13,0.97);border-top:1px solid var(--border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;transform:translateY(100%);transition:transform 0.3s cubic-bezier(0.4,0,0.2,1)}
.sticky-atc.visible{transform:translateY(0)}
.sticky-atc-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.sticky-atc-name{font-family:'DM Serif Display',serif;font-size:17px;color:var(--white);letter-spacing:-0.3px;white-space:nowrap}
.sticky-atc-price{font-size:13px;color:var(--light-mint);font-weight:500}
.sticky-atc-btn{background:var(--mint);color:white;border:none;border-radius:4px;padding:12px 28px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;cursor:pointer;transition:background 0.2s;flex-shrink:0;white-space:nowrap}
.sticky-atc-btn:hover{background:var(--light-mint)}
.sticky-atc-btn:disabled{opacity:0.4;cursor:not-allowed}
.sticky-atc-btn.enquiry-mode{background:rgba(93,202,165,0.12);color:var(--light-mint);border:1px solid var(--border-mid)}
.sticky-atc-btn.enquiry-mode:hover{background:rgba(93,202,165,0.2)}
@media(min-width:861px){.sticky-atc{display:none}}

/* ─────────────────────────────────
   BACK TO TOP
───────────────────────────────── */
.back-to-top{position:fixed;bottom:80px;right:24px;z-index:140;background:rgba(15,110,86,0.8);border:1px solid var(--border-mid);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;pointer-events:none;transition:opacity 0.3s,background 0.2s;backdrop-filter:blur(8px)}
.back-to-top.visible{opacity:1;pointer-events:all}
.back-to-top:hover{background:var(--mint)}
.back-to-top svg{color:white}

/* ─────────────────────────────────
   TESTIMONIALS
───────────────────────────────── */
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.testimonial-card{background:rgba(8,80,65,0.25);border:1px solid var(--border);border-radius:8px;padding:24px;transition:border-color 0.2s}
.testimonial-card:hover{border-color:var(--border-mid)}
.testimonial-stars{display:flex;gap:3px;margin-bottom:12px}
.testimonial-star{color:var(--light-mint);font-size:14px}
.testimonial-text{font-size:14px;color:rgba(245,250,248,0.65);line-height:1.75;font-weight:300;margin-bottom:16px;font-style:italic}
.testimonial-text::before{content:'"';color:var(--light-mint);font-family:'DM Serif Display',serif;font-size:24px;line-height:0;vertical-align:-8px;margin-right:2px}
.testimonial-text::after{content:'"';color:var(--light-mint);font-family:'DM Serif Display',serif;font-size:24px;line-height:0;vertical-align:-8px;margin-left:2px}
.testimonial-author{display:flex;align-items:center;gap:10px}
.testimonial-avatar{width:32px;height:32px;border-radius:50%;background:var(--mid);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--light-mint);flex-shrink:0}
.testimonial-name{font-size:13px;font-weight:500;color:var(--white)}
.testimonial-meta{font-size:11px;color:rgba(245,250,248,0.35);margin-top:1px}
.testimonials-note{text-align:center;margin-top:24px;font-size:12px;color:rgba(245,250,248,0.3);font-style:italic}

/* ─────────────────────────────────
   CUSTOMER PHOTOS
───────────────────────────────── */
.ugc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ugc-item{aspect-ratio:1;background:var(--deep);border-radius:6px;border:1px solid var(--border);overflow:hidden;position:relative;cursor:pointer;transition:border-color 0.2s,transform 0.2s}
.ugc-item:hover{border-color:var(--border-mid);transform:scale(1.02)}
.ugc-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.ugc-placeholder svg{opacity:0.2;width:28px;height:28px}
.ugc-placeholder span{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(245,250,248,0.2)}
.ugc-label{text-align:center;margin-top:20px;font-size:12px;color:rgba(245,250,248,0.35)}
.ugc-label strong{color:var(--light-mint);font-weight:500}

/* ─────────────────────────────────
   RESPONSIVE ADDITIONS
───────────────────────────────── */
@media(max-width:860px){

    .testimonials-grid{grid-template-columns:1fr}
  .ugc-grid{grid-template-columns:repeat(2,1fr)}
  .sticky-atc{padding:10px 16px}
  .sticky-atc-name{font-size:15px}
  .back-to-top{bottom:72px;right:16px}
}
@media(max-width:480px){

  .ugc-grid{grid-template-columns:repeat(2,1fr);gap:8px}
}

body::before{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(/%23n)' opacity='0.04'/%3E%3C/svg%3E");pointer-events:none;z-index:999;opacity:0.3}

/* ─────────────────────────────────
   LOGO SVG INLINE
───────────────────────────────── */
.logo-svg{display:block}

/* ─────────────────────────────────
   BUTTONS
───────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 28px;border-radius:5px;font-size:14px;font-weight:600;letter-spacing:0.2px;border:none;transition:background 0.2s,transform 0.15s,border-color 0.2s,opacity 0.2s;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--mint);color:var(--white)}
.btn-primary:hover{background:var(--light-mint);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--light-mint);border:1px solid var(--border-mid)}
.btn-ghost:hover{border-color:var(--light-mint);background:rgba(93,202,165,0.06)}
.btn-full{width:100%}
.btn-lg{padding:16px 36px;font-size:15px}
.btn:disabled{opacity:0.4;cursor:not-allowed;transform:none!important}
.btn-enquiry{background:rgba(93,202,165,0.08);color:var(--light-mint);border:1px solid var(--border-mid)}
.btn-enquiry:hover{background:rgba(93,202,165,0.14);border-color:var(--light-mint)}

/* ─────────────────────────────────
   NAV
───────────────────────────────── */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;flex-direction:column;align-items:stretch;padding:0;background:rgba(10,15,13,0.45);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(93,202,165,0.12);transition:background 0.3s}
.nav.scrolled{background:rgba(10,15,13,0.72);border-bottom-color:rgba(93,202,165,0.15)}

.trust-strip{overflow:hidden;width:100%;box-sizing:border-box;height:30px;min-height:30px;max-height:30px;border-top:1px solid rgba(93,202,165,0.12);display:flex;align-items:center;padding:0}
.trust-track{display:inline-flex;align-items:center;height:30px;white-space:nowrap;flex-wrap:nowrap;flex-shrink:0;min-height:30px;max-height:30px;width:max-content}
.trust-strip.fit{justify-content:center}
.trust-strip.fit .dup{display:none}
.trust-strip.fit .ts-bridge{display:none}
.trust-track.go{animation:tscroll var(--dur,22s) linear infinite}
.trust-track.go:hover{animation-play-state:paused}
@keyframes tscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ti{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:500;color:rgba(245,250,248,0.82);letter-spacing:0.4px;white-space:nowrap;flex-shrink:0;height:30px;line-height:30px}
.ti svg{color:#5DCAA5;flex-shrink:0}
.ts{display:inline-block;width:1px;min-width:1px;max-width:1px;height:10px;min-height:10px;max-height:10px;background:rgba(93,202,165,0.3);margin:0 18px;flex-shrink:0;flex-grow:0;vertical-align:middle}
.nav-main{display:flex;align-items:center;justify-content:space-between;padding:14px 48px;width:100%;box-sizing:border-box;transition:padding 0.3s}
.nav.scrolled .nav-main{padding:10px 48px}
.nav-logo{display:flex;align-items:center}
.nav-links{display:flex;align-items:center;gap:28px;list-style:none}
.nav-links a{color:rgba(245,250,248,0.55);font-size:12px;font-weight:500;letter-spacing:1px;text-transform:uppercase;transition:color 0.2s}
.nav-links a:hover,.nav-links a.active{color:var(--light-mint)}
.nav-cta{background:var(--mid)!important;color:var(--white)!important;padding:8px 18px!important;border-radius:4px;transition:background 0.2s!important}
.nav-cta:hover{background:var(--mint)!important}
.nav-right{display:flex;align-items:center;gap:12px}
.nav-cart-btn{background:none;border:1px solid var(--border);border-radius:4px;padding:7px 14px;color:var(--light-mint);font-size:12px;font-weight:500;letter-spacing:0.5px;display:flex;align-items:center;gap:6px;transition:border-color 0.2s,background 0.2s}
.nav-cart-btn:hover{border-color:var(--light-mint);background:rgba(93,202,165,0.06)}
.cart-count{background:var(--mint);color:white;border-radius:50%;width:17px;height:17px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}
.cart-count.hidden{display:none}
.hamburger{display:none;background:none;border:1px solid var(--border);border-radius:4px;padding:7px 10px;color:var(--light-mint);flex-direction:column;gap:4px;align-items:center;justify-content:center}
.hamburger span{display:block;width:18px;height:1.5px;background:currentColor;border-radius:2px;transition:transform 0.2s,opacity 0.2s}
.mobile-menu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(10,15,13,0.98);z-index:190;flex-direction:column;align-items:center;justify-content:center;gap:36px;padding:80px 40px}
.mobile-menu.open{display:flex}
.mobile-menu a{font-size:28px;font-family:'DM Serif Display',serif;color:var(--white);letter-spacing:-0.5px;transition:color 0.2s}
.mobile-menu a:hover{color:var(--light-mint)}
.mobile-close{position:absolute;top:20px;right:24px;background:none;border:1px solid var(--border);border-radius:4px;padding:4px 12px;color:var(--light-mint);font-size:26px;line-height:1;cursor:pointer;transition:background 0.2s,color 0.2s;z-index:10}
.mobile-close:hover{background:rgba(93,202,165,0.1);color:var(--white)}

/* ─────────────────────────────────
   PAGE SECTIONS
───────────────────────────────── */
.page{display:none}
.page.active{display:block}

/* ─────────────────────────────────
   HERO
───────────────────────────────── */
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:150px 24px 80px;position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:600px;background:radial-gradient(circle,rgba(29,158,117,0.1) 0%,transparent 65%);pointer-events:none}
.hero>*{position:relative;z-index:1}
.hero-gem{width:72px;height:72px;margin-bottom:32px;animation:float 4s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.eyebrow{font-size:11px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--light-mint)}
.hero-eyebrow{margin-bottom:18px}
.hero h1{font-family:'DM Serif Display',serif;font-size:clamp(42px,8vw,92px);font-weight:400;line-height:1;color:var(--white);margin-bottom:16px;letter-spacing:-2px}
.hero h1 em{font-style:italic;color:var(--light-mint)}
.hero-sub{font-size:16px;color:rgba(245,250,248,0.5);max-width:440px;margin:0 auto 44px;font-weight:300;line-height:1.75}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.hero-scroll{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted);font-size:10px;letter-spacing:2px;text-transform:uppercase;animation:bounce 2.5s ease-in-out infinite}
.hero-scroll::after{content:'';width:1px;height:32px;background:linear-gradient(to bottom,var(--light-mint),transparent)}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(5px)}}

/* ─────────────────────────────────
   SECTIONS
───────────────────────────────── */
.section{padding:88px 24px}
.section-inner{max-width:1180px;margin:0 auto}
.section-dark{background:var(--deep);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.section-header{margin-bottom:56px}
.section-header h2{font-family:'DM Serif Display',serif;font-size:clamp(30px,5vw,54px);font-weight:400;color:var(--white);letter-spacing:-1.5px;margin-top:10px;line-height:1.05}
.section-header h2 em{font-style:italic;color:var(--light-mint)}
.section-header.center{text-align:center}

/* ─────────────────────────────────
   SHOP PAGE — PRODUCT CARDS
───────────────────────────────── */
.shop-header{padding:120px 24px 48px;text-align:center}
.shop-header h1{font-family:'DM Serif Display',serif;font-size:clamp(36px,6vw,72px);font-weight:400;color:var(--white);letter-spacing:-2px;margin-top:12px}
.shop-header h1 em{font-style:italic;color:var(--light-mint)}
.shop-header p{font-size:15px;color:rgba(245,250,248,0.5);max-width:440px;margin:16px auto 0;font-weight:300}

.products-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;max-width:1180px;margin:0 auto;padding:0 24px 100px}

.product-card{background:var(--deep);border:1px solid var(--border);border-radius:8px;overflow:hidden;cursor:pointer;transition:border-color 0.2s,transform 0.2s}
.product-card:hover{border-color:var(--border-mid);transform:translateY(-3px)}
.product-card-img{aspect-ratio:4/3;background:rgba(8,80,65,0.5);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border-bottom:1px solid var(--border)}
.product-card-img svg{opacity:0.35}
.product-card-img span{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);opacity:0.6}
.product-card-body{padding:24px}
.product-card-tag{font-size:10px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;color:var(--light-mint);margin-bottom:8px}
.product-card-name{font-family:'DM Serif Display',serif;font-size:28px;font-weight:400;color:var(--white);letter-spacing:-0.8px;margin-bottom:8px}
.product-card-name em{font-style:italic;color:var(--light-mint)}
.product-card-desc{font-size:13px;color:rgba(245,250,248,0.5);line-height:1.7;font-weight:300;margin-bottom:20px}
.product-card-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.product-card-price{font-family:'DM Serif Display',serif;font-size:22px;color:var(--white);letter-spacing:-0.5px}
.product-card-price span{font-family:'DM Sans',sans-serif;font-size:12px;color:var(--muted);font-weight:400;letter-spacing:0}

/* ─────────────────────────────────
   PRODUCT PAGE
───────────────────────────────── */
.product-page-wrap{padding:110px 24px 80px}
.product-page-inner{max-width:1180px;margin:0 auto}
.product-back{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:rgba(245,250,248,0.4);letter-spacing:0.5px;margin-bottom:40px;cursor:pointer;transition:color 0.2s;text-transform:uppercase}
.product-back:hover{color:var(--light-mint)}
.product-layout{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}

.product-img-col{position:sticky;top:100px}
.product-img-wrap{aspect-ratio:4/5;background:var(--deep);border-radius:8px;border:1px solid var(--border);overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;position:relative;transition:border-color 0.2s}
.product-img-wrap svg{opacity:0.3}
.product-img-wrap span{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);opacity:0.5}
/* image slot — each variant image */
.product-img-slot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;opacity:0;transition:opacity 0.3s;pointer-events:none}
.product-img-slot.active{opacity:1;pointer-events:all}
/* thumbnail strip */
.product-img-thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.product-img-thumb{width:60px;height:60px;background:var(--deep);border-radius:4px;border:1.5px solid var(--border);cursor:pointer;transition:border-color 0.2s;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.product-img-thumb:hover{border-color:var(--border-mid)}
.product-img-thumb.active{border-color:var(--light-mint)}
.product-img-thumb svg{opacity:0.3;width:22px;height:22px}
.product-img-thumb span{font-size:8px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-align:center;padding:2px;line-height:1.3}
.ring-deco{position:absolute;border-radius:50%;border:1px solid rgba(93,202,165,0.06)}
.r1{width:160px;height:160px}
.r2{width:270px;height:270px}
.r3{width:380px;height:380px}

.product-info-col{padding:4px 0}
.product-breadcrumb{font-size:11px;color:rgba(245,250,248,0.35);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}
.product-tagline{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.product-title{font-family:'DM Serif Display',serif;font-size:clamp(36px,5vw,58px);font-weight:400;color:var(--white);letter-spacing:-1.5px;line-height:1;margin-bottom:18px}
.product-title em{font-style:italic;color:var(--light-mint)}
.product-desc{font-size:15px;color:rgba(245,250,248,0.6);line-height:1.85;font-weight:300;margin-bottom:28px}
.product-features{display:flex;flex-direction:column;gap:9px;margin-bottom:32px}
.feat{display:flex;align-items:center;gap:10px;font-size:13px;color:rgba(245,250,248,0.65)}
.feat-dot{width:4px;height:4px;border-radius:50%;background:var(--light-mint);flex-shrink:0}

/* ─────────────────────────────────
   CONFIGURATOR
───────────────────────────────── */
.configurator{background:rgba(8,80,65,0.25);border:1px solid var(--border);border-radius:8px;padding:24px;margin-bottom:24px}
.config-title{font-size:11px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--light-mint);margin-bottom:18px}
.config-block{margin-bottom:20px}
.config-block:last-child{margin-bottom:0}
.config-label{font-size:13px;font-weight:500;color:rgba(245,250,248,0.65);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}
.config-label-note{font-size:11px;color:var(--light-mint);font-weight:400}

.stepper{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:4px;overflow:hidden}
.stepper-btn{background:rgba(93,202,165,0.05);border:none;color:var(--light-mint);width:36px;height:36px;font-size:17px;display:flex;align-items:center;justify-content:center;transition:background 0.15s;flex-shrink:0}
.stepper-btn:hover:not(:disabled){background:rgba(93,202,165,0.14)}
.stepper-btn:disabled{color:rgba(93,202,165,0.18);cursor:not-allowed}
.stepper-val{min-width:40px;text-align:center;font-size:15px;font-weight:600;color:var(--white);background:rgba(93,202,165,0.02);border-left:1px solid var(--border);border-right:1px solid var(--border);height:36px;display:flex;align-items:center;justify-content:center}

/* quantity tabs */
.qty-tabs{display:flex;gap:0;border:1px solid var(--border);border-radius:4px;overflow:hidden;flex-wrap:wrap}
.qty-tab{flex:1;min-width:0;padding:9px 12px;background:none;border:none;color:rgba(245,250,248,0.45);font-size:13px;font-weight:500;cursor:pointer;transition:background 0.15s,color 0.15s;text-align:center;border-right:1px solid var(--border);white-space:nowrap}
.qty-tab:last-child{border-right:none}
.qty-tab.selected{background:rgba(29,158,117,0.18);color:var(--light-mint)}
.qty-tab:hover:not(.selected){background:rgba(93,202,165,0.06);color:rgba(245,250,248,0.7)}

/* colour */
.colour-options{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.colour-swatch{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:border-color 0.15s,transform 0.1s}
.colour-swatch.selected{border-color:var(--light-mint);transform:scale(1.18)}
.colour-swatch[data-c="black"]{background:#141414;border-color:rgba(93,202,165,0.25)}
.colour-custom-btn{background:conic-gradient(from 0deg,#e74c3c,#f39c12,#2ecc71,#3498db,#9b59b6,#e74c3c);border:2px solid transparent;border-radius:4px;padding:5px 14px;color:white;font-size:11px;font-weight:700;letter-spacing:0.5px;cursor:pointer;transition:transform 0.15s,box-shadow 0.15s;text-shadow:0 1px 2px rgba(0,0,0,0.5)}
.colour-custom-btn:hover{transform:scale(1.05)}
.colour-custom-btn.selected{box-shadow:0 0 0 2px var(--light-mint),0 0 0 4px rgba(93,202,165,0.2);transform:scale(1.08)}
.colour-note{font-size:11px;color:rgba(245,250,248,0.35);margin-top:6px;line-height:1.55}

/* branded insert toggle */
.insert-toggle{display:flex;align-items:center;gap:10px}
.toggle-switch{position:relative;width:40px;height:22px;flex-shrink:0}
.toggle-switch input{opacity:0;width:0;height:0;position:absolute}
.toggle-track{position:absolute;inset:0;background:rgba(93,202,165,0.1);border:1px solid var(--border);border-radius:11px;cursor:pointer;transition:background 0.2s,border-color 0.2s}
.toggle-track::before{content:'';position:absolute;width:16px;height:16px;left:2px;top:50%;transform:translateY(-50%);background:rgba(245,250,248,0.3);border-radius:50%;transition:transform 0.2s,background 0.2s}
.toggle-switch input:checked + .toggle-track{background:rgba(29,158,117,0.25);border-color:var(--mint)}
.toggle-switch input:checked + .toggle-track::before{transform:translate(18px,-50%);background:var(--light-mint)}
.toggle-label{font-size:13px;color:rgba(245,250,248,0.65)}
.insert-info{background:rgba(93,202,165,0.06);border:1px solid rgba(93,202,165,0.12);border-radius:4px;padding:10px 12px;margin-top:10px;font-size:12px;color:rgba(245,250,248,0.5);line-height:1.6;display:none}
.insert-info.visible{display:block}
.insert-info strong{color:var(--light-mint);font-weight:500}

/* rules box */
.config-rules{background:rgba(93,202,165,0.05);border:1px solid rgba(93,202,165,0.1);border-radius:4px;padding:10px 12px;margin-top:14px}
.config-rules p{font-size:11px;color:rgba(245,250,248,0.45);line-height:1.65}
.config-rules strong{color:rgba(93,202,165,0.8);font-weight:500}

/* optimal config hint */
.config-hint{background:rgba(29,158,117,0.07);border:1px solid rgba(29,158,117,0.15);border-radius:4px;padding:10px 14px;margin-top:10px;font-size:12px;color:rgba(245,250,248,0.55);line-height:1.65}
.config-hint strong{color:var(--light-mint);font-weight:500}

/* error */
.config-error{background:rgba(220,53,69,0.08);border:1px solid rgba(220,53,69,0.2);border-radius:4px;padding:9px 12px;margin-top:10px;font-size:12px;color:#ff7b89;display:none}
.config-error.visible{display:block}

/* price */
.price-row{display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
.price-main{font-family:'DM Serif Display',serif;font-size:42px;color:var(--white);letter-spacing:-1px}
.price-aud{font-size:13px;color:var(--muted);align-self:center}
.price-breakdown{font-size:12px;color:rgba(245,250,248,0.4);line-height:1.65;min-height:18px;margin-bottom:16px}

.badge-mto{display:inline-flex;align-items:center;gap:7px;font-size:11px;color:var(--light-mint);background:rgba(29,158,117,0.08);border:1px solid rgba(29,158,117,0.16);padding:6px 11px;border-radius:4px;margin-bottom:18px}
.pulse{width:5px;height:5px;border-radius:50%;background:var(--light-mint);animation:pulse 2s ease-in-out infinite;flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.3}}

.cta-stack{display:flex;flex-direction:column;gap:10px}

/* enquiry notice */
.enquiry-notice{background:rgba(93,202,165,0.06);border:1px solid var(--border);border-radius:6px;padding:14px 16px;font-size:13px;color:rgba(245,250,248,0.55);line-height:1.7;display:none}
.enquiry-notice.visible{display:block}
.enquiry-notice strong{color:var(--light-mint);font-weight:500;display:block;margin-bottom:4px}

/* ─────────────────────────────────
   WHY SECTION
───────────────────────────────── */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px}
.why-card{background:rgba(10,15,13,0.5);padding:40px 28px;border:1px solid var(--border);transition:background 0.2s}
.why-card:hover{background:rgba(15,110,86,0.1)}
.why-card:first-child{border-radius:8px 0 0 8px}
.why-card:last-child{border-radius:0 8px 8px 0}
.why-icon{width:32px;height:32px;margin-bottom:18px}
.why-card h3{font-family:'DM Serif Display',serif;font-size:20px;font-weight:400;color:var(--white);margin-bottom:8px;letter-spacing:-0.3px}
.why-card p{font-size:13px;color:rgba(245,250,248,0.45);line-height:1.8;font-weight:300}

/* ─────────────────────────────────
   ABOUT
───────────────────────────────── */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.about-img{aspect-ratio:1;background:var(--deep);border-radius:8px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center}
.about-img span{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.about-content h2{font-family:'DM Serif Display',serif;font-size:clamp(28px,4vw,46px);font-weight:400;color:var(--white);letter-spacing:-1.5px;line-height:1.1;margin-bottom:20px}
.about-content h2 em{font-style:italic;color:var(--light-mint)}
.about-content p{font-size:14px;color:rgba(245,250,248,0.55);line-height:1.9;font-weight:300;margin-bottom:16px}
.about-detail{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--light-mint);margin-top:24px}

/* ─────────────────────────────────
   FAQ
───────────────────────────────── */
.faq-wrap{max-width:660px;margin:0 auto}
.faq-wrap h2{font-family:'DM Serif Display',serif;font-size:clamp(28px,4vw,46px);font-weight:400;color:var(--white);letter-spacing:-1.5px;margin-bottom:48px;text-align:center}
.faq-item{border-bottom:1px solid var(--border);padding:20px 0;cursor:pointer}
.faq-item:first-of-type{border-top:1px solid var(--border)}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;user-select:none}
.faq-q span{font-size:14px;font-weight:500;color:var(--white);line-height:1.4}
.faq-toggle{color:var(--light-mint);font-size:20px;line-height:1;transition:transform 0.2s;flex-shrink:0}
.faq-a{font-size:13px;color:rgba(245,250,248,0.5);line-height:1.8;font-weight:300;max-height:0;overflow:hidden;transition:max-height 0.3s ease,padding-top 0.3s}
.faq-item.open .faq-a{max-height:400px;padding-top:12px}
.faq-item.open .faq-toggle{transform:rotate(45deg)}

/* ─────────────────────────────────
   CONTACT
───────────────────────────────── */
.contact-wrap{max-width:500px;margin:0 auto;text-align:center}
.contact-wrap h2{font-family:'DM Serif Display',serif;font-size:clamp(28px,5vw,52px);font-weight:400;color:var(--white);letter-spacing:-2px;margin-bottom:12px}
.contact-wrap h2 em{font-style:italic;color:var(--light-mint)}
.contact-wrap>p{font-size:14px;color:rgba(245,250,248,0.5);margin-bottom:36px;font-weight:300}
.contact-form{text-align:left;display:flex;flex-direction:column;gap:10px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
input,textarea,select{width:100%;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:4px;padding:12px 14px;color:var(--white);font-family:'DM Sans',sans-serif;font-size:13px;outline:none;transition:border-color 0.2s;-webkit-appearance:none;appearance:none}
input::placeholder,textarea::placeholder{color:rgba(245,250,248,0.2)}
input:focus,textarea:focus,select:focus{border-color:var(--mint)}
select option{background:#0A0F0D;color:var(--white)}
textarea{resize:vertical;min-height:100px}
.form-submit{background:var(--mint);color:var(--white);padding:14px;border:none;border-radius:4px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;cursor:pointer;transition:background 0.2s;width:100%}
.form-submit:hover{background:var(--light-mint)}
.form-success{display:none;background:rgba(29,158,117,0.08);border:1px solid rgba(29,158,117,0.18);border-radius:4px;padding:14px;font-size:13px;color:var(--light-mint);text-align:center;margin-top:4px}
.form-success.visible{display:block}

/* ─────────────────────────────────
   CART DRAWER
───────────────────────────────── */
.cart-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:300;opacity:0;pointer-events:none;transition:opacity 0.3s;backdrop-filter:blur(4px)}
.cart-overlay.open{opacity:1;pointer-events:all}
.cart-drawer{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:100vw;background:#0c1914;border-left:1px solid var(--border);z-index:301;display:flex;flex-direction:column;transform:translateX(100%);transition:transform 0.32s cubic-bezier(0.4,0,0.2,1)}
.cart-drawer.open{transform:translateX(0)}
.cart-hdr{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border)}
.cart-hdr h3{font-family:'DM Serif Display',serif;font-size:20px;font-weight:400;color:var(--white);letter-spacing:-0.3px}
.cart-close{background:none;border:none;color:rgba(245,250,248,0.4);font-size:22px;line-height:1;transition:color 0.2s;padding:2px 6px}
.cart-close:hover{color:var(--white)}
.cart-body{flex:1;overflow-y:auto;padding:16px 24px}
.cart-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:14px;color:rgba(245,250,248,0.25);text-align:center}
.cart-empty-state svg{opacity:0.2;width:44px;height:44px}
.cart-empty-state p{font-size:13px}
.cart-item{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--border)}
.cart-item:last-child{border-bottom:none}
.cart-item-thumb{width:56px;height:70px;background:var(--deep);border-radius:4px;border:1px solid var(--border);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cart-item-thumb svg{opacity:0.35;width:24px;height:24px}
.cart-item-info{flex:1;min-width:0}
.cart-item-name{font-size:13px;font-weight:600;color:var(--white);margin-bottom:3px}
.cart-item-specs{font-size:11px;color:rgba(245,250,248,0.4);line-height:1.6;margin-bottom:7px}
.cart-item-bot{display:flex;align-items:center;justify-content:space-between}
.cart-item-price{font-size:14px;font-weight:600;color:var(--light-mint)}
.cart-item-rm{background:none;border:none;color:rgba(245,250,248,0.25);font-size:11px;letter-spacing:0.5px;text-transform:uppercase;transition:color 0.2s}
.cart-item-rm:hover{color:#ff7b89}
.cart-ftr{padding:20px 24px;border-top:1px solid var(--border)}
.cart-total-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.cart-total-row span:first-child{font-size:12px;color:rgba(245,250,248,0.4);text-transform:uppercase;letter-spacing:1px}
.cart-total-row span:last-child{font-family:'DM Serif Display',serif;font-size:26px;color:var(--white);letter-spacing:-0.5px}
.cart-note-txt{font-size:11px;color:rgba(245,250,248,0.3);margin-bottom:16px;line-height:1.55}
.checkout-btn{width:100%;background:var(--mint);color:white;border:none;border-radius:4px;padding:15px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;cursor:pointer;transition:background 0.2s}
.checkout-btn:hover{background:var(--light-mint)}
.checkout-btn:disabled{opacity:0.35;cursor:not-allowed}

/* ─────────────────────────────────
   FOOTER
───────────────────────────────── */
footer{border-top:1px solid var(--border);padding:36px 24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;background:var(--dark)}
.footer-logo{display:flex;align-items:center}
.footer-links{display:flex;flex-wrap:wrap;gap:20px;list-style:none}
.footer-links a{color:rgba(245,250,248,0.28);font-size:12px;letter-spacing:0.3px;transition:color 0.2s}
.footer-links a:hover{color:var(--light-mint)}
.footer-copy{font-size:11px;color:rgba(245,250,248,0.18)}

/* ─────────────────────────────────
   FADE IN
───────────────────────────────── */
.fade-in{opacity:0;transform:translateY(18px);transition:opacity 0.6s ease,transform 0.6s ease}
.fade-in.visible{opacity:1;transform:translateY(0)}

/* ─────────────────────────────────
   MOBILE
───────────────────────────────── */
@media(max-width:860px){
  .nav-main{padding:12px 20px}
  .nav.scrolled{background:rgba(10,15,13,0.72)}
  .nav-links{display:none}
  .hamburger{display:flex}
  .section{padding:64px 20px}
  .product-layout,.about-grid{grid-template-columns:1fr;gap:40px}
  .product-img-col{position:relative;top:auto}
  .product-img-wrap{aspect-ratio:3/2}
  .product-img-thumbs{gap:6px}
  .product-img-thumb{width:48px;height:48px}
  .why-grid{grid-template-columns:1fr;gap:0}
  .why-card:first-child{border-radius:8px 8px 0 0}
  .why-card:last-child{border-radius:0 0 8px 8px}
  .hero{padding:100px 20px 60px}
  .hero h1{letter-spacing:-1.5px}
  .cart-drawer{width:100vw}
  .form-row{grid-template-columns:1fr}
  footer{flex-direction:column;align-items:flex-start;gap:14px;padding:28px 20px}
  .products-grid{padding:0 20px 72px;grid-template-columns:1fr}
  .shop-header{padding:110px 20px 36px}
  .product-page-wrap{padding:80px 20px 60px}
  .qty-tabs{flex-wrap:nowrap;overflow-x:auto}
  .product-back{margin-bottom:28px}
}
@media(max-width:480px){
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%}
  .price-main{font-size:34px}
  .configurator{padding:18px}
  .cart-hdr,.cart-body,.cart-ftr{padding-left:18px;padding-right:18px}
}

/* ── Solidus integration overrides ── */
main { padding-top: 96px; }
@media (max-width: 860px) { main { padding-top: 84px; } }
/* home hero sits directly under the fixed nav (design handles its own top spacing) */
#home main { padding-top: 0; }

/* ── Legal / policy pages ── */
.legal { max-width: 760px; margin: 0 auto; padding: 40px 24px 90px; }
.legal h1 { font-family: 'DM Serif Display', serif; font-size: clamp(32px,5vw,52px); color: var(--white); letter-spacing: -1.5px; line-height: 1.05; margin-bottom: 6px; }
.legal .legal-updated { font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: rgba(245,250,248,0.35); margin-bottom: 30px; }
.legal h2 { font-family: 'DM Serif Display', serif; font-size: 24px; color: var(--white); letter-spacing: -0.5px; margin: 34px 0 10px; }
.legal h3 { font-size: 15px; color: var(--light-mint); font-weight: 600; margin: 22px 0 6px; }
.legal p { font-size: 14px; color: rgba(245,250,248,0.6); line-height: 1.85; font-weight: 300; margin-bottom: 14px; }
.legal ul, .legal ol { margin: 0 0 16px 22px; }
.legal li { font-size: 14px; color: rgba(245,250,248,0.6); line-height: 1.8; font-weight: 300; margin-bottom: 6px; }
.legal a { color: var(--light-mint); text-decoration: underline; }
.legal strong { color: rgba(245,250,248,0.85); font-weight: 500; }
.legal em { color: rgba(245,250,248,0.7); font-style: italic; }
.legal blockquote { border-left: 2px solid var(--mint); background: rgba(93,202,165,0.06); padding: 14px 18px; margin: 18px 0; border-radius: 4px; font-size: 14px; color: rgba(245,250,248,0.78); line-height: 1.85; }