/* ===== Studio Group — Apple-style concept layer (look only; live markup & JS unchanged) ===== */
:root{--cx-accent:#00a896;--cx-bg:#ffffff;--cx-soft:#f4f0ea}
body{background:#fff!important;-webkit-font-smoothing:antialiased}
/* NAV: fixed translucent bar */
nav#nav,nav#nav.on-home,nav#nav.on-sub,nav#nav.scrolled{position:fixed!important;height:52px!important;padding:0 max(22px,calc((100vw - 1120px)/2))!important;background:rgba(255,255,255,.72)!important;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(28,24,19,.07)!important;gap:28px!important}
nav#nav .nav-logo .l1,nav#nav .nav-logo .l2{color:var(--text)!important;font-size:13px!important;letter-spacing:5px!important}
nav#nav .nav-logo .l2{font-weight:300!important}
nav#nav .nav-logo .ll{display:none!important}nav#nav .nav-logo .l3{display:none!important}
#cx-menu{display:flex;gap:28px;margin-left:auto;font-family:var(--sans)}
#cx-menu a{font-size:12px;color:var(--text-mid);text-decoration:none;letter-spacing:.2px;cursor:pointer}#cx-menu a:hover{color:var(--text)}
#nav-home-links,#nav-sub-cart{display:flex!important;margin-left:0!important}
#nav-home-links .nav-cart,#nav-sub-cart .nav-cart{display:flex!important;color:var(--text)!important}
nav.on-home #nav-sub-cart{display:none!important}nav.on-sub #nav-home-links{display:none!important}
#nav-sub-links{display:flex!important}
#nav-home-links,#nav-sub-cart{order:1}#nav-sub-links{order:2}
.ham-btn .ham-line{background:var(--text)!important}
.nav-cart-badge,.cart-badge{background:var(--cx-accent)!important}
/* HOME: three calm tiles */
#page-home{padding-top:52px!important;background:#fff}
.panels{gap:12px;padding:12px;height:calc(100vh - 52px)!important;background:#fff}
.panel{border:0!important;border-radius:22px}
.panel-photo img{filter:brightness(.78) saturate(.85)!important}
.panel-overlay{background:linear-gradient(to top,rgba(20,17,13,.70) 0%,rgba(20,17,13,.15) 50%,transparent 100%)!important}
.panel-studio{font-family:var(--serif)!important;font-weight:300!important;text-transform:none!important;letter-spacing:0!important;font-size:clamp(20px,1.8vw,28px)!important;color:rgba(255,255,255,.85)!important}
.panel-name{font-family:var(--serif)!important;font-weight:300!important;text-transform:none!important;letter-spacing:-.01em!important;font-size:clamp(44px,4.6vw,72px)!important;color:#fff!important}
.panel-line{display:none!important}
.panel-tag{font-size:11px!important;letter-spacing:3px!important;color:rgba(255,255,255,.75)!important}
.panel-cta{font-size:12px!important;letter-spacing:.5px!important;text-transform:none!important;opacity:1!important;background:var(--cx-accent);color:#fff!important;padding:10px 20px;border-radius:999px}
.panel-cta::after{display:none}
/* RANGE HERO: calm, blurred, darker */
.hero{height:78vh!important;min-height:520px}
.hero-bg{filter:blur(5px);transform:scale(1.08)!important}
.hero-overlay{background:linear-gradient(180deg,rgba(20,17,13,.50),rgba(20,17,13,.72))!important}
.hero-eyebrow{font-size:11px!important;letter-spacing:5px!important;color:rgba(255,255,255,.7)!important}
.hero-name{font-family:var(--serif)!important;font-weight:300!important;text-transform:none!important;letter-spacing:-.01em!important;font-size:clamp(56px,7vw,96px)!important;color:#fff!important;line-height:1!important}
.hero-line{display:none!important}
.hero-tagline{font-size:clamp(20px,2vw,28px)!important;color:rgba(255,255,255,.85)!important;margin-top:18px}
.scroll-ind{display:none!important}
/* Sections: white space, one idea per screen */
.intro{background:#fff!important;padding:140px 24px!important}
.intro-quote{font-family:var(--serif)!important;font-style:normal!important;font-weight:300!important;font-size:clamp(32px,4vw,56px)!important;color:var(--text)!important;line-height:1.15!important}
.intro-rule,.cst-rule{display:none!important}
.intro-sub{font-size:11px!important;letter-spacing:4px!important;color:var(--text-mid)!important;margin-top:24px}
.csplit{background:var(--cx-soft)!important}
.cst-head,.sci-head,.coll-title,.vs-head,.specs-head,.apps-title{font-family:var(--serif)!important;font-weight:300!important;font-style:normal!important;letter-spacing:-.01em;color:var(--text)!important}
.csplit-img img{border-radius:22px}
.science{background:#fff!important;color:var(--text)!important}.sci-p{color:var(--text-mid)!important}.sci-eye{color:var(--cx-accent)!important}
.stat-num{font-family:var(--serif)!important;font-weight:300!important;color:var(--text)!important}.stat-lbl{color:var(--text-mid)!important}
.origins{background:var(--warm)!important}
/* Collection: big image tiles with spec below */
.collection{background:var(--cx-soft)!important;padding:120px max(24px,calc((100vw - 1120px)/2))!important}
.coll-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:20px!important}
.coll-item{background:#fff;border-radius:22px;overflow:hidden;height:auto!important;aspect-ratio:auto!important;display:flex;flex-direction:column}
.coll-item img{position:static!important;aspect-ratio:4/3;height:auto!important;width:100%!important;border-radius:0}
.coll-ovl{display:none!important}
.coll-info{position:static!important;padding:24px 28px 28px!important;background:#fff;opacity:1!important;transform:none!important;display:block!important}
.coll-name{font-family:var(--serif)!important;font-style:normal!important;font-weight:400!important;font-size:30px!important;color:var(--text)!important;display:block}
.coll-type{display:block;font-size:12px!important;letter-spacing:.3px!important;text-transform:none!important;color:var(--text-mid)!important;margin-top:4px}
.coll-spec{font-size:12px!important;color:var(--text-lt)!important;margin-top:4px;opacity:1!important}
.cx-sample{margin-top:18px;font-family:var(--sans);font-size:13px;font-weight:500;padding:10px 22px;border-radius:999px;border:0;background:var(--cx-accent);color:#fff;cursor:pointer}
.cx-sample:hover{filter:brightness(.92)}
/* Warranty band */
.cx-warranty{background:var(--text);color:#fff;text-align:center;padding:120px 24px}
.cx-eye{font-family:var(--sans);font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--sand)}
.cx-warranty h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,5vw,72px);margin:14px 0}
.cx-warranty p{font-family:var(--serif);font-size:24px;color:rgba(255,255,255,.75)}
.cx-ctas{display:flex;gap:24px;justify-content:center;align-items:center;margin-top:32px;flex-wrap:wrap}
.cx-btn{font-family:var(--sans);font-size:13px;font-weight:500;padding:12px 26px;border-radius:999px;background:var(--cx-accent);color:#fff;text-decoration:none}
.cx-link{font-family:var(--sans);font-size:13px;color:var(--sand);text-decoration:none}
/* CTA band */
.cta-sec{background:var(--warm)!important;color:var(--text)!important}
.cta-bg{display:none!important}
.cta-title{font-family:var(--serif)!important;font-weight:300!important;color:var(--text)!important;font-style:normal!important}
.cta-eye{color:var(--text-mid)!important}
.btn-ghost{border-radius:999px!important;border:1px solid var(--text)!important;color:var(--text)!important;letter-spacing:.5px!important;text-transform:none!important;font-size:13px!important}
.btn-ghost:first-of-type{background:var(--cx-accent)!important;border-color:var(--cx-accent)!important;color:#fff!important}
/* Footer */
#site-footer{background:var(--cx-soft)!important;border-top:1px solid var(--warm)}
#site-footer a{color:inherit;text-decoration:none}
/* Gallery / slab panel / cart: softer, rounded */
.gallery-overlay{background:#fff!important;top:52px!important}
.gallery-item{border-radius:18px}.gallery-grid{gap:14px!important}
.gf-btn{border-radius:999px!important;letter-spacing:.5px!important;text-transform:none!important;font-size:12px!important}
.gf-btn.active,.gf-btn:hover{background:var(--text)!important;color:#fff!important}
.slab-detail{background:#fff!important;border-radius:22px 0 0 22px}
.slab-enquire-btn,.slab-sample-btn{border-radius:999px!important;letter-spacing:.5px!important;text-transform:none!important;font-size:13px!important}
.slab-sample-btn{background:var(--cx-accent)!important;color:#fff!important;border-color:var(--cx-accent)!important}
#page-cart{background:#fff!important;top:52px!important}
.cp-heading{font-style:normal!important}
.cp-img{border-radius:14px}
.cp-checkout-btn{border-radius:999px!important;letter-spacing:.5px!important;text-transform:none!important;font-size:14px!important;background:var(--cx-accent)!important}
#back-top{border-radius:50%}
@media(max-width:860px){#cx-menu{display:none}.coll-grid{grid-template-columns:1fr!important}.panels{height:auto!important;padding:8px}}
@media(max-width:480px){.panel{border-radius:18px}}
nav#nav.on-sub .nav-logo,nav#nav .nav-logo{display:inline-flex!important;flex-direction:row!important;gap:8px;align-items:baseline;cursor:pointer}
/* ===== Range accents (from live site) ===== */
body[data-range="zero"]{--cx-accent:#00a896;--cx-accent-h:#007a6e;--cx-light:#00a896;--cx-line:linear-gradient(90deg,#00a896,rgba(0,168,150,.18))}
body[data-range="nat"]{--cx-accent:#8b4fbf;--cx-accent-h:#6a0dad;--cx-light:#c8a0f0;--cx-line:linear-gradient(90deg,#6a0dad,#9b30e8)}
body[data-range="porc"]{--cx-accent:#6b8ea6;--cx-accent-h:#5a7d96;--cx-light:#a8cfe0;--cx-line:linear-gradient(90deg,#6b8ea6,#9ab8ce)}
.cx-sample:hover,.cx-btn:hover,.cp-checkout-btn:hover{background:var(--cx-accent-h,#007a6e)!important;filter:none}
#cx-menu a.cx-active{color:var(--cx-accent)!important;font-weight:600}
body[data-range] .hero-line{display:block!important;background:var(--cx-line)!important;width:70px;height:2px;margin:18px auto 0}
body[data-range="home"] .hero-line{display:none!important}
.hero-eyebrow{color:var(--cx-light,#fff)!important}
.cst-eye,.coll-eye,.sci-eye,.vs-eye,.specs-eye,.apps-eye,.cta-eye,.feat-n{color:var(--cx-accent)!important}
.coll-lnk{color:var(--cx-accent)!important}
.cst-rule{display:block!important;background:var(--cx-line)!important;height:2px;width:56px}
.btn-ghost:first-of-type{background:var(--cx-accent)!important;border-color:var(--cx-accent)!important}
.slab-sample-btn{background:var(--cx-accent)!important;border-color:var(--cx-accent)!important}
.nav-cart-badge,.cart-badge{background:var(--cx-accent)!important}
nav#nav .nav-logo .l2{color:var(--cx-accent)!important}
body[data-range="home"] nav#nav .nav-logo .l2{color:var(--text)!important}
/* homepage tiles in range colours */
.p-zero .panel-cta{background:#00a896!important}.p-zero .panel-name{color:#fff!important}.p-zero .panel-tag{color:#7fe0d6!important}
.p-nat .panel-cta{background:#8b4fbf!important}.p-nat .panel-tag{color:#c8a0f0!important}
.p-porc .panel-cta{background:#6b8ea6!important}.p-porc .panel-tag{color:#a8cfe0!important}
.p-zero .panel-line,.p-nat .panel-line,.p-porc .panel-line{display:block!important;width:56px!important;height:2px!important;animation:none!important}
.p-zero .panel-line{background:linear-gradient(90deg,#00a896,#00d4c8)!important}.p-nat .panel-line{background:linear-gradient(90deg,#6a0dad,#9b30e8)!important}.p-porc .panel-line{background:linear-gradient(90deg,#6b8ea6,#9ab8ce)!important}
/* ===== Approved brand sheets (Oct 2026): Montserrat only, group palette, logo lockups ===== */
:root{--serif:'Montserrat',sans-serif;--sans:'Montserrat',sans-serif;--text:#1a1a1a;--text-mid:#888888;--text-lt:#888888;--cx-soft:#f0ede8;--gold:#c9a96e;--gold-grad:linear-gradient(90deg,#c9a96e,#e8c98a)}
body{color:#1a1a1a!important;font-family:'Montserrat',sans-serif!important}
body[data-range="home"]{--cx-accent:#c9a96e;--cx-accent-h:#b08f55;--cx-light:#e8c98a;--cx-line:var(--gold-grad)}
body[data-range="nat"]{--cx-accent:#6a0dad;--cx-accent-h:#55098b;--cx-light:#c8a0f0}
.p-nat .panel-cta{background:#6a0dad!important}
nav#nav .nav-logo>span{display:none!important}
nav#nav .nav-logo .cx-logo{height:30px;width:auto;display:block}
.cx-hero-logo{display:block;height:clamp(110px,15vw,190px);width:auto;margin:0 auto 6px;animation:fadeUp 1s ease .5s both}
.cx-has-logo .hero-eyebrow,.cx-has-logo .hero-name,.cx-has-logo .hero-line{display:none!important}
footer .cx-foot-logo{height:34px;width:auto;display:block;margin-bottom:6px}
footer #footer-brand{display:none!important}
.cx-eye,.cx-link{color:var(--cx-light,#e8c98a)!important}
body[data-range="home"] #cx-menu a:hover{color:#c9a96e!important}
.stat-num{color:var(--cx-accent)!important}
nav#nav .nav-logo .cx-logo{height:40px}
.panel-studio{font-family:'Montserrat',sans-serif!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.3em!important;font-size:clamp(16px,1.5vw,22px)!important;color:#fff!important}
.panel-name{font-family:'Montserrat',sans-serif!important;font-weight:200!important;text-transform:uppercase!important;letter-spacing:.22em!important;font-size:clamp(28px,3vw,44px)!important}
.p-nat .panel-name{color:#c8a0f0!important}.p-porc .panel-name{color:#a8cfe0!important}.p-zero .panel-name{color:#5fd6c8!important}
.panel-name{font-size:clamp(24px,2.6vw,38px)!important;letter-spacing:.16em!important}
/* Contact view */
#cx-contact{position:fixed;inset:52px 0 0 0;z-index:450;background:#fff;overflow:auto;display:flex;align-items:center;justify-content:center;padding:40px 22px}
#cx-contact[hidden]{display:none}
.cx-ct-inner{position:relative;max-width:860px;width:100%;text-align:center;font-family:var(--sans)}
.cx-ct-close{position:absolute;top:-10px;right:0;background:none;border:0;font-size:32px;line-height:1;cursor:pointer;color:var(--text-mid)}
.cx-ct-eye{display:block;font-size:11px;letter-spacing:5px;text-transform:uppercase;color:#c9a96e;margin-bottom:12px}
#cx-contact h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,5vw,64px);color:var(--text);margin-bottom:40px}
.cx-ct-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:36px}
.cx-ct-grid>div{background:var(--cx-soft);border-radius:18px;padding:26px 16px;font-size:14px;color:var(--text);line-height:1.5}
.cx-ct-grid strong{display:block;font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--text-lt);font-weight:500;margin-bottom:8px}
.cx-ct-grid a{color:var(--text);text-decoration:none;border-bottom:1px solid #c9a96e}
.cx-ct-note{font-size:13px;color:var(--text-mid);margin-bottom:18px}
.cx-ct-btn{display:inline-block;background:#c9a96e;color:#fff;text-decoration:none;font-size:13px;padding:12px 24px;border-radius:999px}
@media(max-width:860px){.cx-ct-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.cx-ct-grid{grid-template-columns:1fr}#cx-contact{align-items:flex-start}}
/* ===== Minimal gallery ===== */
.gallery-overlay{background:#fff!important;top:52px!important}
.gallery-nav{background:#fff!important;border-bottom:0!important;height:56px!important;padding:0 max(22px,calc((100vw - 1200px)/2))!important}
.cx-gx{background:none;border:0;font-size:30px;line-height:1;cursor:pointer;color:var(--text);padding:6px 10px}
.gallery-heading{font-family:'Montserrat',sans-serif!important;font-style:normal!important;font-weight:300!important;font-size:13px!important;letter-spacing:4px;text-transform:uppercase;padding:0 22px 24px!important}
.gallery-body{padding:0 max(22px,calc((100vw - 1200px)/2)) 96px!important;background:#fff}
.gallery-filters{justify-content:center;margin-bottom:56px!important}
.gf-btn{border:0!important;border-radius:999px;font-family:'Montserrat',sans-serif;letter-spacing:1px!important;text-transform:none!important;font-size:12px!important;color:var(--text-mid)!important}
.gf-btn.active,.gf-btn:hover{background:#f4f0ea!important;color:var(--text)!important}
.gallery-grid{grid-template-columns:repeat(3,1fr)!important;gap:72px 40px!important}
.cx-gi{cursor:pointer;background:none;border:0;padding:0;text-align:left;font-family:'Montserrat',sans-serif}
.cx-gi-img{aspect-ratio:4/3;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cx-gi-img img{width:100%;height:100%;object-fit:cover;transition:opacity .3s}
.cx-gi.is-product .cx-gi-img img{object-fit:contain}
.cx-gi:hover .cx-gi-img img{opacity:.88}
.cx-gi-name{margin-top:16px;font-size:13px;font-weight:500;color:var(--text);letter-spacing:.3px}
.cx-gi-range{margin-top:4px;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text-lt)}
@media(max-width:860px){.gallery-grid{grid-template-columns:1fr 1fr!important;gap:48px 20px!important}}
@media(max-width:480px){.gallery-grid{grid-template-columns:1fr!important;gap:44px!important}}
#cx-lb{position:fixed;inset:0;z-index:700;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:64px 64px 40px;font-family:'Montserrat',sans-serif}
#cx-lb[hidden]{display:none}
#cx-lb img{max-width:100%;max-height:calc(100vh - 210px);object-fit:contain}
.cx-lb-cap{margin-top:20px;text-align:center}
.cx-lb-cap .n{font-size:15px;font-weight:500;color:var(--text)}.cx-lb-cap .r{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text-lt);margin-top:4px}
.cx-lb-act{margin-top:16px;background:#1c1813;color:#fff;border:0;border-radius:999px;padding:11px 22px;font-size:12px;cursor:pointer;font-family:inherit}
.cx-lb-x{position:absolute;top:14px;right:18px;font-size:36px;background:none;border:0;cursor:pointer;color:var(--text);line-height:1;padding:6px 12px}
.cx-lb-arr{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;font-size:40px;color:var(--text-mid);cursor:pointer;padding:16px}
.cx-lb-prev{left:8px}.cx-lb-next{right:8px}
@media(max-width:600px){#cx-lb{padding:60px 12px 28px}.cx-lb-arr{top:auto;bottom:18px;transform:none;font-size:32px}}

.origins .orig-country{color:#6a0dad!important;opacity:1!important;font-weight:600!important}.origins .orig-stone{color:#1a1a1a!important}.origins .orig-desc{color:#333!important}.origins .origin-item{border-color:rgba(26,26,26,.12)!important}

/* v17 — iPhone portrait fixes */
@media(max-width:860px){
  #nav-home-links,#nav-sub-cart{margin-left:auto!important}
  #nav-sub-links{margin-left:12px}
  .ham-drop{left:auto!important;right:0!important;max-width:calc(100vw - 24px)}
  .ham-drop a{font-size:11px!important;padding:14px 24px!important}
  .pv-enq{min-height:44px;display:inline-flex!important;align-items:center;justify-content:center}
}
@media(max-width:700px){
  footer a{display:inline-block;padding:10px 4px;min-height:24px}
}
