/*
Theme Name: T-MATS Premium V6
Theme URI: https://tmats.co.uk/
Author: T-MATS
Description: Custom responsive WooCommerce storefront inspired by the approved T-MATS homepage design.
Version: 7.0.3
Requires PHP: 7.4
Text Domain: tmats-premium
*/
:root{--red:#ee0719;--ink:#0b1625;--muted:#475267;--yellow:#ffd119}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#fff;font-family:Arial,Helvetica,sans-serif}a{text-decoration:none;color:inherit}button,input{font:inherit}.wrap{max-width:1450px;margin:auto;padding-left:24px;padding-right:24px}.site-header{background:#fff;position:relative;z-index:10;box-shadow:0 1px 3px #0001}.header-row{height:76px;display:flex;align-items:center;gap:35px}.brand{display:block;width:300px;flex:none}.brand img{width:100%;height:67px;object-fit:contain}.nav-links{display:flex;gap:28px;align-items:center;margin:auto;font-size:14px;font-weight:700}.nav-links a:hover,.header-actions a:hover{color:var(--red)}.header-actions{display:flex;gap:25px;white-space:nowrap;font-size:14px}.cart-count{background:var(--red);color:white;border-radius:50%;padding:3px 7px}.mobile-toggle{display:none}.hero{min-height:445px;background:url('assets/hero-arne-v5.jpg') center center/cover no-repeat}.hero-content{position:relative;padding-top:30px;padding-bottom:22px}.eyebrow{letter-spacing:4px;font-size:13px;margin-bottom:10px}.hero h1{font-size:clamp(32px,4vw,60px);line-height:.99;letter-spacing:-1.7px;font-weight:900;margin:0;max-width:800px}.hero h1 span{color:var(--red)}.hero-desc{font-size:15px;line-height:1.45;max-width:520px;margin:14px 0 18px}.finder{max-width:620px;background:#fff;border-radius:12px;box-shadow:0 8px 22px #0002;overflow:hidden}.tabs{display:grid;grid-template-columns:1fr 1.25fr .8fr;background:#f5f6f8}.tabs button{border:0;background:transparent;padding:15px 8px;font-size:13px;font-weight:700;cursor:pointer}.tabs button.active{background:var(--red);color:white}.finder-body{padding:17px 23px 19px;min-height:143px}.finder-pane{display:none}.finder-pane.active{display:block}.finder h2{font-size:18px;margin:0 0 5px}.finder p{font-size:13px;margin:0 0 13px;color:var(--muted)}.finder-form{display:flex;gap:14px}.reg-field{height:48px;display:flex;align-items:center;background:var(--yellow);border:1px solid #d6aa00;border-radius:6px;overflow:hidden;flex:1;min-width:0}.reg-field strong{display:flex;background:#164ca8;color:#fff;align-items:center;padding:0 12px;height:100%}.reg-field input{min-width:0;width:100%;border:0;background:transparent;font-size:25px;text-transform:uppercase;font-weight:800;text-align:center;outline:0}.reg-field input::placeholder{color:#9d8650}.yellow-btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;border:0;border-radius:6px;background:var(--yellow);color:#111;font-weight:800;font-size:13px;cursor:pointer;white-space:nowrap}.finder small{display:block;font-size:10px;margin-top:8px;color:#4d5360}.arne-bubble{position:absolute;right:30px;bottom:30px;display:flex;gap:16px;align-items:center;padding:14px 24px;background:#fff;border-radius:14px;box-shadow:0 5px 18px #0003}.bubble-icon{font-size:36px}.arne-bubble strong{font-size:21px}.arne-bubble em{color:var(--red);font-style:normal}.arne-bubble p{font-size:13px;margin:4px 0 0}.benefits{border-bottom:1px solid #e8ebef}.benefits-grid{display:grid;grid-template-columns:repeat(4,1fr)}.benefits-grid>div{display:flex;align-items:center;gap:18px;padding:17px 20px;border-right:1px solid #e8ebef}.benefits-grid>div:last-child{border:0}.benefit-icon{font-size:35px;color:var(--red);min-width:46px;text-align:center}.benefits-grid p{margin:0}.benefits-grid strong{display:block;font-size:13px}.benefits-grid small{display:block;margin-top:6px;color:var(--muted);font-size:12px}.range-section{padding-top:22px;padding-bottom:40px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:17px}.section-heading h2{font-size:30px;letter-spacing:-1px;margin:0;font-weight:900}.section-heading p{margin:5px 0 0;font-size:15px}.all-products{border:1px solid #dbe1e8;padding:15px 23px;border-radius:10px;white-space:nowrap;font-size:14px;font-weight:700}.all-products span{color:var(--red);margin-left:12px}.range-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.range-card{position:relative;display:block;height:300px;overflow:hidden;border-radius:9px;background:#111c2b;color:white}.range-card img{width:100%;height:100%;object-fit:cover;transition:transform .2s}.range-card:hover img{transform:scale(1.04)}.range-card:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#061421 80%)}.card-copy{position:absolute;z-index:1;bottom:0;left:0;right:0;padding:15px}.card-copy h3{font-size:20px;margin:0 0 7px}.card-copy p{font-size:13px;line-height:1.35;margin:0}.card-arrow{float:right;padding:10px 14px;border-radius:5px;background:var(--red);font-size:20px}.footer{background:#0b1625;color:#c9d0d9;padding:24px 0;font-size:13px}.woocommerce main,.woocommerce-page main{max-width:1400px;margin:30px auto;padding:0 24px}@media(max-width:1100px){.brand{width:215px}.nav-links{gap:13px;font-size:12px}.header-actions{gap:10px;font-size:12px}.arne-bubble{right:20px}.range-card{height:280px}.card-copy h3{font-size:16px}}@media(max-width:780px){.header-row{height:66px;gap:10px}.brand{width:180px}.brand img{height:58px}.mobile-toggle{display:block;margin-left:auto;border:0;background:white;font-size:26px}.nav-links{display:none;position:absolute;left:0;right:0;top:66px;background:white;padding:16px 24px;flex-direction:column;align-items:stretch;box-shadow:0 10px 18px #0002}.nav-links.open{display:flex}.header-actions{font-size:11px;gap:12px}.header-actions a:first-child{display:none}.hero{background-position:65% center;min-height:550px}.hero-content{padding-top:26px}.hero h1{font-size:clamp(30px,7vw,44px)}.hero-desc{max-width:450px}.finder{max-width:520px}.arne-bubble{position:relative;right:auto;bottom:auto;margin-top:20px;width:max-content;max-width:100%}.benefits-grid{grid-template-columns:repeat(2,1fr)}.range-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.range-card{height:310px}}@media(max-width:480px){.wrap{padding-left:15px;padding-right:15px}.hero{background:linear-gradient(90deg,rgba(255,255,255,.92),rgba(255,255,255,.65)),url('assets/hero-arne-v5.jpg') 63% center/cover}.hero h1{font-size:34px;letter-spacing:-.8px}.eyebrow{font-size:10px}.tabs button{font-size:10px;padding:12px 3px}.finder-body{padding:16px}.finder-form{flex-direction:column;gap:9px}.reg-field{flex:auto;height:46px}.yellow-btn{width:100%}.benefits-grid>div{gap:8px;padding:14px 5px}.benefit-icon{min-width:30px;font-size:27px}.benefits-grid strong{font-size:10px}.benefits-grid small{font-size:10px}.section-heading h2{font-size:23px}.section-heading p{font-size:12px}.all-products{font-size:11px;padding:10px}.range-grid{gap:10px}.range-card{height:260px}.card-copy{padding:10px}.card-copy h3{font-size:15px}.card-copy p{font-size:11px}.card-arrow{padding:7px 10px;font-size:14px}}


/* V7: single coordinated layout, no legacy override cascade. */
@media (min-width:781px) {
 .hero {position:relative; background-image:url('assets/hero-arne-approved-smile-v2.jpg'); background-size:100% 100%; background-position:center;}
 .hero .hero-content {position:static;}
 .hero .arne-bubble {display:flex; position:absolute; z-index:2; left:60.65%; top:73.2%; right:auto; bottom:auto; width:22.5%; height:18%; min-height:0; padding:0 1%; gap:3%; align-items:center; background:transparent; border:0; box-shadow:none; border-radius:0;}
 .hero .bubble-icon {display:flex; flex:0 0 15%; min-width:0; font-size:inherit; color:#0b1625;}
 .hero .bubble-icon svg {display:block; width:100%; height:auto;}
 .hero .arne-bubble strong {display:block; font-size:clamp(12px,1.3vw,21px); line-height:1.08; white-space:nowrap;}
 .hero .arne-bubble p {font-size:clamp(9px,.88vw,13px);line-height:1.22;margin:4px 0 0;white-space:nowrap;}
}
/* Each entire source photo is visible in a dedicated image area; text sits on a separate dark area. */
.range-card {height:300px;background:#091521;isolation:isolate;}
.range-card img {display:block;width:100%;height:65%;object-fit:contain;object-position:center center;transform:none;transition:none;background:#111b26;}
.range-card:hover img {transform:none;}
.range-card:after {content:none;}
.card-copy {background:linear-gradient(#0b1927,#06121e);height:35%;padding:12px;}
.card-copy h3 {font-size:clamp(13px,1.3vw,19px);margin-bottom:5px;}
.card-copy p {font-size:clamp(10px,.85vw,13px);line-height:1.25;}
.card-arrow {padding:7px 11px;font-size:16px;}
@media (max-width:780px) {
 .hero {background-position:70% center;}
 .arne-bubble {display:flex;}
 .range-card {height:300px;}
 .range-card img {height:62%;object-fit:contain;}
 .card-copy {height:38%;}
}
@media (max-width:480px) {
 .hero {background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.75)),url('assets/hero-arne-approved-smile-v2.jpg') 74% center/cover no-repeat;}
 .range-card {height:265px;}
 .range-card img {height:59%;}
 .card-copy {height:41%;padding:9px;}
 .card-copy p {font-size:10px;}
}
