@font-face{font-family:Inter;src:url('assets/fonts/inter-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Barlow Condensed;src:url('assets/fonts/barlow-condensed-latin-700-normal.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Barlow Condensed;src:url('assets/fonts/barlow-condensed-latin-600-normal.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
:root{--ink:#111318;--muted:#626975;--paper:#f6f7f7;--surface:#fff;--dark:#080a0d;--dark2:#11151a;--red:#d30d14;--red2:#a7090e;--line:#e1e4e7;--gold:#c8a342;--shell:1480px;--radius:20px;--shadow:0 22px 70px rgba(10,15,20,.12);--header:76px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 16px)}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a{ -webkit-tap-highlight-color:transparent }a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.shell{width:min(var(--shell),calc(100% - 56px));margin-inline:auto}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}.skip-link{position:fixed;left:16px;top:-80px;z-index:999;background:#fff;padding:10px 14px;border-radius:8px}.skip-link:focus{top:12px}.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:200;background:transparent}.scroll-progress span{display:block;height:100%;width:0;background:var(--red)}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);border-bottom:1px solid rgba(17,19,24,.08)}.header-inner{height:var(--header);display:flex;align-items:center;gap:34px}.brand{width:164px;height:54px;display:flex;align-items:center;overflow:hidden}.brand img{width:160px;height:auto;transform:scale(1.08);transform-origin:left center}.main-nav{margin-left:auto;display:flex;align-items:center;gap:28px;font-size:13px;font-weight:700}.main-nav>a{position:relative;padding:28px 0 25px;white-space:nowrap}.main-nav>a:after{content:"";position:absolute;left:0;right:100%;bottom:17px;height:2px;background:var(--red);transition:right .2s}.main-nav>a:hover:after,.main-nav>a.active:after{right:0}.shop-link{border:1px solid var(--red);background:var(--red);color:#fff;border-radius:9px;padding:12px 18px;font-weight:800;transition:.2s}.shop-link:hover{background:var(--red2);transform:translateY(-1px)}.nav-toggle{display:none;border:0;background:none;width:44px;height:44px;padding:10px}.nav-toggle span{display:block;height:2px;background:#111;margin:5px 0;transition:.2s}
.hero{position:relative;min-height:670px;background:#080a0d;color:#fff;overflow:hidden;border-bottom:3px solid var(--red)}.hero-media{position:absolute;inset:0;background-image:none;background-size:cover;background-position:68% center;transform:scale(1.02)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#06080a 0%,rgba(6,8,10,.97) 20%,rgba(6,8,10,.76) 40%,rgba(6,8,10,.15) 66%,rgba(6,8,10,.06) 100%)}.hero-glow{position:absolute;width:700px;height:700px;left:-260px;top:-180px;border-radius:50%;background:radial-gradient(circle,rgba(211,13,20,.18),transparent 68%);pointer-events:none}.hero-layout{min-height:670px;display:grid;grid-template-columns:minmax(520px,690px) 1fr;align-items:center;position:relative;z-index:2}.hero-copy{padding:64px 0 54px}.eyebrow{display:inline-block;color:#ff5358;text-transform:uppercase;letter-spacing:.14em;font-size:11px;font-weight:900;margin-bottom:13px}.eyebrow.dark{color:var(--red)}.hero h1{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;font-size:clamp(56px,5.1vw,88px);line-height:.91;letter-spacing:-.02em;margin:0;max-width:740px}.hero h1 span{display:block;color:var(--red)}.hero-method{font-family:'Barlow Condensed',sans-serif;font-size:31px;font-weight:600;margin:22px 0 16px}.hero-method strong{color:var(--red)}.hero-lead{max-width:610px;color:#cfd3d8;line-height:1.65;font-size:16px;margin:0 0 28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{border:0;border-radius:9px;padding:14px 21px;font-size:13px;font-weight:850;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .18s,background .18s,border .18s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--red);color:#fff}.btn-primary:hover{background:var(--red2)}.btn-ghost{border:1px solid rgba(255,255,255,.42);color:#fff;background:rgba(0,0,0,.18)}.btn-light{background:#f0f1f2;color:#111}.btn-white{background:#fff;color:#9d080d}.hero-proof{margin-top:38px;padding-top:20px;border-top:1px solid rgba(255,255,255,.15);display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.hero-proof>div{display:flex;gap:10px;align-items:center}.hero-proof svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.5}.hero-proof span{display:grid;gap:2px}.hero-proof b{font-size:12px}.hero-proof small{font-size:10px;color:#9ea5ad}
.section{padding:86px 0}.section-heading{max-width:850px;margin-bottom:34px}.section-heading.centered{text-align:center;margin-inline:auto;margin-bottom:38px}.section-heading h2{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;font-size:clamp(38px,4vw,61px);line-height:.98;margin:0 0 12px;letter-spacing:-.012em}.section-heading p{margin:0;color:var(--muted);font-size:15px;line-height:1.7;max-width:760px}.section-heading.centered p{margin-inline:auto}.diagnostic{background:linear-gradient(#fff,#f4f5f5)}.diagnostic-layout{display:grid;grid-template-columns:minmax(420px,.8fr) minmax(620px,1.2fr);gap:28px;align-items:stretch}.symptom-panel{display:flex;flex-direction:column}.symptom-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.symptom-card{border:1px solid #d9dde1;background:#fff;border-radius:14px;min-height:116px;padding:15px 11px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;cursor:pointer;transition:.18s}.symptom-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(16,25,35,.07);border-color:#b9bec4}.symptom-card.active{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red);background:#fffafa;color:var(--red)}.symptom-card svg{width:31px;height:31px;fill:none;stroke:currentColor;stroke-width:1.5}.symptom-card b{font-size:12px;line-height:1.15}.symptom-card small{font-size:9px;color:#858b92;line-height:1.25}.diagnostic-note{margin:14px 0 0;font-size:11px;color:#717780;display:flex;align-items:flex-start;gap:7px;line-height:1.45}.diagnostic-note svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;flex:0 0 auto}.diagnostic-result{min-height:494px;background:#fff;border:1px solid #dfe2e5;border-radius:18px;box-shadow:0 16px 50px rgba(12,19,27,.07);overflow:hidden}.result-product{height:100%;display:grid;grid-template-columns:1.1fr 230px .9fr}.result-copy{padding:31px 0 31px 31px}.result-kicker{display:block;color:var(--red);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.result-copy h3{font-family:'Barlow Condensed';font-size:34px;line-height:1;margin:7px 0 9px}.result-copy p{font-size:13px;line-height:1.55;color:#646a72}.result-divider{height:1px;background:#e5e7e9;margin:20px 0}.result-copy h4,.apply h4{font-size:10px;text-transform:uppercase;letter-spacing:.07em;margin:0 0 8px}.result-copy ul{list-style:none;padding:0;margin:15px 0;display:grid;gap:10px}.result-copy li{font-size:12px;display:flex;gap:8px;line-height:1.4}.result-copy li:before{content:'✓';color:var(--accent);font-weight:900}.result-product-image{position:relative;display:flex;justify-content:center;align-items:flex-end;background:linear-gradient(#f7f7f7,#eceeed);padding:22px 10px 0}.result-product-image:after{content:"";position:absolute;bottom:24px;width:72%;height:18px;border-radius:50%;background:rgba(0,0,0,.16);filter:blur(11px)}.result-product-image img{height:430px;width:auto;object-fit:contain;position:relative;z-index:2;filter:drop-shadow(0 18px 16px rgba(0,0,0,.13))}.apply{padding:31px 25px;border-left:1px solid #e5e7e9}.apply ol{padding:0;list-style:none;counter-reset:steps;display:grid;gap:15px;margin:14px 0 20px}.apply li{counter-increment:steps;display:grid;grid-template-columns:28px 1fr;gap:9px;font-size:12px;line-height:1.45}.apply li:before{content:counter(steps);width:28px;height:28px;background:var(--red);color:#fff;border-radius:50%;display:grid;place-items:center;font-weight:900}.application-fallback{border-top:1px solid #e4e6e8;padding-top:13px;font-size:11px;color:#697078;line-height:1.5}.result-workshop{height:100%;padding:44px;display:grid;align-content:center;background:radial-gradient(circle at 85% 15%,rgba(211,13,20,.12),transparent 34%),#fff}.result-workshop svg{width:48px;height:48px;stroke:var(--red);fill:none;stroke-width:1.5}.result-workshop h3{font-family:'Barlow Condensed';text-transform:uppercase;font-size:42px;line-height:1;margin:16px 0 12px}.result-workshop p{max-width:620px;color:#616873;line-height:1.65}.result-workshop .btn{justify-self:start;margin-top:10px}
.method{background:linear-gradient(110deg,#07090c,#11151a,#07090c);color:#fff;border-block:1px solid #1d2228}.method-inner{min-height:150px;display:grid;grid-template-columns:170px 1fr 36px 1fr 36px 1fr;gap:20px;align-items:center}.method-title{font-family:'Barlow Condensed';font-size:25px;text-transform:uppercase;display:grid;line-height:.9}.method-title span{color:#9299a0;font-size:16px}.method-step{display:grid;grid-template-columns:30px 52px 1fr;gap:12px;align-items:center}.step-no{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--red);font-weight:900;font-size:12px}.method-step svg{width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:1.35}.method-step b{text-transform:uppercase;font-size:14px}.method-step p{margin:3px 0 0;color:#aeb4bb;font-size:10px;line-height:1.45}.method-arrow{font-size:24px;color:#6e747c;text-align:center}
.treatments{background:#f7f8f8}.product-stage{position:relative}.product-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,1fr);gap:13px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 3px 20px}.product-track::-webkit-scrollbar{display:none}.product-card{scroll-snap-align:start;background:#fff;border:1px solid #dfe2e4;border-radius:16px;padding:17px 16px 18px;min-height:430px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:.22s}.product-card:before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:4px;background:var(--accent)}.product-card:hover{transform:translateY(-5px);box-shadow:0 17px 44px rgba(9,17,25,.09)}.product-card.featured{background:linear-gradient(180deg,#fffdf5,#fff 66%);border-color:#d3bd78}.product-bottle{height:240px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:13px}.product-bottle img{height:226px;width:auto;object-fit:contain;filter:drop-shadow(0 14px 12px rgba(0,0,0,.12));transition:.22s}.product-card.featured .product-bottle img{height:244px}.product-card:hover .product-bottle img{transform:translateY(-4px)}.product-card h3{font-family:'Barlow Condensed';font-size:24px;line-height:.95;text-transform:uppercase;margin:5px 0 8px}.product-card p{font-size:11px;color:#6b727a;line-height:1.5;margin:0 0 14px}.product-card button{margin-top:auto;align-self:flex-start;border:0;background:none;color:var(--red);font-weight:850;font-size:11px;padding:5px 0}.carousel-arrow{position:absolute;top:43%;z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid #ccd0d4;background:#fff;box-shadow:0 7px 20px rgba(0,0,0,.09);font-size:26px}.carousel-arrow.left{left:-18px}.carousel-arrow.right{right:-18px}
.section-dark{background:#080a0d;color:#fff}.evidence-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;align-items:center}.section-heading.on-dark p{color:#b1b8c0}.evidence-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.evidence-grid article{min-height:215px;border:1px solid #242930;border-radius:16px;padding:24px;background:linear-gradient(145deg,#13171c,#0c0f13)}.evidence-grid svg{width:34px;height:34px;fill:none;stroke:#fff;stroke-width:1.4;margin-bottom:27px}.evidence-grid b{display:block;text-transform:uppercase;font-size:12px}.evidence-grid p{font-size:10px;color:#9ca4ad;line-height:1.55}.sector-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.sector-card{min-height:190px;border-radius:16px;background:radial-gradient(circle at 85% 15%,rgba(211,13,20,.18),transparent 35%),linear-gradient(145deg,#171b20,#090b0e);color:#fff;border:1px solid #23282e;padding:21px;display:flex;flex-direction:column;overflow:hidden;position:relative;transition:.2s}.sector-card:after{content:"";position:absolute;right:-30px;bottom:-55px;width:150px;height:150px;border:1px solid rgba(255,255,255,.07);border-radius:50%}.sector-card:hover{transform:translateY(-4px);border-color:#363c44}.sector-card svg{width:38px;height:38px;fill:none;stroke:#fff;stroke-width:1.3;margin-bottom:auto}.sector-card h3{font-family:'Barlow Condensed';font-size:25px;text-transform:uppercase;margin:22px 0 5px}.sector-card p{font-size:10px;color:#adb4bc;line-height:1.5;margin:0}
.workshops{background:#fff}.workshop-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:58px;align-items:center}.workshop-copy h2,.distributor-copy h2,.contact-copy h2{font-family:'Barlow Condensed';font-size:clamp(43px,4vw,62px);line-height:.95;text-transform:uppercase;margin:0 0 15px}.workshop-copy>p,.distributor-copy>p,.contact-copy>p{color:#626a74;line-height:1.7;font-size:14px}.network-benefits{margin-top:28px;display:grid;gap:12px}.network-benefits>div{display:flex;align-items:center;gap:12px}.network-benefits svg{width:31px;height:31px;fill:none;stroke:var(--red);stroke-width:1.4}.network-benefits span{display:grid}.network-benefits b{font-size:12px}.network-benefits small{font-size:10px;color:#818890}.finder{background:#0b0e12;color:#fff;border-radius:20px;padding:25px;box-shadow:0 24px 70px rgba(0,0,0,.18)}.finder-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.finder-head>div{display:grid}.finder-head span{font-size:10px;color:#9ba2aa;text-transform:uppercase;letter-spacing:.08em}.finder-head b{font-size:20px;margin-top:3px}.demo-badge{padding:6px 8px;border:1px solid #4a5058;border-radius:6px;color:#d0d4d8!important}.search-field{margin-top:19px;height:48px;border:1px solid #353b43;background:#07090c;border-radius:10px;display:flex;align-items:center;padding:0 13px}.search-field svg{width:19px;height:19px;fill:none;stroke:#8b929b;stroke-width:1.5}.search-field input{flex:1;background:none;color:#fff;border:0;outline:0;padding:0 10px;font-size:12px}.workshop-results{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:9px}.workshop-result{border:1px solid #282d34;border-radius:11px;background:#11151a;padding:13px}.workshop-result b{font-size:11px}.workshop-result p{margin:5px 0 9px;font-size:9px;color:#959da6}.workshop-result .tags{display:flex;flex-wrap:wrap;gap:4px}.workshop-result .tags span{font-size:8px;background:#1c2127;border-radius:999px;padding:4px 6px;color:#c2c7cd}.finder-note{font-size:9px;color:#777f88;line-height:1.5;margin:13px 0 0}
.distributors{position:relative;overflow:hidden}.distributors:after{content:"";position:absolute;right:-180px;top:-150px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(211,13,20,.18),transparent 68%)}.distributor-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;position:relative;z-index:1;align-items:center}.distributor-copy>p{color:#aeb5bd}.distributor-points{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.distributor-points>div{min-height:220px;border:1px solid #262b31;background:#101419;border-radius:16px;padding:24px}.distributor-points span{font-family:'Barlow Condensed';font-size:35px;color:#6b7076}.distributor-points b{display:block;text-transform:uppercase;font-size:12px;margin:28px 0 7px}.distributor-points p{font-size:10px;line-height:1.55;color:#9ca4ac}.contact{background:#f5f6f6}.contact-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;align-items:start}.contact-status{margin-top:24px;display:flex;align-items:center;gap:8px;color:#7a8087;font-size:10px}.contact-status span{width:8px;height:8px;border-radius:50%;background:#d79a1f}.lead-form{background:#fff;border:1px solid #dfe2e4;border-radius:18px;padding:28px;box-shadow:0 16px 45px rgba(12,19,27,.06)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}.lead-form label{display:grid;gap:6px;font-size:10px;font-weight:800;margin-bottom:13px}.lead-form input,.lead-form select,.lead-form textarea{width:100%;border:1px solid #ced3d7;border-radius:9px;background:#fff;padding:12px 13px;outline:none;font-size:12px}.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(211,13,20,.08)}.form-actions{display:flex;gap:9px}.form-feedback{font-size:10px;color:#65707a;margin:12px 0 0;min-height:16px}.final-cta{background:linear-gradient(90deg,#8c0005,#d10c13 50%,#8b0005);color:#fff;padding:34px 0}.final-cta-inner{display:flex;justify-content:space-between;gap:30px;align-items:center}.final-cta span{text-transform:uppercase;font-size:10px;letter-spacing:.1em}.final-cta h2{font-family:'Barlow Condensed';text-transform:uppercase;font-size:35px;line-height:.95;margin:6px 0 0;max-width:760px}.site-footer{background:#080a0d;color:#fff;padding:42px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:45px}.footer-brand img{width:155px;height:auto;filter:drop-shadow(0 0 1px rgba(255,255,255,.7))}.footer-brand p{color:#8f969e;font-size:10px;line-height:1.55;max-width:260px}.footer-grid b{font-size:10px;text-transform:uppercase;display:block;margin-bottom:10px}.footer-grid a,.footer-grid button{display:block;color:#9da4ac;font-size:10px;line-height:2;border:0;background:none;padding:0;cursor:pointer}.footer-grid a:hover,.footer-grid button:hover{color:#fff}.footer-bottom{border-top:1px solid #20242a;margin-top:28px;padding-top:15px;display:flex;justify-content:space-between;color:#717981;font-size:9px}.to-top{position:fixed;right:20px;bottom:20px;width:42px;height:42px;border-radius:50%;border:1px solid #ccc;background:#fff;box-shadow:0 8px 25px rgba(0,0,0,.1);z-index:50;opacity:0;pointer-events:none;transition:.2s}.to-top.visible{opacity:1;pointer-events:auto}
.modal,.shop-drawer{position:fixed;inset:0;z-index:300;pointer-events:none;opacity:0;transition:.2s}.modal.open,.shop-drawer.open{pointer-events:auto;opacity:1}.modal-backdrop,.drawer-backdrop{position:absolute;inset:0;background:rgba(4,6,8,.72);backdrop-filter:blur(5px)}.modal-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%) scale(.98);width:min(930px,calc(100% - 36px));max-height:min(760px,calc(100vh - 36px));overflow:auto;background:#fff;border-radius:20px;transition:.2s;box-shadow:0 30px 90px rgba(0,0,0,.3)}.modal.open .modal-card{transform:translate(-50%,-50%) scale(1)}.modal-close{position:sticky;float:right;top:10px;margin:10px 10px 0 0;width:38px;height:38px;border-radius:50%;border:1px solid #d5d8dc;background:#fff;font-size:24px;z-index:3}.modal-product{display:grid;grid-template-columns:310px 1fr;min-height:560px}.modal-product-image{background:linear-gradient(#f5f5f4,#e9ebeb);display:flex;align-items:center;justify-content:center;padding:28px}.modal-product-image img{height:480px;width:auto;object-fit:contain;filter:drop-shadow(0 20px 18px rgba(0,0,0,.12))}.modal-product-copy{padding:50px 46px}.modal-product-copy h2{font-family:'Barlow Condensed';font-size:45px;line-height:.95;text-transform:uppercase;margin:6px 0 13px}.modal-product-copy p{font-size:13px;line-height:1.65;color:#626972}.modal-product-copy .specs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.spec{padding:13px;border:1px solid #e0e3e5;border-radius:10px}.spec b{font-size:9px;text-transform:uppercase;display:block;margin-bottom:4px}.spec span{font-size:11px;color:#666}.drawer-panel{position:absolute;right:0;top:0;bottom:0;width:min(480px,100%);background:#fff;padding:28px;transform:translateX(100%);transition:.25s;overflow:auto;box-shadow:-20px 0 70px rgba(0,0,0,.22)}.shop-drawer.open .drawer-panel{transform:translateX(0)}.drawer-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.drawer-head span{font-size:10px;text-transform:uppercase;color:var(--red);font-weight:900}.drawer-head h2{font-family:'Barlow Condensed';font-size:40px;text-transform:uppercase;margin:3px 0}.drawer-head button{border:0;background:#f0f1f2;border-radius:50%;width:38px;height:38px;font-size:23px}.drawer-intro{font-size:11px;color:#737a82;line-height:1.55}.drawer-products{display:grid;gap:8px;margin:20px 0}.drawer-product{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;border:1px solid #e1e4e6;border-radius:12px;padding:10px}.drawer-product img{height:77px;width:auto;margin:auto}.drawer-product b{font-size:11px;text-transform:uppercase}.drawer-product small{display:block;color:#80878e;font-size:9px;margin-top:3px}.drawer-cta{width:100%}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}
@media(max-width:1200px){.main-nav{gap:18px;font-size:11px}.hero-layout{grid-template-columns:minmax(480px,620px) 1fr}.diagnostic-layout{grid-template-columns:.85fr 1.15fr}.result-product{grid-template-columns:1fr 190px}.apply{grid-column:1/-1;border-left:0;border-top:1px solid #e5e7e9;display:grid;grid-template-columns:1fr 1fr;gap:18px}.diagnostic-result{min-height:600px}.product-track{grid-auto-columns:minmax(200px,25%)}.sector-grid{grid-template-columns:repeat(3,1fr)}.evidence-layout,.workshop-layout,.distributor-layout,.contact-layout{gap:40px}.method-inner{grid-template-columns:130px 1fr 25px 1fr 25px 1fr}}
@media(max-width:960px){:root{--header:70px}.shell{width:min(var(--shell),calc(100% - 32px))}.nav-toggle{display:block;margin-left:auto}.main-nav{position:absolute;left:16px;right:16px;top:calc(100% + 8px);background:#fff;border:1px solid #e1e4e6;border-radius:15px;box-shadow:var(--shadow);padding:13px;display:none;flex-direction:column;align-items:stretch;gap:0}.main-nav.open{display:flex}.main-nav>a{padding:13px}.main-nav>a:after{display:none}.shop-link{margin-top:5px}.hero{min-height:630px}.hero-media{background-image:none;background-position:center}.hero-shade{background:linear-gradient(90deg,rgba(5,7,9,.96),rgba(5,7,9,.78) 55%,rgba(5,7,9,.25))}.hero-layout{grid-template-columns:1fr}.hero-copy{max-width:620px}.diagnostic-layout,.evidence-layout,.workshop-layout,.distributor-layout,.contact-layout{grid-template-columns:1fr}.result-product{grid-template-columns:1fr 220px}.apply{grid-column:1/-1}.method-inner{grid-template-columns:1fr;gap:0;padding:25px 0}.method-title{text-align:center;margin-bottom:10px}.method-step{border-top:1px solid #242930;padding:15px 0;grid-template-columns:30px 45px 1fr}.method-arrow{display:none}.product-track{grid-auto-columns:minmax(220px,36%)}.evidence-grid{grid-template-columns:repeat(3,1fr)}.sector-grid{grid-template-columns:repeat(2,1fr)}.distributor-points{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1.5fr repeat(3,1fr)}}
@media(max-width:680px){.brand{width:145px}.brand img{width:144px}.hero{min-height:700px}.hero-media{background-position:55% center;opacity:.62}.hero-shade{background:linear-gradient(180deg,rgba(5,7,9,.82),rgba(5,7,9,.94) 65%,#050709)}.hero-layout{min-height:700px;align-items:flex-end}.hero-copy{padding:80px 0 38px}.hero h1{font-size:49px;max-width:440px}.hero-method{font-size:25px}.hero-lead{font-size:14px}.hero-actions{display:grid;grid-template-columns:1fr}.hero-proof{grid-template-columns:1fr;gap:10px}.section{padding:66px 0}.section-heading h2{font-size:42px}.symptom-grid{grid-template-columns:repeat(2,1fr)}.symptom-card{min-height:106px}.result-product{grid-template-columns:1fr}.result-copy{padding:25px}.result-product-image{min-height:370px}.result-product-image img{height:355px}.apply{grid-template-columns:1fr;padding:24px}.diagnostic-result{min-height:auto}.product-track{grid-auto-columns:76%}.carousel-arrow{display:none}.evidence-grid,.sector-grid,.distributor-points,.workshop-results,.field-row{grid-template-columns:1fr}.evidence-grid article{min-height:160px}.workshop-layout{gap:26px}.finder{padding:20px}.contact-layout{gap:28px}.form-actions{display:grid}.final-cta-inner{align-items:flex-start;flex-direction:column}.final-cta h2{font-size:29px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:7px}.modal-product{grid-template-columns:1fr}.modal-product-image{min-height:380px}.modal-product-image img{height:345px}.modal-product-copy{padding:28px}.modal-product-copy .specs{grid-template-columns:1fr}.to-top{width:38px;height:38px;right:13px;bottom:13px}}

/* ==========================================================
   DRFUELS — PREMIUM BRANDING PASS V2
   Static HTML · no runtime dependencies
   ========================================================== */
:root{
  --shell:1520px;
  --red:#cf0d14;
  --red-deep:#9b080d;
  --graphite:#0b0e12;
  --silver:#e7eaec;
  --clinical:#f7f8f8;
}
body{background:#f3f4f4}
.shell{width:min(var(--shell),calc(100% - clamp(32px,4vw,76px)))}

/* Header: clean, multinational, logo with no artificial plate/background */
.site-header{background:rgba(255,255,255,.975);border-bottom:1px solid rgba(14,18,23,.09);box-shadow:0 6px 24px rgba(7,12,17,.035)}
.header-inner{height:80px;gap:42px}
.brand{width:184px;height:62px;overflow:visible}
.brand img{width:181px;height:auto;transform:none;filter:none}
.main-nav{gap:30px;font-size:12px;letter-spacing:-.01em}
.main-nav>a{padding:30px 0 27px;color:#20242a}
.main-nav>a:after{bottom:18px}
.shop-link{padding:12px 20px;border-radius:7px;box-shadow:0 8px 22px rgba(207,13,20,.16)}
.shop-link:hover{box-shadow:0 11px 28px rgba(207,13,20,.22)}

/* Hero: more editorial, one conversion action, stronger clinical engineering character */
.hero{min-height:690px;border-bottom:0}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--red),#641014 36%,transparent 72%);z-index:5}
.hero-media{background-position:70% center;transform:scale(1.005)}
.hero-shade{background:linear-gradient(90deg,#050709 0%,rgba(5,7,9,.98) 22%,rgba(5,7,9,.82) 39%,rgba(5,7,9,.28) 62%,rgba(5,7,9,.05) 100%)}
.hero-glow{width:780px;height:780px;left:-350px;top:-210px;background:radial-gradient(circle,rgba(207,13,20,.22),transparent 68%)}
.hero-layout{min-height:690px;grid-template-columns:minmax(560px,720px) 1fr}
.hero-copy{padding:72px 0 62px}
.eyebrow{font-size:10px;letter-spacing:.17em;margin-bottom:17px}
.hero h1{font-size:clamp(62px,5.35vw,94px);line-height:.89;max-width:760px;text-wrap:balance}
.hero-method{font-size:34px;margin:26px 0 15px;letter-spacing:.005em}
.hero-lead{max-width:650px;font-size:15px;color:#d3d7dc;line-height:1.72}
.hero-actions{margin-top:2px}
.btn-hero{min-width:224px;gap:16px;padding:15px 22px;border-radius:7px;box-shadow:0 16px 34px rgba(207,13,20,.22)}
.btn-hero span{font-size:18px;transition:transform .18s ease}
.btn-hero:hover span{transform:translateX(4px)}
.hero-proof{max-width:700px;margin-top:42px;padding-top:22px;gap:22px}
.hero-proof>div{padding-right:18px;border-right:1px solid rgba(255,255,255,.12)}
.hero-proof>div:last-child{border-right:0}
.hero-proof svg{width:26px;height:26px;color:#fff}
.hero-proof b{font-size:11px;letter-spacing:.01em}.hero-proof small{font-size:9px}

/* Global section rhythm */
.section{padding:96px 0}
.section-heading{margin-bottom:38px}.section-heading.centered{margin-bottom:44px}
.section-heading h2{font-size:clamp(42px,4.2vw,66px);letter-spacing:-.018em}
.section-heading p{font-size:14px;max-width:780px}

/* Diagnostic: central differentiator */
.diagnostic{background:linear-gradient(180deg,#fff 0,#f7f8f8 48%,#f0f2f2 100%);position:relative;overflow:hidden}
.diagnostic:before{content:"";position:absolute;width:620px;height:620px;right:-340px;top:70px;border-radius:50%;border:1px solid rgba(10,17,24,.05);box-shadow:0 0 0 80px rgba(10,17,24,.018),0 0 0 160px rgba(10,17,24,.012)}
.diagnostic>.shell{position:relative;z-index:2}
.diagnostic-journey{display:grid;grid-template-columns:1fr 30px 1fr 30px 1fr;align-items:center;gap:12px;margin:-8px 0 30px;padding:14px 16px;border:1px solid #dfe3e6;background:rgba(255,255,255,.72);backdrop-filter:blur(10px);border-radius:14px}
.diagnostic-journey>div{display:grid;grid-template-columns:42px 1fr;column-gap:12px;align-items:center}
.diagnostic-journey span{grid-row:1/3;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#11151a;color:#fff;font-family:'Barlow Condensed';font-size:16px;font-weight:700}
.diagnostic-journey b{font-size:11px;text-transform:uppercase;letter-spacing:.03em}.diagnostic-journey small{font-size:9px;color:#7b828a;margin-top:2px}.diagnostic-journey i{font-style:normal;color:#abb1b7;text-align:center}
.diagnostic-layout{grid-template-columns:minmax(440px,.82fr) minmax(650px,1.18fr);gap:34px}
.symptom-grid{gap:11px}
.symptom-card{min-height:122px;border-radius:13px;background:rgba(255,255,255,.96);box-shadow:0 3px 10px rgba(12,20,28,.02)}
.symptom-card:hover{border-color:#aeb5bc;box-shadow:0 16px 34px rgba(11,19,26,.075)}
.symptom-card.active{color:var(--red);background:linear-gradient(180deg,#fff,#fff7f7);box-shadow:inset 0 0 0 1px var(--red),0 15px 34px rgba(207,13,20,.07)}
.symptom-card svg{width:34px;height:34px}.symptom-card b{font-size:11px}.symptom-card small{font-size:8.5px}
@media(min-width:961px){.diagnostic-result{position:sticky;top:104px;align-self:start}}
.diagnostic-result{border-radius:20px;border-color:#d8dde0;box-shadow:0 24px 60px rgba(7,14,21,.09)}
.result-product{grid-template-columns:1.05fr 235px .92fr}
.result-copy{padding:34px 0 34px 34px}.result-copy h3{font-size:36px}.result-kicker{letter-spacing:.09em}
.result-product-image{background:radial-gradient(circle at 50% 32%,var(--accent-soft,rgba(0,0,0,.06)),transparent 47%),linear-gradient(#f8f9f9,#eceeee)}
.result-product-image:after{bottom:30px;width:64%;height:13px;background:rgba(0,0,0,.13);filter:blur(12px)}
.result-product-image img{height:438px;filter:drop-shadow(0 18px 14px rgba(0,0,0,.11))}
.apply{padding:34px 27px}
.application-fallback{background:#f6f7f7;border:1px solid #e4e7e8;border-radius:9px;padding:12px;margin-top:15px}

/* Method bar: compact, high-contrast, no visual redundancy */
.method{background:linear-gradient(104deg,#05070a,#11161b 50%,#080b0f);border:0;box-shadow:inset 0 1px rgba(255,255,255,.04),inset 0 -1px rgba(255,255,255,.04)}
.method-inner{min-height:142px}
.method-title strong{font-size:31px}.method-title span{font-size:12px;letter-spacing:.12em}
.method-step svg{color:#f5f7f8}.method-step b{letter-spacing:.04em}
.method-arrow{color:#565d65}

/* Product family: stronger premium system and product hierarchy */
.treatments{background:linear-gradient(180deg,#f7f8f8 0,#fff 35%,#f4f5f5 100%)}
.product-stage{padding-inline:3px}
.product-track{grid-auto-columns:minmax(250px,27.5%);gap:16px;padding:10px 4px 30px;scroll-padding-inline:4px}
.product-card{min-height:500px;padding:0 19px 20px;border-radius:18px;border-color:#dce0e3;background:linear-gradient(180deg,#fff 0,#fff 74%,#fafafa 100%);box-shadow:0 8px 26px rgba(8,16,23,.035)}
.product-card:before{height:3px}
.product-card:after{content:"";position:absolute;width:230px;height:230px;left:50%;top:70px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,var(--accent-soft) 0,transparent 68%);opacity:.72;pointer-events:none}
.product-card:hover{transform:translateY(-7px);box-shadow:0 24px 58px rgba(7,15,23,.105);border-color:#cbd0d4}
.product-card.featured{background:linear-gradient(180deg,#fffdf4 0,#fff 72%,#fbf7ea 100%);border-color:#cfb969;box-shadow:0 12px 35px rgba(121,93,18,.09)}
.product-card.featured:after{background:radial-gradient(circle,rgba(201,162,39,.20),transparent 68%)}
.product-card-head{height:48px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2;border-bottom:1px solid #eceeef}
.product-card-head span{font-family:'Barlow Condensed';font-weight:700;font-size:19px;color:#a1a7ad}.product-card-head em{font-style:normal;font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#7b828a}.product-card.featured .product-card-head em{color:#8f6f10;font-weight:800}
.product-bottle{height:292px;margin:8px 0 5px;position:relative;z-index:2}
.product-bottle img{height:276px;filter:drop-shadow(0 16px 14px rgba(0,0,0,.115))}.product-card.featured .product-bottle img{height:298px}
.product-copy{position:relative;z-index:2}.product-card h3{font-size:29px;margin:5px 0 8px}.product-card p{font-size:10.5px;line-height:1.55;min-height:48px}
.product-card button{position:relative;z-index:2;display:flex;align-items:center;gap:10px;color:#171b20;text-transform:uppercase;font-size:9px;letter-spacing:.05em;padding:8px 0}.product-card button span{color:var(--accent);font-size:15px}.product-card button:hover{color:var(--accent)}
.carousel-arrow{width:44px;height:44px;background:#101419;color:#fff;border:0;box-shadow:0 12px 28px rgba(0,0,0,.14)}.carousel-arrow:hover{background:var(--red)}

/* Evidence: brand trust rather than development language */
.evidence{background:radial-gradient(circle at 10% 50%,rgba(207,13,20,.11),transparent 30%),linear-gradient(105deg,#07090c,#11151a)}
.evidence-grid article{border-color:#282d33;background:linear-gradient(145deg,#13171c,#0d1014);border-radius:15px}
.evidence-grid article:hover{border-color:#3d444c;transform:translateY(-3px)}

/* Sector cards: photography restores multinational/B2B scale */
.sectors{background:#f4f5f5}
.sector-grid{grid-template-columns:repeat(4,1fr);gap:14px}
.sector-card{min-height:250px;padding:0;border-radius:17px;border:1px solid #222831;background:#0c1014;isolation:isolate;box-shadow:0 14px 32px rgba(6,13,19,.07)}
.sector-card:after{display:none}
.sector-media{position:absolute;inset:0;background:var(--sector-image,none) center/cover no-repeat;z-index:-2;transition:transform .45s ease,filter .35s ease}
.sector-card.has-image:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,8,11,.08) 10%,rgba(5,8,11,.38) 48%,rgba(5,8,11,.93) 100%);z-index:-1}
.sector-card.tech-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 20%,rgba(207,13,20,.28),transparent 34%),linear-gradient(145deg,#191e24,#090c10);z-index:-1}
.sector-card:hover{transform:translateY(-5px);border-color:#424a53;box-shadow:0 22px 50px rgba(6,13,19,.15)}.sector-card.has-image:hover .sector-media{transform:scale(1.045);filter:saturate(1.05) contrast(1.03)}
.sector-content{height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:22px}
.sector-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(9,13,17,.72);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);margin-bottom:auto}
.sector-card svg{width:23px;height:23px;margin:0}.sector-card h3{font-size:26px;margin:40px 0 7px}.sector-card p{font-size:9.5px;color:#d2d6db;max-width:270px}

/* Professional network: no fake companies, conversion path remains functional */
.workshops{background:linear-gradient(180deg,#fff,#f7f8f8)}
.finder{border-radius:20px;background:radial-gradient(circle at 90% 0,rgba(207,13,20,.12),transparent 28%),#0a0e12}
.network-status{border:1px solid #373e46!important;border-radius:999px;padding:6px 9px;color:#c5cbd1!important;font-size:7px!important;letter-spacing:.08em!important}
.workshop-results{grid-template-columns:1fr}
.network-empty{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:start;border:1px solid #282f36;background:#11161b;border-radius:13px;padding:18px}
.network-empty svg{width:34px;height:34px;stroke:#fff;fill:none;stroke-width:1.35}.network-empty b{font-size:13px}.network-empty p{font-size:9.5px;line-height:1.55;color:#9da5ad;margin:6px 0 0}.network-empty.request{border-color:#433034;background:linear-gradient(145deg,#15181c,#160d10)}.network-empty .btn-small{padding:10px 13px;font-size:9px;margin-top:10px}
.finder-note{color:#8e969e}

/* Distribution / contact: remove prototype feel */
.distributor-points>div{border-radius:14px;min-height:205px;transition:.2s}.distributor-points>div:hover{transform:translateY(-4px);border-color:#3e454d;background:#14191f}
.lead-form{border-radius:17px;box-shadow:0 22px 58px rgba(8,17,25,.07)}
.contact-status{font-size:9px;text-transform:uppercase;letter-spacing:.06em}

/* Drawer and modal refinements */
.modal-card{border-radius:18px}.modal-product-image{position:relative}.modal-product-image:after{content:"";position:absolute;bottom:36px;width:55%;height:15px;border-radius:50%;background:rgba(0,0,0,.11);filter:blur(12px)}.modal-product-image img{position:relative;z-index:2}
.drawer-product{width:100%;text-align:left;background:#fff;cursor:pointer}.drawer-product>span{margin-left:auto;color:#a8afb5;font-size:18px}.drawer-product:hover{border-color:#bac0c5;background:#fafafa}.drawer-product:hover>span{color:var(--red)}
.footer-brand img{filter:none}.footer-bottom{color:#7f878f}

/* Focus / keyboard quality */
:focus-visible{outline:3px solid rgba(207,13,20,.32);outline-offset:3px}.symptom-card:focus-visible,.product-card button:focus-visible,.shop-link:focus-visible{outline-color:rgba(207,13,20,.48)}

@media(max-width:1250px){
  .main-nav{gap:20px;font-size:11px}.brand{width:170px}.brand img{width:168px}
  .diagnostic-layout{grid-template-columns:.85fr 1.15fr}.product-track{grid-auto-columns:minmax(235px,31%)}
  .sector-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:960px){
  .header-inner{height:72px}.brand{width:160px;height:55px}.brand img{width:158px}
  .hero{min-height:650px}.hero-layout{min-height:650px}.hero h1{font-size:clamp(54px,8vw,74px)}
  .diagnostic-journey{grid-template-columns:1fr;gap:8px}.diagnostic-journey i{display:none}.diagnostic-journey>div{padding:4px 0}
  .diagnostic-result{position:static}.product-track{grid-auto-columns:minmax(230px,40%)}
  .sector-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .shell{width:min(var(--shell),calc(100% - 28px))}.header-inner{height:68px}.brand{width:146px}.brand img{width:144px}
  .hero{min-height:720px}.hero-layout{min-height:720px}.hero-copy{padding:92px 0 40px}.hero h1{font-size:50px}.hero-method{font-size:28px}.hero-lead{font-size:13px}
  .hero-proof{grid-template-columns:1fr;gap:10px}.hero-proof>div{border-right:0;padding-right:0}
  .section{padding:72px 0}.section-heading h2{font-size:44px}
  .diagnostic-journey{padding:12px;margin-bottom:22px}.diagnostic-journey>div{grid-template-columns:38px 1fr}.diagnostic-journey span{width:38px;height:38px}
  .result-product-image img{height:365px}.product-track{grid-auto-columns:82%}.product-card{min-height:490px}.product-bottle{height:280px}.product-bottle img{height:268px}.product-card.featured .product-bottle img{height:286px}
  .sector-grid{grid-template-columns:1fr}.sector-card{min-height:260px}.sector-card h3{font-size:29px}
  .network-empty{grid-template-columns:38px 1fr;padding:15px}.network-empty svg{width:29px;height:29px}
}
/* Header logo crop fix: exact original mark, transparent whitespace removed */
.brand{width:138px;height:70px;overflow:visible}.brand img{width:132px;height:auto;max-height:70px;object-fit:contain;transform:none}
@media(max-width:960px){.brand{width:126px;height:62px}.brand img{width:120px;max-height:62px}}
@media(max-width:680px){.brand{width:116px;height:58px}.brand img{width:112px;max-height:58px}}
/* Progressive enhancement: content stays visible if JavaScript is unavailable */
.reveal{opacity:1;transform:none}.js-ready .reveal{opacity:0;transform:translateY(18px)}.js-ready .reveal.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.js-ready .reveal{opacity:1;transform:none}}
@media print{.reveal,.js-ready .reveal{opacity:1!important;transform:none!important}}

/* =========================================================
   V3 · SENIOR BRAND DIRECTION PASS
   Editorial product hierarchy + multinational B2B rhythm
   ========================================================= */

/* Header: quieter, more corporate, with a stronger brand anchor */
.site-header{background:rgba(255,255,255,.975);box-shadow:0 1px 0 rgba(17,19,24,.045)}
.header-inner{max-width:1520px}
.main-nav{letter-spacing:.005em}
.main-nav>a{color:#262a30}.main-nav>a:hover{color:#000}
.shop-link{box-shadow:0 8px 22px rgba(211,13,20,.14)}

/* Hero: preserve the motor/medical mechanism as the dominant visual asset */
.hero{min-height:700px}
.hero-media{background-position:72% center;transform:scale(1.012)}
.hero-shade{background:linear-gradient(90deg,#05070a 0%,rgba(5,7,10,.985) 22%,rgba(5,7,10,.84) 40%,rgba(5,7,10,.34) 58%,rgba(5,7,10,.06) 80%,rgba(5,7,10,.02) 100%)}
.hero:after{content:"";position:absolute;right:5.5%;bottom:42px;width:180px;height:180px;border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 0 34px rgba(255,255,255,.018),0 0 0 68px rgba(255,255,255,.012);pointer-events:none}
.hero-layout{min-height:700px}
.hero h1{max-width:760px;text-wrap:balance}
.hero-lead{max-width:585px}
.hero-proof{max-width:660px}
.btn-hero{min-width:205px}

/* Section rhythm: consistent scale from top to bottom */
.section{padding:96px 0}
.section-heading{margin-bottom:40px}
.section-heading h2{font-size:clamp(42px,4vw,64px)}
.section-heading p{font-size:14px;max-width:720px}

/* Diagnostic: make the result feel like a technical dossier, not an ecommerce card */
.diagnostic{background:linear-gradient(180deg,#fff 0%,#f7f8f8 56%,#f2f3f3 100%)}
.diagnostic-layout{gap:34px}
.symptom-card{min-height:122px;border-radius:12px;background:rgba(255,255,255,.96)}
.symptom-card.active{background:linear-gradient(180deg,#fff,#fff7f7);box-shadow:inset 0 0 0 1px var(--red),0 12px 30px rgba(211,13,20,.06)}
.diagnostic-result{border-radius:16px;box-shadow:0 24px 64px rgba(9,16,24,.08);border-color:#d9dde1}
.result-product{grid-template-columns:minmax(300px,1.08fr) minmax(220px,.78fr) minmax(245px,.86fr)}
.result-copy{padding:36px 0 36px 36px}
.result-product-image{background:radial-gradient(circle at 50% 38%,var(--accent-soft),transparent 40%),linear-gradient(#fafafa,#eceeee)}
.result-product-image:before{content:"DRFUELS";position:absolute;top:28px;left:50%;transform:translateX(-50%);font-family:'Barlow Condensed';font-weight:700;letter-spacing:.18em;font-size:10px;color:#a3a9af;z-index:1}
.result-product-image img{height:446px}
.apply{background:#fbfbfb}

/* Product family: editorial hero product + six clearly differentiated treatments */
.treatments{background:linear-gradient(180deg,#f4f5f5 0%,#fff 28%,#f5f6f6 100%);overflow:hidden}
.product-showcase{display:grid;gap:18px}
.product-flagship{min-height:470px}
.flagship-card{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(420px,.92fr) minmax(360px,1.08fr);min-height:470px;border-radius:22px;background:linear-gradient(115deg,#0a0c0f 0%,#171510 45%,#090a0c 100%);color:#fff;border:1px solid rgba(201,162,39,.34);box-shadow:0 28px 78px rgba(35,28,10,.16)}
.flagship-card:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.025),transparent 36%),radial-gradient(circle at 82% 42%,rgba(201,162,39,.22),transparent 31%);pointer-events:none}
.flagship-copy{padding:58px 20px 54px 58px;position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.flagship-meta{width:100%;display:flex;justify-content:space-between;gap:18px;align-items:center;padding-bottom:18px;margin-bottom:29px;border-bottom:1px solid rgba(255,255,255,.12)}
.flagship-meta span{font-family:'Barlow Condensed';font-size:32px;color:#7e7660}.flagship-meta em{font-style:normal;text-transform:uppercase;font-size:8px;letter-spacing:.14em;color:#bcb4a0}
.gold-kicker{color:#d8b54d}
.flagship-copy h3{font-family:'Barlow Condensed';font-size:clamp(56px,5vw,82px);text-transform:uppercase;line-height:.88;margin:8px 0 19px;letter-spacing:-.02em}
.flagship-copy>p{max-width:590px;color:#c4c6c8;font-size:13px;line-height:1.68;margin:0}
.flagship-points{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}.flagship-points span{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.035);padding:7px 10px;border-radius:999px;font-size:8px;text-transform:uppercase;letter-spacing:.055em;color:#d0d2d4}
.flagship-btn{background:#d3ad3d;color:#111;border:1px solid #e1c161}.flagship-btn:hover{background:#e1bd4b}
.flagship-visual{position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:470px;padding:34px 36px 0}
.flagship-visual:after{content:"";position:absolute;bottom:42px;left:50%;transform:translateX(-50%);width:42%;height:22px;border-radius:50%;background:rgba(0,0,0,.55);filter:blur(15px)}
.flagship-visual img{height:435px;width:auto;object-fit:contain;position:relative;z-index:3;filter:drop-shadow(0 24px 20px rgba(0,0,0,.32))}
.gold-orbit{position:absolute;width:330px;height:330px;border-radius:50%;border:1px solid rgba(201,162,39,.25);top:58px;left:50%;transform:translateX(-50%);box-shadow:0 0 0 42px rgba(201,162,39,.04),0 0 0 84px rgba(201,162,39,.018)}
.flagship-code{position:absolute;right:28px;top:26px;color:#8f876f;font-family:'Barlow Condensed';font-size:12px;letter-spacing:.16em;z-index:4}
.product-family-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.product-family-grid .product-card{min-height:485px;padding:0 19px 20px;overflow:hidden}
.product-family-grid .product-bottle{height:278px}
.product-family-grid .product-bottle img{height:266px}
.product-family-grid .product-card h3{font-size:28px;line-height:.98}
.product-family-grid .product-card p{min-height:47px}

/* Evidence: stronger technical confidence and less prototype language visually */
.evidence-layout{gap:58px}
.evidence-grid{gap:14px}
.evidence-grid article{min-height:220px;padding:26px;position:relative;overflow:hidden}
.evidence-grid article:after{content:"";position:absolute;right:-45px;bottom:-45px;width:130px;height:130px;border-radius:50%;border:1px solid rgba(255,255,255,.05)}
.evidence-grid article svg{width:38px;height:38px}
.evidence-grid article b{font-size:13px}
.evidence-grid article p{font-size:10.5px;line-height:1.6}

/* Sectors: editorial 12-column photography mosaic */
.sectors{background:#f1f3f3}
.sector-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.sector-card{grid-column:span 4;min-height:270px}
.sector-card:nth-child(1),.sector-card:nth-child(2),.sector-card:nth-child(6),.sector-card:nth-child(7){grid-column:span 6;min-height:300px}
.sector-card:nth-child(1) .sector-content,.sector-card:nth-child(2) .sector-content,.sector-card:nth-child(6) .sector-content,.sector-card:nth-child(7) .sector-content{padding:28px}
.sector-card:nth-child(1) h3,.sector-card:nth-child(2) h3,.sector-card:nth-child(6) h3,.sector-card:nth-child(7) h3{font-size:32px}
.sector-icon{width:44px;height:44px}
.sector-content{padding:24px}
.sector-card h3{font-size:27px;letter-spacing:-.01em}
.sector-card p{font-size:10px;line-height:1.55}

/* Professional network: premium service panel */
.workshop-layout{grid-template-columns:.78fr 1.22fr;gap:72px}
.finder{padding:30px;border:1px solid #1e242b;box-shadow:0 30px 80px rgba(6,12,18,.18)}
.finder-head b{font-size:23px}
.search-field{height:54px;border-radius:9px}
.network-empty{padding:22px}
.network-benefits>div{padding:8px 0;border-bottom:1px solid #eceeef}.network-benefits>div:last-child{border-bottom:0}

/* Distribution: maintain visual scale late in the page */
.distributors{padding:100px 0}
.distributor-layout{grid-template-columns:.72fr 1.28fr;gap:78px}
.distributor-points>div{min-height:238px;padding:28px;background:linear-gradient(145deg,#11161b,#0d1115)}
.distributor-points span{font-size:42px}.distributor-points b{font-size:13px;margin-top:34px}.distributor-points p{font-size:10.5px}

/* Contact + footer: cleaner corporate close */
.contact{background:linear-gradient(180deg,#f6f7f7,#eff1f1)}
.lead-form{padding:32px}
.final-cta{padding:38px 0;background:linear-gradient(90deg,#810006,#c80b12 48%,#8b0006)}
.final-cta h2{font-size:38px}
.site-footer{padding-top:50px}.footer-grid{gap:55px}.footer-brand p{font-size:10.5px}.footer-bottom{margin-top:32px;padding-top:18px}

@media(max-width:1180px){
  .flagship-card{grid-template-columns:1fr 420px}.flagship-copy{padding-left:42px}.product-family-grid{grid-template-columns:repeat(2,1fr)}
  .sector-card,.sector-card:nth-child(1),.sector-card:nth-child(2),.sector-card:nth-child(6),.sector-card:nth-child(7){grid-column:span 6}
}
@media(max-width:960px){
  .hero,.hero-layout{min-height:670px}.hero-media{background-position:72% center}
  .flagship-card{grid-template-columns:1fr 340px;min-height:440px}.flagship-copy{padding:44px 12px 44px 36px}.flagship-visual{min-height:440px}.flagship-visual img{height:392px}.gold-orbit{width:270px;height:270px}
  .workshop-layout,.distributor-layout{grid-template-columns:1fr;gap:42px}
}
@media(max-width:720px){
  .section{padding:76px 0}.section-heading{margin-bottom:30px}
  .hero:after{display:none}.hero-media{background-position:68% center}.hero-shade{background:linear-gradient(180deg,rgba(5,7,10,.40) 0%,rgba(5,7,10,.72) 38%,rgba(5,7,10,.985) 75%,#05070a 100%)}
  .flagship-card{grid-template-columns:1fr;min-height:auto}.flagship-copy{padding:38px 28px 20px}.flagship-meta{margin-bottom:22px}.flagship-copy h3{font-size:58px}.flagship-visual{min-height:390px;padding-top:0}.flagship-visual img{height:360px}.gold-orbit{top:35px;width:255px;height:255px}.flagship-code{top:18px}
  .product-family-grid{grid-template-columns:1fr}.product-family-grid .product-card{min-height:470px}
  .sector-grid{grid-template-columns:1fr}.sector-card,.sector-card:nth-child(1),.sector-card:nth-child(2),.sector-card:nth-child(6),.sector-card:nth-child(7){grid-column:auto;min-height:270px}.sector-card h3,.sector-card:nth-child(1) h3,.sector-card:nth-child(2) h3,.sector-card:nth-child(6) h3,.sector-card:nth-child(7) h3{font-size:29px}
}

/* =========================================================
   V4 · FINAL PRECISION / EXPERIENCE PASS
   Senior UI polish, responsive balance and interaction quality
   ========================================================= */

:root{
  --ease-out:cubic-bezier(.2,.75,.25,1);
  --ease-soft:cubic-bezier(.22,.61,.36,1);
  --hairline:rgba(17,23,29,.085);
}

/* Header behaves like a premium product site: present, but never bulky */
.site-header{transition:background .24s ease,box-shadow .24s ease,border-color .24s ease}
.header-inner,.brand,.brand img,.main-nav>a,.shop-link{transition:all .24s var(--ease-out)}
@media(min-width:961px){
  .site-header.is-compact{background:rgba(255,255,255,.99);box-shadow:0 12px 34px rgba(7,14,21,.055)}
  .site-header.is-compact .header-inner{height:68px}
  .site-header.is-compact .brand{height:58px}
  .site-header.is-compact .brand img{width:120px;max-height:58px}
  .site-header.is-compact .main-nav>a{padding-top:24px;padding-bottom:21px}
  .site-header.is-compact .main-nav>a:after{bottom:13px}
  .site-header.is-compact .shop-link{padding:10px 18px}
}

/* Hero refinement: technical confidence rather than decorative spectacle */
.hero{isolation:isolate}
.hero-copy{position:relative}

.hero-copy:before{content:"";position:absolute;left:0;bottom:43px;width:74px;height:1px;background:linear-gradient(90deg,var(--red),transparent)}
.hero h1 span{position:relative;display:block}
.hero h1 span:after{content:"";position:absolute;left:0;bottom:-8px;width:118px;height:3px;background:var(--red);transform-origin:left center;animation:heroLine .8s var(--ease-out) .28s both}
@keyframes heroLine{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}
.hero-proof>div{transition:transform .22s var(--ease-out),opacity .22s ease}
.hero-proof>div:hover{transform:translateY(-2px)}

/* Buttons: consistent tactile feedback */
.btn,.shop-link,.product-card button,.drawer-product,.symptom-card{transform:translateZ(0)}
.btn:active,.shop-link:active,.product-card button:active,.symptom-card:active{transform:translateY(1px)}

/* Diagnostic is the differentiator: transitions must feel deliberate */
.diagnostic-result{overflow:hidden;transition:opacity .18s ease,transform .22s var(--ease-out),box-shadow .22s ease}
.diagnostic-result.is-updating{opacity:.35;transform:translateY(5px)}
.diagnostic-result:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent,var(--red));z-index:5}
.result-product,.result-workshop{position:relative}
.result-copy h3{letter-spacing:-.02em}
.result-divider{background:linear-gradient(90deg,#dfe3e6,transparent)}
.symptom-card{position:relative;overflow:hidden}
.symptom-card:before{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--red);transition:right .24s var(--ease-out)}
.symptom-card.active:before,.symptom-card:hover:before{right:0}
.symptom-card.active svg{transform:scale(1.06)}
.symptom-card svg{transition:transform .2s var(--ease-out)}
.application-fallback{position:relative;padding-left:38px}
.application-fallback:before{content:"i";position:absolute;left:13px;top:13px;width:17px;height:17px;border-radius:50%;display:grid;place-items:center;background:#151a20;color:#fff;font:700 10px/1 Arial,sans-serif}

/* Method: stronger visual continuity between the three steps */
.method-inner{position:relative}
@media(min-width:961px){
  .method-inner:after{content:"";position:absolute;left:22%;right:5%;top:50%;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.09),rgba(255,255,255,.02));z-index:0}
  .method-title,.method-step,.method-arrow{position:relative;z-index:1}
  .method-step{background:linear-gradient(90deg,rgba(8,12,16,.98),rgba(8,12,16,.86));padding-right:10px}
}

/* Product family: controlled depth, precise scale, no catalogue-template feeling */
.flagship-card,.product-card{transition:transform .28s var(--ease-out),box-shadow .28s var(--ease-out),border-color .28s ease}
.flagship-card:hover{transform:translateY(-4px);box-shadow:0 36px 90px rgba(35,28,10,.21);border-color:rgba(217,181,73,.5)}
.flagship-visual img{transition:transform .35s var(--ease-out),filter .35s ease}
.flagship-card:hover .flagship-visual img{transform:translateY(-7px) scale(1.012);filter:drop-shadow(0 30px 24px rgba(0,0,0,.38))}
.gold-orbit{transition:transform .5s var(--ease-soft),opacity .3s ease}
.flagship-card:hover .gold-orbit{transform:translateX(-50%) scale(1.045);opacity:.9}
.product-family-grid{counter-reset:drproduct 1}
.product-family-grid .product-card{counter-increment:drproduct}
.product-family-grid .product-card:focus-within{border-color:var(--accent);box-shadow:0 22px 55px rgba(7,15,23,.11)}
.product-family-grid .product-bottle img{transition:transform .27s var(--ease-out),filter .27s ease}
.product-family-grid .product-card:hover .product-bottle img{transform:translateY(-5px) scale(1.012);filter:drop-shadow(0 21px 17px rgba(0,0,0,.15))}
.product-family-grid .product-card button:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,var(--accent),transparent);opacity:.35;transition:opacity .2s ease}
.product-family-grid .product-card button:hover:after{opacity:.75}

/* Evidence: editorial, restrained */
.evidence-grid article svg{transition:transform .22s var(--ease-out)}
.evidence-grid article:hover svg{transform:translateY(-2px) scale(1.035)}

/* Sectors: index and photography create B2B scale */
.sector-grid{counter-reset:sector}
.sector-card{counter-increment:sector}
.sector-content:after{content:"0" counter(sector);position:absolute;right:18px;top:17px;font-family:'Barlow Condensed',Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:.12em;color:rgba(255,255,255,.52)}
.sector-content{position:relative}


/* Professional network and contact: utility must look intentional */
.search-field,.lead-form input,.lead-form select,.lead-form textarea{transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.search-field:focus-within{border-color:#68717a;box-shadow:0 0 0 4px rgba(255,255,255,.055)}
.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus{border-color:#737b83;box-shadow:0 0 0 4px rgba(11,17,23,.045);outline:none;background:#fff}
.contact-status span{box-shadow:0 0 0 4px rgba(40,158,92,.1)}

/* Modal / drawer: production-grade visual treatment */
.modal,.shop-drawer{transition:visibility .2s ease}
.modal-backdrop,.drawer-backdrop{backdrop-filter:blur(8px);transition:opacity .22s ease}
.modal-card{transform:translateY(14px) scale(.99);opacity:0;transition:transform .26s var(--ease-out),opacity .22s ease}
.modal.open .modal-card{transform:none;opacity:1}
.drawer-panel{transform:translateX(18px);opacity:.5;transition:transform .28s var(--ease-out),opacity .22s ease}
.shop-drawer.open .drawer-panel{transform:none;opacity:1}
.modal-close,.drawer-head button{transition:transform .18s ease,background .18s ease,color .18s ease}
.modal-close:hover,.drawer-head button:hover{transform:rotate(4deg);background:#f0f1f1;color:#111}

/* Scroll-to-top: quieter and more premium */
.to-top{border:1px solid rgba(255,255,255,.18);background:rgba(10,14,18,.88);backdrop-filter:blur(10px);box-shadow:0 12px 28px rgba(0,0,0,.14)}
.to-top:hover{background:var(--red);transform:translateY(-2px)}

/* Responsive precision */
@media(max-width:1180px){
  .product-family-grid{grid-template-columns:repeat(2,1fr)}
  .flagship-card{grid-template-columns:minmax(350px,.95fr) minmax(330px,1.05fr)}
  .flagship-copy{padding-left:44px}
  .sector-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:960px){
  .hero-copy:after,.hero-copy:before{display:none}
  .site-header.is-compact .header-inner{height:72px}
  .product-family-grid{grid-template-columns:repeat(2,1fr)}
  .flagship-card{grid-template-columns:1fr 340px;min-height:440px}
  .flagship-copy{padding:42px 12px 40px 38px}
  .flagship-visual{min-height:440px}
  .flagship-visual img{height:404px}
}

@media(max-width:720px){
  .section{padding:70px 0}
  .section-heading{margin-bottom:30px}.section-heading.centered{margin-bottom:32px}
  .section-heading h2{font-size:clamp(38px,11vw,48px)}
  .hero{min-height:690px}.hero-layout{min-height:690px}
  .hero h1{font-size:clamp(47px,13vw,59px);line-height:.9}
  .hero h1 span:after{width:86px;height:2px;bottom:-6px}
  .hero-proof{margin-top:30px}
  .diagnostic-layout{gap:22px}
  .diagnostic-journey{margin-bottom:20px}
  .diagnostic-result{scroll-margin-top:84px}
  .result-product-image img{max-width:72vw}
  .flagship-card{grid-template-columns:1fr;min-height:auto}
  .flagship-copy{padding:34px 28px 20px}
  .flagship-meta{margin-bottom:22px}
  .flagship-copy h3{font-size:60px}
  .flagship-visual{min-height:390px;padding-top:6px}
  .flagship-visual img{height:365px}
  .gold-orbit{width:260px;height:260px;top:55px}
  .product-family-grid{grid-template-columns:1fr}
  .product-family-grid .product-card{min-height:460px}
  .product-family-grid .product-bottle{height:258px}
  .product-family-grid .product-bottle img{height:248px}
  .sector-grid{grid-template-columns:1fr}
  .sector-card{min-height:285px}
  .sector-card h3{font-size:31px}
  .modal-card{width:min(94vw,760px);max-height:90vh;overflow:auto}
}

@media(max-width:430px){
  .shell{width:calc(100% - 24px)}
  .hero-copy{padding-left:2px;padding-right:2px}
  .hero h1{font-size:44px}
  .hero-method{font-size:24px}
  .hero-lead{font-size:13px;line-height:1.62}
  .btn-hero{width:100%;justify-content:space-between}
  .symptom-grid{grid-template-columns:1fr 1fr;gap:8px}
  .symptom-card{padding:12px 8px;min-height:100px}
  .symptom-card b{font-size:10px}
  .diagnostic-note{font-size:9px}
  .result-copy{padding:22px}
  .result-copy h3{font-size:31px}
  .result-product-image{min-height:330px}
  .result-product-image img{height:315px}
  .apply{padding:22px}
  .flagship-copy{padding-left:22px;padding-right:22px}
  .flagship-copy h3{font-size:54px}
  .flagship-visual{min-height:350px}
  .flagship-visual img{height:330px}
  .finder,.lead-form{border-radius:15px}
}

@media(prefers-reduced-motion:reduce){
  .hero h1 span:after{animation:none;transform:none;opacity:1}
  .flagship-card,.flagship-visual img,.gold-orbit,.product-card,.product-bottle img,.sector-media,.diagnostic-result,.header-inner,.brand img{transition:none!important}
}


/* =========================================================
   V5 — Production hardening / public-facing polish
   ========================================================= */
.noscript-notice{
  padding:12px 20px;
  background:#fff3cd;
  color:#493b00;
  border-bottom:1px solid #ead889;
  font-size:12px;
  line-height:1.45;
  text-align:center;
}
.main-nav>a[aria-current="page"]{color:#080a0d}
.main-nav>a[aria-current="page"]:after{right:0}
img{user-select:none;-webkit-user-drag:none}
.modal[inert],.shop-drawer[inert]{pointer-events:none}
.result-product-image img,
.flagship-visual img,
.product-bottle img,
.modal-product-image img,
.drawer-product img{aspect-ratio:463/1200}
.evidence-grid article{border-top:2px solid rgba(211,13,20,.45)}
.evidence-grid article:nth-child(2){border-top-color:rgba(255,255,255,.24)}
.evidence-grid article:nth-child(3){border-top-color:rgba(211,13,20,.72)}
.final-cta-inner h2{max-width:760px;text-wrap:balance}
.footer-bottom span:last-child{color:#8e969f}
@media(max-width:960px){
  .main-nav.open{animation:nav-enter .18s ease-out both}
  @keyframes nav-enter{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
}
@media(max-width:720px){
  .noscript-notice{font-size:11px;padding:10px 14px}
  .result-product-image img,
  .flagship-visual img,
  .product-bottle img{max-width:100%}
}
@media(prefers-reduced-motion:reduce){
  .main-nav.open{animation:none!important}
}


/* =========================================================
   V6 — Conversion flow / decision architecture
   ========================================================= */
.result-empty{
  min-height:470px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:48px;
  background:
    radial-gradient(circle at 50% 38%,rgba(211,13,20,.055),transparent 28%),
    linear-gradient(180deg,#fff,#f2f4f4);
}
.result-empty>svg{
  width:58px;height:58px;
  color:#151a1f;
  margin-bottom:20px;
  stroke-width:1.25;
}
.result-empty h3{
  margin:8px 0 10px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:42px;
  line-height:.95;
  text-transform:uppercase;
}
.result-empty p{
  max-width:520px;
  margin:0;
  color:#687078;
  line-height:1.65;
  font-size:13px;
}
.result-empty-flow{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:28px;
  color:#777f87;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.result-empty-flow i{font-style:normal;color:var(--red)}
.symptom-card[aria-pressed="true"]{
  border-color:var(--red);
  box-shadow:0 0 0 1px var(--red),0 14px 34px rgba(211,13,20,.08);
}
.result-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
  margin-top:20px;
}
.text-action{
  appearance:none;
  border:0;
  background:transparent;
  color:#363d43;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.055em;
  text-decoration:none;
  padding:7px 0;
  cursor:pointer;
  position:relative;
}
.text-action:after{
  content:"";
  position:absolute;
  left:0;right:100%;bottom:2px;
  height:1px;background:var(--red);
  transition:right .18s ease;
}
.text-action:hover:after,.text-action:focus-visible:after{right:0}
.result-workshop .text-action{display:block;margin:14px auto 0;color:#5f666d}
.choice-assist{
  margin-top:18px;
  border:1px solid #d9dde0;
  background:linear-gradient(100deg,#fff,#f5f6f6);
  border-radius:14px;
  padding:19px 22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
}
.choice-assist div{display:grid;gap:3px}
.choice-assist span{
  color:var(--red);
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.choice-assist b{font-size:13px;color:#252b30}
.choice-assist>a{
  color:#11171c;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
  white-space:nowrap;
}
.choice-assist>a span{color:var(--red);font-size:14px;margin-left:5px}
.modal-actions{
  margin-top:24px;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:18px;
}
.modal-actions .text-action{color:#4d555c}
.diagnostic-result{scroll-margin-top:96px}
@media(max-width:720px){
  .result-empty{min-height:390px;padding:36px 22px}
  .result-empty h3{font-size:36px}
  .result-empty-flow{gap:7px;font-size:8px;flex-wrap:wrap;justify-content:center}
  .choice-assist{align-items:flex-start;flex-direction:column;gap:14px}
  .choice-assist>a{width:100%;display:flex;justify-content:space-between;padding-top:10px;border-top:1px solid #e1e4e6}
  .result-actions{align-items:flex-start;flex-direction:column;gap:9px}
}
@media(prefers-reduced-motion:reduce){
  .text-action:after{transition:none}
}


/* =========================================================
   V7 — Visual closure / responsive precision / performance
   ========================================================= */

/* Keep the main landing rhythm stable across wide desktop sizes. */
.section{
  padding-block:clamp(76px,5.35vw,96px);
}
.section-heading{
  margin-bottom:clamp(28px,2.4vw,38px);
}
.section-heading h2{
  text-wrap:balance;
}
.section-heading p{
  text-wrap:pretty;
}

/* On real laptop screens the hero should feel dominant without extending
   unnecessarily beyond the first viewport. */
@media(min-width:961px){
  .hero,
  .hero-layout{
    min-height:clamp(620px,calc(100svh - var(--header)),700px);
  }
  .hero-copy{
    padding-block:clamp(50px,6vh,72px);
  }
}

/* Remove internal editorial microcopy that is not part of the customer brand. */
.hero-copy:after,
.hero-copy:before{
  display:none!important;
}
.sector-card.tech-card .sector-content:before{
  display:none!important;
}

/* Real image layer for sectors: lazy-loadable and cleanly cropped. */
.sector-media{
  position:absolute;
  inset:0;
  overflow:hidden;
  z-index:-2;
  transition:transform .45s var(--ease-out),filter .35s ease;
}
.sector-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.sector-card.has-image:before{
  z-index:-1;
}
.sector-card.has-image:hover .sector-media{
  transform:scale(1.045);
  filter:saturate(1.05) contrast(1.03);
}

/* Better perceived loading below the fold on supporting browsers. */
.treatments,
.evidence,
.sectors,
.workshops,
.distributors,
.contact{
  content-visibility:auto;
  contain-intrinsic-size:1px 900px;
}

/* Prevent long sector/product copy from visually destabilising cards. */
.product-copy h3,
.sector-card h3{
  text-wrap:balance;
}
.product-copy p,
.sector-card p{
  text-wrap:pretty;
}

/* Stronger but quieter separation between major chapters. */
.diagnostic,
.treatments,
.sectors,
.workshops,
.contact{
  border-top:1px solid rgba(12,17,22,.045);
}
.method{
  box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 -1px rgba(255,255,255,.025);
}

/* Browser identity button state. */


/* Mobile: preserve hierarchy rather than simply shrinking desktop. */
@media(max-width:720px){
  .section{
    padding-block:68px;
  }
  .hero,
  .hero-layout{
    min-height:max(680px,calc(100svh - var(--header)));
  }
  .hero-copy{
    padding-top:78px;
  }
  .section-heading h2{
    font-size:clamp(38px,11vw,48px);
  }
  .section-heading p{
    font-size:13px;
    line-height:1.65;
  }
  .diagnostic-journey{
    overflow-x:auto;
    scrollbar-width:none;
    justify-content:flex-start;
  }
  .diagnostic-journey::-webkit-scrollbar{display:none}
  .sector-media img{
    object-position:center 45%;
  }
}

@media(max-width:430px){
  .section{padding-block:60px}
  .hero,.hero-layout{min-height:690px}
  .hero-copy{padding-top:72px}
  .hero-proof{margin-top:26px}
  .final-cta{padding-block:30px}
}

/* Performance and accessibility preferences. */
@media(prefers-reduced-motion:reduce){
  .sector-media{transition:none!important}
}


/* =========================================================
   V8 — REAL SCREENSHOT CORRECTION PASS
   Scale hierarchy + 1024–1280 behaviour + modal centering
   ========================================================= */

/* 1) Header / brand presence */
:root{--header:82px}

.header-inner{
  min-height:var(--header);
  height:var(--header);
  gap:30px;
}
.brand{
  width:184px;
  height:72px;
  flex:0 0 184px;
}
.brand img{
  width:178px;
  max-height:72px;
  height:auto;
  transform:none;
}
.main-nav{
  gap:24px;
  font-size:12.5px;
}
.main-nav>a{
  padding-top:31px;
  padding-bottom:28px;
}
.shop-link{
  padding:13px 20px;
  min-height:44px;
}

/* Compact scroll state must remain readable, not shrink the identity excessively. */
@media(min-width:1181px){
  .site-header.is-compact .header-inner{height:72px;min-height:72px}
  .site-header.is-compact .brand{width:164px;height:64px;flex-basis:164px}
  .site-header.is-compact .brand img{width:158px;max-height:64px}
  .site-header.is-compact .main-nav{font-size:12px}
}

/* 2) Hero: remove all decorative circular artefacts and preserve the medical-engine visual. */
.hero:after,
.hero-glow{
  display:none!important;
  content:none!important;
}
.hero-media{
  background-position:70% center;
}
.hero-copy{
  max-width:720px;
}
.hero h1{
  font-size:clamp(60px,4.75vw,84px);
  line-height:.92;
}
.hero-method{
  font-size:32px;
}
.hero-lead{
  font-size:15px;
  max-width:590px;
}
.hero-proof{
  max-width:650px;
}

/* 3) Diagnostic: increase perceived scale on full desktop. */
.diagnostic-layout{
  grid-template-columns:minmax(470px,.86fr) minmax(690px,1.14fr);
  gap:40px;
}
.symptom-grid{gap:12px}
.symptom-card{
  min-height:132px;
  padding:18px 13px;
}
.symptom-card svg{width:35px;height:35px}
.symptom-card b{font-size:12.5px}
.symptom-card small{font-size:9.5px}
.diagnostic-result{
  min-height:560px;
}
.result-product{
  grid-template-columns:minmax(320px,1.05fr) minmax(245px,.78fr) minmax(255px,.86fr);
}
.result-copy{
  padding:42px 0 42px 40px;
}
.result-copy h3{
  font-size:39px;
}
.result-copy p{font-size:13.5px}
.result-product-image img{
  height:472px;
}
.apply{
  padding:40px 30px;
}
.result-empty{
  min-height:560px;
}
.result-empty h3{
  font-size:48px;
}

/* 4) Method: this is a brand chapter, not a micro-toolbar. */
.method-inner{
  min-height:192px;
  grid-template-columns:190px 1fr 38px 1fr 38px 1fr;
  gap:24px;
}
.method-title{
  font-size:31px;
}
.method-title span{
  font-size:18px;
  margin-bottom:5px;
}
.method-step{
  grid-template-columns:36px 62px 1fr;
  gap:14px;
}
.step-no{
  width:36px;
  height:36px;
  font-size:14px;
}
.method-step svg{
  width:58px;
  height:58px;
}
.method-step b{
  font-size:16px;
}
.method-step p{
  font-size:11.5px;
  line-height:1.48;
  max-width:240px;
}
.method-arrow{
  font-size:28px;
}

/* 5) Product flagship: less empty horizontal card, stronger physical product. */
.flagship-card{
  min-height:570px;
  grid-template-columns:minmax(430px,.95fr) minmax(430px,1.05fr);
}
.flagship-copy{
  padding:62px 28px 58px 56px;
}
.flagship-copy h3{
  font-size:clamp(68px,5.5vw,88px);
}
.flagship-copy p{
  font-size:13.5px;
  line-height:1.65;
  max-width:590px;
}
.flagship-visual{
  min-height:570px;
}
.flagship-visual img{
  height:520px;
}
.gold-orbit{
  width:350px;
  height:350px;
}

/* 6) Product modal: fix the centering regression seen in the screenshots.
      Always preserve translate(-50%,-50%) during animation. */
.modal-card{
  left:50%;
  top:50%;
  width:min(1080px,calc(100vw - 52px));
  max-height:min(820px,calc(100svh - 42px));
  transform:translate(-50%,calc(-50% + 14px)) scale(.992);
  opacity:0;
}
.modal.open .modal-card{
  transform:translate(-50%,-50%) scale(1);
  opacity:1;
}
.modal-product{
  grid-template-columns:390px minmax(0,1fr);
  min-height:640px;
}
.modal-product-image{
  padding:34px;
}
.modal-product-image img{
  height:550px;
}
.modal-product-copy{
  padding:60px 56px 50px;
}
.modal-product-copy h2{
  font-size:52px;
}
.modal-product-copy p{
  font-size:13.5px;
}
.modal-product-copy .specs{
  gap:12px;
  margin-top:26px;
}
.spec{
  padding:15px;
}
.spec b{font-size:9.5px}
.spec span{font-size:11.5px;line-height:1.45}

/* =========================================================
   1024–1180: compact desktop / landscape tablet.
   Stop shrinking a full desktop layout; reorganise it.
   ========================================================= */
@media(max-width:1180px){
  :root{--header:78px}

  .shell{
    width:min(var(--shell),calc(100% - 40px));
  }

  /* Header becomes a deliberate compact menu instead of microscopic links. */
  .header-inner{
    height:78px;
    min-height:78px;
  }
  .brand{
    width:170px;
    height:68px;
    flex-basis:170px;
  }
  .brand img{
    width:164px;
    max-height:68px;
  }
  .nav-toggle{
    display:block;
    margin-left:auto;
    width:46px;
    height:46px;
    border:1px solid #e0e3e5;
    border-radius:10px;
    background:#fff;
  }
  .main-nav{
    position:absolute;
    left:20px;
    right:20px;
    top:calc(100% + 8px);
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:12px;
    border:1px solid #dfe3e6;
    border-radius:15px;
    background:rgba(255,255,255,.99);
    box-shadow:0 24px 60px rgba(8,15,22,.16);
    font-size:13px;
  }
  .main-nav.open{display:flex}
  .main-nav>a{
    padding:13px 12px;
    border-radius:8px;
  }
  .main-nav>a:hover{
    background:#f5f6f6;
  }
  .main-nav>a:after{display:none}
  .shop-link{
    margin-top:6px;
    padding:13px 14px;
    width:100%;
  }

  /* Hero keeps desktop imagery, but copy is controlled and readable. */
  .hero,
  .hero-layout{
    min-height:620px;
  }
  .hero-layout{
    grid-template-columns:minmax(500px,640px) 1fr;
  }
  .hero-copy{
    padding-block:52px;
  }
  .hero h1{
    font-size:clamp(58px,6.4vw,72px);
    max-width:650px;
  }
  .hero-method{font-size:29px}
  .hero-lead{font-size:14px;max-width:540px}
  .hero-proof{max-width:580px}

  /* Diagnosis becomes a vertical decision flow instead of two tiny columns. */
  .diagnostic-layout{
    grid-template-columns:1fr;
    gap:28px;
  }
  .symptom-panel{
    max-width:none;
  }
  .symptom-grid{
    grid-template-columns:repeat(3,1fr);
    gap:12px;
  }
  .symptom-card{
    min-height:126px;
  }
  .diagnostic-result{
    min-height:520px;
  }
  .result-product{
    grid-template-columns:minmax(310px,1.02fr) 245px minmax(250px,.9fr);
  }
  .result-product-image img{
    height:445px;
  }
  .result-empty{
    min-height:500px;
  }

  /* Method is now a readable 3-card chapter. */
  .method-inner{
    min-height:auto;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    padding:32px 0 36px;
  }
  .method-inner:after{display:none!important}
  .method-title{
    grid-column:1/-1;
    display:flex;
    align-items:baseline;
    gap:9px;
    margin-bottom:4px;
    font-size:30px;
  }
  .method-title span{
    font-size:16px;
    margin:0;
  }
  .method-step{
    grid-template-columns:38px 56px 1fr;
    gap:12px;
    min-height:112px;
    padding:18px 16px!important;
    border:1px solid #242a31;
    background:#0c1014!important;
    border-radius:13px;
  }
  .method-step svg{width:52px;height:52px}
  .method-step b{font-size:15px}
  .method-step p{font-size:11px}
  .method-arrow{display:none}

  /* Flagship remains horizontal but has stronger scale. */
  .flagship-card{
    grid-template-columns:minmax(360px,1fr) 390px;
    min-height:520px;
  }
  .flagship-copy{
    padding:48px 20px 44px 42px;
  }
  .flagship-copy h3{
    font-size:68px;
  }
  .flagship-visual{
    min-height:520px;
  }
  .flagship-visual img{
    height:472px;
  }
  .gold-orbit{
    width:315px;
    height:315px;
  }

  /* Modal remains centred and readable in the same window range. */
  .modal-card{
    width:min(980px,calc(100vw - 34px));
  }
  .modal-product{
    grid-template-columns:350px minmax(0,1fr);
    min-height:590px;
  }
  .modal-product-image img{
    height:500px;
  }
  .modal-product-copy{
    padding:48px 38px 42px;
  }
  .modal-product-copy h2{
    font-size:46px;
  }
}

/* =========================================================
   <= 960: tablet / mobile composition.
   Existing mobile behaviour is preserved but scaled up.
   ========================================================= */
@media(max-width:960px){
  :root{--header:72px}

  .header-inner{
    height:72px;
    min-height:72px;
  }
  .brand{
    width:154px;
    height:62px;
    flex-basis:154px;
  }
  .brand img{
    width:150px;
    max-height:62px;
  }

  .hero,
  .hero-layout{
    min-height:650px;
  }
  .hero-layout{
    grid-template-columns:1fr;
  }

  .diagnostic-journey{
    grid-template-columns:repeat(3,1fr);
    gap:8px;
  }
  .diagnostic-journey>div{
    padding:6px;
  }
  .diagnostic-journey i{display:none}

  .result-product{
    grid-template-columns:minmax(280px,1fr) 230px;
  }
  .apply{
    grid-column:1/-1;
  }

  .product-family-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .modal-card{
    width:min(92vw,860px);
  }
  .modal-product{
    grid-template-columns:320px 1fr;
    min-height:560px;
  }
  .modal-product-image img{
    height:465px;
  }
  .modal-product-copy{
    padding:42px 32px 38px;
  }
}

/* =========================================================
   <= 820: true stacked tablet/mobile.
   ========================================================= */
@media(max-width:820px){
  .hero-media{
    background-image:url('assets/hero/hero-motor-mobile.webp');
    background-position:center;
  }
  .hero-shade{
    background:linear-gradient(180deg,rgba(5,7,10,.40) 0%,rgba(5,7,10,.72) 40%,rgba(5,7,10,.985) 78%,#05070a 100%);
  }
  .hero-layout{
    align-items:flex-end;
  }
  .hero-copy{
    padding:86px 0 40px;
  }

  .diagnostic-journey{
    grid-template-columns:1fr;
  }
  .diagnostic-journey>div{
    grid-template-columns:42px 1fr;
  }

  .result-product{
    grid-template-columns:1fr;
  }
  .result-copy{
    padding:30px;
  }
  .result-product-image{
    min-height:420px;
  }
  .result-product-image img{
    height:400px;
  }
  .apply{
    padding:30px;
  }

  .method-inner{
    grid-template-columns:1fr;
    gap:10px;
  }
  .method-title{
    grid-column:auto;
    margin-bottom:8px;
  }
  .method-step{
    min-height:104px;
  }

  .flagship-card{
    grid-template-columns:1fr;
    min-height:auto;
  }
  .flagship-copy{
    padding:42px 30px 22px;
  }
  .flagship-visual{
    min-height:430px;
  }
  .flagship-visual img{
    height:400px;
  }

  .modal-card{
    width:min(94vw,720px);
    max-height:92svh;
  }
  .modal-product{
    grid-template-columns:1fr;
    min-height:0;
  }
  .modal-product-image{
    min-height:390px;
  }
  .modal-product-image img{
    height:365px;
  }
  .modal-product-copy{
    padding:32px 28px 34px;
  }
  .modal-product-copy h2{
    font-size:43px;
  }
}

/* =========================================================
   Small mobile
   ========================================================= */
@media(max-width:520px){
  .shell{width:calc(100% - 24px)}

  .brand{
    width:142px;
    height:58px;
    flex-basis:142px;
  }
  .brand img{
    width:138px;
    max-height:58px;
  }

  .hero,
  .hero-layout{
    min-height:700px;
  }
  .hero-copy{
    padding-top:76px;
  }
  .hero h1{
    font-size:clamp(44px,12.5vw,54px);
  }
  .hero-method{
    font-size:25px;
  }

  .symptom-grid{
    grid-template-columns:1fr 1fr;
    gap:9px;
  }
  .symptom-card{
    min-height:108px;
    padding:13px 8px;
  }

  .result-empty{
    min-height:390px;
    padding:34px 20px;
  }

  .method-step{
    grid-template-columns:36px 50px 1fr;
    padding:16px 14px!important;
  }

  .modal-card{
    width:calc(100vw - 20px);
    max-height:calc(100svh - 20px);
    border-radius:15px;
  }
  .modal-product-image{
    min-height:330px;
  }
  .modal-product-image img{
    height:305px;
  }
  .modal-product-copy{
    padding:26px 22px 30px;
  }
  .modal-product-copy h2{
    font-size:38px;
  }
  .modal-product-copy .specs{
    grid-template-columns:1fr;
  }
}

/* Keep accessibility preferences intact. */
@media(prefers-reduced-motion:reduce){
  .modal-card{transition:none!important}
}


/* =========================================================
   V9 — VISUAL CLOSURE
   Assets clean + density balance + lower-page hierarchy
   ========================================================= */

/* Diagnostic: the empty state should guide, not occupy half a screen. */
.diagnostic{
  padding-top:clamp(68px,4.6vw,84px);
  padding-bottom:clamp(64px,4.2vw,78px);
}
.diagnostic .section-heading{
  margin-bottom:26px;
}
.diagnostic-journey{
  margin-bottom:20px;
}
.diagnostic-result{
  min-height:470px;
}
.result-empty{
  min-height:470px;
  padding:38px;
}
.result-empty>svg{
  width:52px;
  height:52px;
}
.result-empty h3{
  font-size:44px;
}
.result-empty p{
  max-width:470px;
}
.result-empty-flow{
  margin-top:22px;
}
.symptom-card{
  min-height:118px;
}

/* Once a product is selected, keep a strong dossier presence. */
.result-product{
  min-height:470px;
}
.result-product-image img{
  height:430px;
}
.result-copy{
  padding-top:36px;
  padding-bottom:36px;
}
.apply{
  padding-top:36px;
  padding-bottom:36px;
}

/* Method: a real brand chapter with controlled vertical scale. */
.method{
  padding:0;
}
.method-inner{
  min-height:178px;
}
.method-title strong{
  font-size:34px;
}
.method-step{
  min-height:96px;
}
.method-step b{
  font-size:16px;
}
.method-step p{
  font-size:11.5px;
}

/* Product chapter: reduce dead white air before flagship. */
.treatments{
  padding-top:clamp(72px,4.8vw,88px);
}
.treatments .section-heading.centered{
  margin-bottom:30px;
}

/* Sectors: clean photography, no embedded mockup labels. */
.sectors{
  padding-top:82px;
  padding-bottom:88px;
}
.sectors .section-heading.centered{
  margin-bottom:30px;
}
.sector-grid{
  gap:16px;
}
.sector-card{
  min-height:250px;
  border-radius:15px;
  border-color:rgba(18,24,30,.15);
  box-shadow:0 14px 32px rgba(10,18,26,.08);
}
.sector-card:nth-child(1),
.sector-card:nth-child(2),
.sector-card:nth-child(6),
.sector-card:nth-child(7){
  min-height:270px;
}
.sector-card.has-image:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(4,7,10,.05) 20%,rgba(4,7,10,.90) 100%),
    linear-gradient(90deg,rgba(4,7,10,.30),transparent 65%);
  z-index:-1;
}
.sector-media img{
  filter:saturate(.93) contrast(1.04);
}
.sector-content{
  margin-top:auto;
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.sector-icon{
  position:absolute;
  left:22px;
  top:20px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(8,12,16,.76);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(8px);
}
.sector-icon svg{
  width:23px!important;
  height:23px!important;
  margin:0!important;
}
.sector-card h3{
  margin:0 0 7px;
  font-size:29px;
}
.sector-card p{
  max-width:420px;
  color:#d1d5d9;
  font-size:10.5px;
  line-height:1.5;
}
.sector-content:after{
  top:18px;
  right:18px;
}

/* The no-photo generator card should look intentionally technical. */
.sector-card.tech-card{
  background:
    linear-gradient(135deg,rgba(211,13,20,.13),transparent 34%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 1px,transparent 1px 9px),
    #0d1115;
}
.sector-card.tech-card:before{
  content:"ENERGÍA DE RESPALDO";
  position:absolute;
  left:22px;
  top:76px;
  color:rgba(255,255,255,.22);
  font-family:'Barlow Condensed',sans-serif;
  font-size:30px;
  font-weight:700;
  letter-spacing:.08em;
}

/* Professional network: increase service authority. */
.workshops{
  padding-top:90px;
  padding-bottom:92px;
}
.workshop-layout{
  grid-template-columns:.9fr 1.1fr;
  gap:76px;
}
.workshop-copy h2{
  font-size:clamp(52px,4.3vw,68px);
}
.workshop-copy>p{
  max-width:570px;
  font-size:14.5px;
}
.network-benefits{
  margin-top:32px;
}
.network-benefits>div{
  padding:11px 0;
}
.network-benefits b{
  font-size:13px;
}
.network-benefits small{
  font-size:10.5px;
}
.finder{
  padding:34px;
  border-radius:18px;
}
.finder-head b{
  font-size:25px;
}
.finder-head span{
  font-size:9.5px;
}
.search-field{
  margin-top:22px;
}
.network-empty{
  min-height:124px;
}

/* Distributor: stop feeling like a small block at the bottom of the site. */
.distributors{
  padding:94px 0;
}
.distributor-layout{
  grid-template-columns:.8fr 1.2fr;
  gap:72px;
}
.distributor-copy h2{
  font-size:clamp(52px,4.2vw,68px);
}
.distributor-copy>p{
  max-width:540px;
  font-size:14px;
}
.distributor-points{
  gap:14px;
}
.distributor-points>div{
  min-height:250px;
  padding:30px 28px;
}
.distributor-points span{
  font-size:46px;
}
.distributor-points b{
  font-size:13px;
}
.distributor-points p{
  font-size:11px;
}

/* Contact: more compact and more intentional. */
.contact{
  padding-top:82px;
  padding-bottom:82px;
}
.contact-layout{
  grid-template-columns:.82fr 1.18fr;
  gap:64px;
  align-items:center;
}
.contact-copy h2{
  font-size:clamp(54px,4.2vw,70px);
}
.contact-copy>p{
  max-width:520px;
  font-size:14px;
}
.lead-form{
  padding:32px;
  border-radius:16px;
}
.lead-form label{
  font-size:10.5px;
}
.lead-form input,
.lead-form select,
.lead-form textarea{
  font-size:12.5px;
}
.lead-form textarea{
  min-height:110px;
}

/* Stronger corporate close. */
.final-cta{
  padding:42px 0;
}
.final-cta h2{
  font-size:42px;
  max-width:820px;
}
.site-footer{
  padding:50px 0 22px;
}
.footer-brand img{
  width:178px;
}
.footer-brand p{
  font-size:11px;
}
.footer-grid b{
  font-size:10.5px;
}
.footer-grid a,
.footer-grid button{
  font-size:10.5px;
}

/* Avoid content-visibility placeholder behaviour for the key commercial finish.
   These sections are not heavy enough to justify an artificial intrinsic block. */
.workshops,
.distributors,
.contact{
  content-visibility:visible!important;
  contain-intrinsic-size:auto!important;
}

/* 1024–1180: preserve the improvements in a compact landscape layout. */
@media(max-width:1180px){
  .diagnostic-result,
  .result-empty{
    min-height:440px;
  }
  .method-inner{
    min-height:auto;
  }
  .sector-card,
  .sector-card:nth-child(1),
  .sector-card:nth-child(2),
  .sector-card:nth-child(6),
  .sector-card:nth-child(7){
    min-height:250px;
  }
  .workshop-layout,
  .distributor-layout{
    grid-template-columns:1fr;
    gap:38px;
  }
  .workshop-copy>p,
  .distributor-copy>p{
    max-width:700px;
  }
  .contact-layout{
    grid-template-columns:1fr 1.15fr;
    gap:40px;
  }
}

/* Tablet/mobile */
@media(max-width:820px){
  .diagnostic{
    padding-top:64px;
    padding-bottom:64px;
  }
  .result-empty{
    min-height:360px;
  }
  .sector-card,
  .sector-card:nth-child(1),
  .sector-card:nth-child(2),
  .sector-card:nth-child(6),
  .sector-card:nth-child(7){
    min-height:260px;
  }
  .workshops,
  .distributors,
  .contact{
    padding-top:70px;
    padding-bottom:70px;
  }
  .contact-layout{
    grid-template-columns:1fr;
    gap:30px;
  }
  .finder,
  .lead-form{
    padding:24px;
  }
}

@media(max-width:520px){
  .diagnostic-result,
  .result-empty{
    min-height:340px;
  }
  .result-empty h3{
    font-size:36px;
  }
  .sector-card{
    min-height:245px!important;
  }
  .workshop-copy h2,
  .distributor-copy h2,
  .contact-copy h2{
    font-size:46px;
  }
  .final-cta h2{
    font-size:34px;
  }
}


/* =========================================================
   V10 — HERO + MÉTODO CORREGIDOS
   ========================================================= */

/* El nuevo asset reserva el lado izquierdo al copy y concentra
   el estetoscopio en la zona visual derecha. */
.hero-media{
  background-image:url('assets/hero/hero-motor-desktop-v10.webp')!important;
  background-size:cover!important;
  background-position:center!important;
  transform:none!important;
}
.hero-shade{
  background:
    linear-gradient(90deg,
      rgba(3,5,7,.78) 0%,
      rgba(3,5,7,.62) 23%,
      rgba(3,5,7,.24) 42%,
      rgba(3,5,7,.04) 58%,
      rgba(3,5,7,0) 75%)!important;
}
.hero-layout{
  grid-template-columns:minmax(560px,700px) 1fr!important;
}
.hero-copy{
  max-width:690px!important;
}
.hero h1{
  max-width:690px!important;
}
.hero-lead{
  max-width:565px!important;
}
.hero-proof{
  max-width:610px!important;
}

/* El Método deja de ser una franja pequeña y pasa a ser un capítulo visual
   inmediatamente después del hero. */
.method{
  position:relative;
  z-index:8;
  margin-top:-56px!important;
  padding:0 0 34px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.method-inner{
  position:relative;
  min-height:190px!important;
  display:grid!important;
  grid-template-columns:190px 1fr 32px 1fr 32px 1fr!important;
  gap:24px!important;
  align-items:center!important;
  padding:30px 34px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:22px!important;
  background:
    linear-gradient(112deg,rgba(10,14,18,.99),rgba(16,21,26,.99) 52%,rgba(7,10,14,.995))!important;
  box-shadow:
    0 26px 72px rgba(0,0,0,.28),
    inset 0 1px rgba(255,255,255,.045)!important;
  overflow:hidden;
}
.method-inner:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 50%,rgba(211,13,20,.12),transparent 22%),
    linear-gradient(90deg,transparent,rgba(255,255,255,.012),transparent);
}
.method-inner:after{
  display:none!important;
}
.method-title,
.method-step,
.method-arrow{
  position:relative;
  z-index:1;
}
.method-title{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  line-height:.92!important;
  text-align:left!important;
}
.method-title span{
  color:#ef343a!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.15em!important;
  margin:0 0 8px!important;
}
.method-title strong{
  font-family:'Barlow Condensed',Arial,sans-serif!important;
  color:#fff!important;
  font-size:40px!important;
  line-height:.9!important;
  text-transform:uppercase!important;
}
.method-step{
  min-height:118px!important;
  display:grid!important;
  grid-template-columns:40px 64px 1fr!important;
  align-items:center!important;
  gap:15px!important;
  padding:18px 8px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
}
.step-no{
  width:38px!important;
  height:38px!important;
  font-size:14px!important;
}
.method-step svg{
  width:58px!important;
  height:58px!important;
  stroke-width:1.25!important;
}
.method-step b{
  display:block!important;
  margin:0 0 5px!important;
  font-size:17px!important;
  line-height:1!important;
  letter-spacing:.035em!important;
}
.method-step p{
  margin:0!important;
  max-width:230px!important;
  color:#c4c9cf!important;
  font-size:11.5px!important;
  line-height:1.48!important;
}
.method-arrow{
  display:block!important;
  color:#737a82!important;
  font-size:29px!important;
  text-align:center!important;
}

/* Como Método ahora precede al selector, el diagnóstico comienza con aire controlado. */
.diagnostic{
  padding-top:64px!important;
}

/* Ventana intermedia / portátil. */
@media(max-width:1180px){
  .hero-media{
    background-position:56% center!important;
  }
  .hero-layout{
    grid-template-columns:minmax(500px,610px) 1fr!important;
  }
  .hero-copy{
    max-width:600px!important;
  }
  .hero h1{
    max-width:595px!important;
  }

  .method{
    margin-top:-44px!important;
    padding-bottom:28px!important;
  }
  .method-inner{
    grid-template-columns:repeat(3,1fr)!important;
    gap:12px!important;
    min-height:auto!important;
    padding:24px!important;
  }
  .method-title{
    grid-column:1/-1!important;
    flex-direction:row!important;
    align-items:baseline!important;
    gap:9px!important;
    padding:0 4px 8px!important;
  }
  .method-title span{
    margin:0!important;
  }
  .method-title strong{
    font-size:34px!important;
  }
  .method-step{
    min-height:118px!important;
    grid-template-columns:38px 54px 1fr!important;
    gap:12px!important;
    padding:18px 14px!important;
    border:1px solid rgba(255,255,255,.075)!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.018)!important;
  }
  .method-step svg{
    width:50px!important;
    height:50px!important;
  }
  .method-step b{
    font-size:15px!important;
  }
  .method-step p{
    font-size:10.5px!important;
  }
  .method-arrow{
    display:none!important;
  }
}

/* Tablet */
@media(max-width:820px){
  .hero-media{
    background-image:url('assets/hero/hero-motor-mobile.webp')!important;
    background-position:center!important;
  }
  .hero-shade{
    background:
      linear-gradient(180deg,
        rgba(4,6,8,.30) 0%,
        rgba(4,6,8,.62) 36%,
        rgba(4,6,8,.96) 73%,
        #05070a 100%)!important;
  }
  .method{
    margin-top:-28px!important;
  }
  .method-inner{
    grid-template-columns:1fr!important;
    padding:22px!important;
    border-radius:18px!important;
  }
  .method-title{
    grid-column:auto!important;
    padding:0 0 8px!important;
  }
  .method-step{
    min-height:100px!important;
  }
}

/* Móvil */
@media(max-width:520px){
  .method{
    margin-top:-20px!important;
    padding-bottom:20px!important;
  }
  .method-inner{
    padding:18px!important;
  }
  .method-title strong{
    font-size:31px!important;
  }
  .method-step{
    grid-template-columns:36px 48px 1fr!important;
    gap:11px!important;
    padding:15px 12px!important;
  }
  .method-step svg{
    width:44px!important;
    height:44px!important;
  }
  .method-step b{
    font-size:14px!important;
  }
  .method-step p{
    font-size:10px!important;
  }
}


/* =========================================================
   V11 — FIRST JOURNEY 10/10
   Hero → Método → Diagnóstico → Tratamientos
   ========================================================= */

/* ---------- MÉTODO: editorial, wider, stronger ---------- */
.method{
  margin-top:-52px!important;
  padding-bottom:42px!important;
}
.method-inner{
  min-height:204px!important;
  grid-template-columns:210px 1fr 30px 1fr 30px 1fr!important;
  padding:34px 40px!important;
  border-radius:24px!important;
  border-color:rgba(255,255,255,.10)!important;
  background:
    radial-gradient(circle at 7% 42%,rgba(211,13,20,.12),transparent 26%),
    linear-gradient(115deg,#0a0e12,#11171c 54%,#090d11)!important;
}
.method-title small{
  margin-top:10px;
  color:#858e97;
  font-size:10px;
  font-weight:700;
  letter-spacing:.045em;
}
.method-step{
  grid-template-columns:46px 66px 1fr!important;
  gap:17px!important;
}
.step-no{
  width:auto!important;
  height:auto!important;
  display:block!important;
  background:transparent!important;
  color:#e3121b!important;
  font-family:'Barlow Condensed',Arial,sans-serif!important;
  font-size:62px!important;
  line-height:.8!important;
  font-weight:800!important;
}
.method-step svg{
  width:62px!important;
  height:62px!important;
}
.method-step b{
  font-size:19px!important;
}
.method-step p{
  max-width:250px!important;
  font-size:12px!important;
  line-height:1.55!important;
}
.method-arrow{
  color:#606971!important;
  font-size:26px!important;
}

/* ---------- DIAGNÓSTICO: premium decision system ---------- */
.diagnostic{
  position:relative;
  padding-top:82px!important;
  padding-bottom:92px!important;
  background:
    radial-gradient(circle at 92% 8%,rgba(12,18,24,.045),transparent 24%),
    linear-gradient(180deg,#fbfbfa,#f4f5f5 82%,#fff);
}
.diagnostic:before{
  content:"";
  position:absolute;
  right:-150px;
  top:40px;
  width:500px;
  height:500px;
  border-radius:50%;
  border:72px solid rgba(9,16,22,.025);
  pointer-events:none;
}
.diagnostic-heading{
  max-width:900px;
  margin-bottom:28px!important;
}
.diagnostic-heading h2{
  max-width:900px;
  font-size:clamp(54px,4.4vw,72px);
  line-height:.94;
}
.diagnostic-heading p{
  max-width:760px;
  font-size:14px;
}

/* Stepper */
.diagnostic-journey{
  position:relative;
  display:grid!important;
  grid-template-columns:1fr 34px 1fr 34px 1fr!important;
  gap:10px!important;
  margin:0 0 24px!important;
  padding:10px!important;
  border:1px solid #dce0e3;
  border-radius:15px!important;
  background:rgba(255,255,255,.82);
  box-shadow:0 12px 30px rgba(13,20,27,.05);
}
.diagnostic-journey>div{
  position:relative;
  min-height:64px;
  display:grid!important;
  grid-template-columns:42px 1fr!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  column-gap:12px!important;
  padding:10px 14px!important;
  border-radius:11px;
  transition:.2s ease;
}
.diagnostic-journey>div>span{
  grid-row:1/3;
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#151a1f!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:900!important;
}
.diagnostic-journey>div b{
  align-self:end;
  font-size:11px!important;
  text-transform:uppercase;
  letter-spacing:.045em;
}
.diagnostic-journey>div small{
  align-self:start;
  color:#7b838b;
  font-size:9px!important;
}
.diagnostic-journey>div.is-active{
  background:#fff4f4;
  box-shadow:inset 0 0 0 1px rgba(211,13,20,.16);
}
.diagnostic-journey>div.is-active>span{
  background:var(--red)!important;
}
.diagnostic-journey>div.is-done{
  background:#f3f6f4;
}
.diagnostic-journey>div.is-done>span{
  background:#17211b!important;
}
.diagnostic-journey>i{
  align-self:center;
  color:#9ba2a8!important;
  font-style:normal;
  text-align:center;
}

/* Main diagnostic stage */
.diagnostic-layout{
  position:relative;
  z-index:1;
  grid-template-columns:minmax(430px,.78fr) minmax(650px,1.22fr)!important;
  gap:28px!important;
  align-items:stretch;
}
.symptom-panel{
  padding:22px;
  border:1px solid #dce0e2;
  border-radius:17px;
  background:rgba(255,255,255,.72);
  box-shadow:0 18px 45px rgba(12,20,28,.055);
}
.symptom-panel-head{
  display:grid;
  gap:3px;
  margin:0 0 16px;
}
.symptom-panel-head span{
  color:var(--red);
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.symptom-panel-head b{
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:27px;
  line-height:1;
  text-transform:uppercase;
}
.symptom-grid{
  gap:10px!important;
}
.symptom-card{
  position:relative;
  min-height:122px!important;
  padding:18px 12px!important;
  border:1px solid #d7dce0!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 7px 18px rgba(16,24,32,.025);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.symptom-card:hover{
  transform:translateY(-3px);
  border-color:#aeb5bb!important;
  box-shadow:0 14px 28px rgba(16,24,32,.07);
}
.symptom-card svg{
  width:34px!important;
  height:34px!important;
}
.symptom-card b{
  margin-top:10px!important;
  font-size:12px!important;
}
.symptom-card small{
  margin-top:5px!important;
  font-size:8.8px!important;
}
.symptom-select-mark{
  position:absolute;
  right:9px;
  top:9px;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--red);
  color:#fff;
  font-size:11px;
  font-weight:900;
  opacity:0;
  transform:scale(.65);
  transition:.18s ease;
}
.symptom-card[aria-pressed="true"]{
  transform:translateY(-2px);
  border-color:var(--red)!important;
  background:#fffafa!important;
  box-shadow:0 0 0 1px var(--red),0 16px 32px rgba(211,13,20,.10)!important;
}
.symptom-card[aria-pressed="true"] .symptom-select-mark{
  opacity:1;
  transform:scale(1);
}
.diagnostic-note{
  margin-top:14px!important;
  font-size:9.5px!important;
}

/* Result empty */
.diagnostic-result{
  min-height:520px!important;
  border-radius:17px!important;
  overflow:hidden;
  border:1px solid #dce0e2;
  box-shadow:0 20px 55px rgba(10,18,26,.07);
  background:#fff;
}
.premium-empty{
  min-height:520px!important;
  background:
    radial-gradient(circle at 50% 38%,rgba(211,13,20,.05),transparent 24%),
    linear-gradient(145deg,#fff,#f4f5f5)!important;
}
.empty-symbol{
  width:82px;
  height:82px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#11161b;
  margin-bottom:20px;
  box-shadow:0 18px 35px rgba(15,20,25,.12);
}
.empty-symbol svg{
  width:42px!important;
  height:42px!important;
  color:#fff;
}
.premium-empty h3{
  font-size:47px!important;
}
.empty-decision-flow{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:24px;
  padding:10px 14px;
  border-radius:999px;
  background:#fff;
  border:1px solid #e0e3e5;
  color:#626b73;
  font-size:8.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.empty-decision-flow i{
  color:var(--red);
  font-style:normal;
}

/* Recommendation card */
.diagnostic-recommendation-card{
  min-height:520px;
  height:100%;
  display:flex;
  flex-direction:column;
  background:
    linear-gradient(145deg,var(--accent-soft),rgba(255,255,255,.94) 38%,#fff 75%);
}
.recommendation-topline{
  min-height:54px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 28px;
  border-bottom:1px solid rgba(18,25,31,.08);
  background:rgba(255,255,255,.58);
}
.recommendation-topline span{
  color:var(--red);
  font-size:8.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.recommendation-topline b{
  font-size:10.5px;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.recommendation-main{
  flex:1;
  display:grid;
  grid-template-columns:minmax(230px,.7fr) minmax(380px,1.3fr);
}
.recommendation-visual{
  position:relative;
  display:grid;
  place-items:center;
  overflow:hidden;
  min-height:460px;
}
.recommendation-visual:after{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  bottom:27px;
  height:25px;
  border-radius:50%;
  background:rgba(0,0,0,.13);
  filter:blur(14px);
}
.recommendation-halo{
  position:absolute;
  width:270px;
  height:270px;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  box-shadow:
    0 0 0 46px color-mix(in srgb,var(--accent) 5%,transparent),
    0 0 0 92px color-mix(in srgb,var(--accent) 3%,transparent);
}
.recommendation-visual img{
  position:relative;
  z-index:2;
  height:410px;
  width:auto;
  object-fit:contain;
  filter:drop-shadow(0 18px 18px rgba(0,0,0,.16));
}
.recommendation-copy{
  align-self:center;
  padding:34px 34px 34px 12px;
}
.recommendation-copy h3{
  margin:6px 0 10px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:50px;
  line-height:.9;
  text-transform:uppercase;
}
.recommendation-copy>p{
  max-width:560px;
  margin:0;
  color:#667079;
  font-size:12.5px;
  line-height:1.62;
}
.recommendation-context{
  margin:16px 0 18px;
  padding:11px 13px;
  border-left:2px solid var(--accent);
  background:rgba(255,255,255,.62);
}
.recommendation-context>span{
  display:grid;
  grid-template-columns:20px 1fr;
  gap:8px;
  align-items:start;
}
.recommendation-context svg{
  width:17px;
  height:17px;
  color:var(--accent);
}
.recommendation-context small{
  color:#646d75;
  font-size:9.7px;
  line-height:1.45;
}
.recommendation-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.recommendation-facts>div{
  min-height:69px;
  display:grid;
  grid-template-columns:30px 1fr;
  gap:9px;
  align-items:center;
  padding:10px;
  border:1px solid #e0e3e5;
  border-radius:10px;
  background:rgba(255,255,255,.82);
}
.recommendation-facts svg{
  width:22px;
  height:22px;
  color:var(--accent);
}
.recommendation-facts b{
  display:block;
  margin-bottom:2px;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.055em;
}
.recommendation-facts small{
  display:block;
  color:#69727a;
  font-size:8.7px;
  line-height:1.35;
}
.recommendation-actions{
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:18px;
}

/* Professional recommendation */
.professional-recommendation{
  min-height:520px;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:54px;
  background:
    radial-gradient(circle at 82% 18%,rgba(211,13,20,.07),transparent 22%),
    linear-gradient(145deg,#fff,#f5f6f6);
}
.professional-icon{
  width:68px;
  height:68px;
  display:grid;
  place-items:center;
  border-radius:50%;
  margin-bottom:18px;
  background:#11171c;
  color:#fff;
}
.professional-icon svg{
  width:34px;
  height:34px;
}
.professional-recommendation h3{
  margin:7px 0 12px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:52px;
  line-height:.92;
  text-transform:uppercase;
}
.professional-recommendation>p{
  max-width:620px;
  color:#666f77;
  font-size:13px;
  line-height:1.65;
}
.professional-reason{
  max-width:620px;
  display:grid;
  grid-template-columns:34px 1fr;
  gap:13px;
  margin-top:20px;
  padding:16px;
  border:1px solid #e0e3e5;
  border-radius:12px;
  background:#fff;
}
.professional-reason svg{
  width:28px;
  height:28px;
  color:var(--red);
}
.professional-reason b{
  display:block;
  font-size:11px;
}
.professional-reason span{
  display:block;
  margin-top:3px;
  color:#707880;
  font-size:9.5px;
  line-height:1.45;
}

/* ---------- TRATAMIENTOS: dark premium chapter ---------- */
.treatments-premium{
  position:relative;
  overflow:hidden;
  padding-top:86px!important;
  padding-bottom:92px!important;
  background:
    radial-gradient(circle at 82% 10%,rgba(201,162,39,.09),transparent 28%),
    linear-gradient(180deg,#080a0d,#0c1014 70%,#080b0e)!important;
  color:#fff;
  border-top:0!important;
}
.treatments-premium:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.35;
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 1px,transparent 1px 12px);
}
.treatments-premium .shell{
  position:relative;
  z-index:1;
}
.treatments-heading{
  margin-bottom:34px!important;
}
.treatments-heading .eyebrow{
  color:#d7b550!important;
}
.treatments-heading h2{
  color:#fff!important;
  font-size:clamp(56px,4.5vw,72px);
}
.treatments-heading p{
  max-width:720px!important;
  color:#aab1b8!important;
}

/* Flagship */
.premium-flagship{
  min-height:545px!important;
  border:1px solid rgba(201,162,39,.52)!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 78% 48%,rgba(201,162,39,.14),transparent 23%),
    linear-gradient(112deg,#11110f,#17130c 58%,#0a0b0c)!important;
  box-shadow:0 26px 80px rgba(0,0,0,.25)!important;
}
.premium-flagship .flagship-copy{
  padding:52px 34px 50px 54px!important;
}
.premium-flagship .flagship-copy h3{
  font-size:86px!important;
}
.premium-flagship .flagship-copy p{
  color:#c2c5c8!important;
}
.premium-flagship .flagship-meta{
  border-bottom-color:rgba(255,255,255,.10)!important;
}
.premium-flagship .flagship-meta span{
  color:#c9a227!important;
}
.premium-flagship .flagship-meta em{
  color:#777f85!important;
}
.premium-flagship .flagship-points{
  display:flex!important;
  flex-wrap:wrap;
  gap:8px!important;
}
.premium-flagship .flagship-points span{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:7px 10px!important;
  border:1px solid rgba(201,162,39,.34)!important;
  border-radius:999px!important;
  background:rgba(201,162,39,.055)!important;
  color:#d7c58a!important;
}
.premium-flagship .flagship-points svg{
  width:13px;
  height:13px;
}
.premium-flagship .flagship-visual{
  min-height:545px!important;
}
.premium-flagship .flagship-visual img{
  height:500px!important;
  filter:drop-shadow(0 25px 24px rgba(0,0,0,.30));
}
.gold-orbit-secondary{
  width:440px!important;
  height:200px!important;
  border-radius:50%!important;
  transform:rotate(-5deg);
  opacity:.7;
}
.premium-flagship .flagship-btn{
  margin-top:22px!important;
}

/* Family cards: 3 × 2, more readable than six tiny cards */
.product-family-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
  margin-top:14px!important;
}
.premium-product-card{
  min-height:260px!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-top:2px solid var(--accent)!important;
  border-radius:14px!important;
  overflow:hidden;
  background:#f8f8f7!important;
  color:#11161b!important;
  box-shadow:0 12px 35px rgba(0,0,0,.15)!important;
}
.premium-product-card .product-card-head{
  min-height:38px!important;
  padding:0 14px!important;
  border-bottom:1px solid #e5e7e8!important;
}
.premium-product-body{
  display:grid;
  grid-template-columns:126px 1fr;
  gap:10px;
  min-height:220px;
  padding:14px;
}
.premium-product-card .product-bottle{
  position:relative;
  min-height:195px!important;
  display:grid;
  place-items:center;
  overflow:visible!important;
}
.product-bottle-halo{
  position:absolute;
  width:98px;
  height:98px;
  border-radius:50%;
  background:var(--accent-soft);
  filter:blur(2px);
}
.premium-product-card .product-bottle img{
  position:relative;
  z-index:2;
  height:190px!important;
  width:auto!important;
  filter:drop-shadow(0 12px 12px rgba(0,0,0,.14));
}
.premium-product-card .product-copy{
  align-self:center;
  padding:0!important;
}
.premium-product-card .product-copy h3{
  font-size:28px!important;
  line-height:.92!important;
}
.premium-product-card .product-copy p{
  min-height:auto!important;
  margin-top:8px!important;
  color:#717980!important;
  font-size:10px!important;
  line-height:1.45!important;
}
.premium-product-card .product-copy button{
  margin-top:14px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#151a1f!important;
  font-size:9px!important;
  font-weight:900!important;
  text-transform:uppercase;
  letter-spacing:.045em;
  cursor:pointer;
}
.premium-product-card .product-copy button span{
  color:var(--accent);
  margin-left:4px;
}
.premium-product-card>button{
  display:none!important;
}
.treatments-premium .choice-assist{
  border-color:rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.045)!important;
}
.treatments-premium .choice-assist b,
.treatments-premium .choice-assist>a{
  color:#fff!important;
}
.treatments-premium .choice-assist>a{
  border-color:rgba(255,255,255,.12)!important;
}

/* Evidence follows as a light contrast chapter after the dark product block */
.evidence.section-dark{
  background:#f3f5f5!important;
  color:#13191e!important;
}
.evidence .section-heading.on-dark .eyebrow{
  color:var(--red)!important;
}
.evidence .section-heading.on-dark h2{
  color:#11171c!important;
}
.evidence .section-heading.on-dark p{
  color:#667078!important;
}
.evidence-grid article{
  background:#fff!important;
  border-color:#dce0e3!important;
  color:#11171c!important;
}
.evidence-grid article p{
  color:#6c747c!important;
}

/* ---------- Responsive ---------- */
@media(max-width:1180px){
  .method-inner{
    grid-template-columns:repeat(3,1fr)!important;
  }
  .method-title small{
    display:none;
  }
  .diagnostic-layout{
    grid-template-columns:1fr!important;
  }
  .symptom-grid{
    grid-template-columns:repeat(3,1fr)!important;
  }
  .diagnostic-result{
    min-height:500px!important;
  }
  .product-family-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:820px){
  .diagnostic-journey{
    grid-template-columns:1fr!important;
  }
  .diagnostic-journey>i{
    display:none!important;
  }
  .recommendation-main{
    grid-template-columns:1fr!important;
  }
  .recommendation-visual{
    min-height:360px;
  }
  .recommendation-visual img{
    height:330px;
  }
  .recommendation-copy{
    padding:28px!important;
  }
  .premium-flagship .flagship-copy h3{
    font-size:68px!important;
  }
}
@media(max-width:620px){
  .diagnostic-heading h2{
    font-size:46px;
  }
  .symptom-panel{
    padding:14px;
  }
  .symptom-grid{
    grid-template-columns:1fr 1fr!important;
  }
  .symptom-card{
    min-height:108px!important;
  }
  .recommendation-facts{
    grid-template-columns:1fr!important;
  }
  .recommendation-actions{
    align-items:flex-start;
    flex-direction:column;
  }
  .product-family-grid{
    grid-template-columns:1fr!important;
  }
  .premium-product-body{
    grid-template-columns:110px 1fr;
  }
  .premium-product-card .product-bottle img{
    height:165px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .symptom-card,
  .symptom-select-mark{
    transition:none!important;
  }
}


/* =========================================================
   V12 — DRFUELS AS A SYSTEM, NOT AN ADDITIVE CATALOGUE
   ========================================================= */

.external-shop{
  text-decoration:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px;
}
.external-shop span{
  font-size:13px;
  transition:transform .18s ease;
}
.external-shop:hover span{transform:translate(2px,-2px)}

/* Branding: clinical precision, not racing decoration. */
.hero-proof>div{
  border-left:1px solid rgba(255,255,255,.10);
  padding-left:15px;
}
.hero-proof>div:first-child{border-left:0;padding-left:0}
.method-inner{
  border-color:rgba(255,255,255,.12)!important;
}
.method-title small{
  max-width:165px;
  line-height:1.4;
}

/* Diagnosis memory */
.diagnostic-memory{
  margin:0 0 14px;
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:10px 14px 10px 16px;
  border:1px solid #d9dde0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 8px 22px rgba(13,20,27,.035);
}
.diagnostic-memory[hidden]{display:none!important}
.diagnostic-memory>div{display:grid;gap:2px}
.diagnostic-memory span{
  color:#7b838a;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.diagnostic-memory b{font-size:11px}
.diagnostic-memory button{
  border:0;
  background:transparent;
  color:#151a1f;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.055em;
  cursor:pointer;
}
.diagnostic-memory button span{color:var(--red);font-size:13px}

/* Diagnosis utility actions */
.diagnosis-tools{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(17,24,30,.08);
}
.diagnosis-tools button{
  min-height:32px;
  padding:0 11px;
  border:1px solid #d9dde0;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  color:#4d565e;
  font-size:8.5px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.045em;
  cursor:pointer;
  transition:.18s ease;
}
.diagnosis-tools button:hover{
  border-color:#aeb5bb;
  color:#11171c;
  transform:translateY(-1px);
}
.btn-outline-shop{
  border:1px solid var(--accent)!important;
  background:transparent!important;
  color:#151a1f!important;
}
.btn-outline-shop:hover{
  background:var(--accent-soft)!important;
}

/* Protocol as a proprietary UX layer */
.protocol-teaser{
  display:grid;
  gap:3px;
  margin-top:15px;
  padding:11px 13px;
  border-radius:10px;
  border:1px solid color-mix(in srgb,var(--accent) 25%,#dfe3e5);
  background:color-mix(in srgb,var(--accent-soft) 50%,#fff);
}
.protocol-teaser span{
  color:var(--accent);
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.075em;
}
.protocol-teaser b{
  font-size:9.3px;
  line-height:1.35;
}
.protocol-block{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid #e0e3e5;
}
.protocol-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:18px;
  margin-bottom:12px;
}
.protocol-head span{
  color:var(--accent);
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.protocol-head b{
  color:#4e575f;
  font-size:10px;
}
.protocol-steps{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.protocol-steps>div{
  min-height:104px;
  padding:12px;
  border:1px solid #e0e3e5;
  border-radius:10px;
  background:#fff;
}
.protocol-steps>div>span{
  color:var(--accent);
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:24px;
  font-weight:800;
}
.protocol-steps b{
  display:block;
  margin:4px 0;
  font-size:9.5px;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.protocol-steps p{
  margin:0;
  color:#727a82;
  font-size:8.7px;
  line-height:1.45;
}
.modal-treatment-label{
  position:absolute;
  top:22px;
  left:22px;
  z-index:3;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(10,14,18,.84);
  color:#fff;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}

/* Guide: SEO + utility, no generic blog. */
.problem-guide{
  position:relative;
  background:#fff;
  padding-top:82px;
  padding-bottom:88px;
}
.guide-heading{
  max-width:920px;
  margin-bottom:30px;
}
.guide-heading h2{
  max-width:880px;
  font-size:clamp(52px,4.2vw,68px);
  line-height:.95;
}
.guide-heading p{
  max-width:750px;
}
.problem-guide-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.problem-guide-grid article{
  position:relative;
  min-height:255px;
  display:flex;
  flex-direction:column;
  padding:25px 23px 22px;
  border:1px solid #dce0e3;
  border-radius:14px;
  background:
    linear-gradient(180deg,#fff,#f7f8f8);
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.problem-guide-grid article:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--red);
  transform:scaleY(.2);
  transform-origin:top;
  transition:transform .2s ease;
}
.problem-guide-grid article:hover{
  transform:translateY(-4px);
  border-color:#c8cdd1;
  box-shadow:0 18px 42px rgba(13,20,27,.07);
}
.problem-guide-grid article:hover:before{transform:scaleY(1)}
.problem-guide-grid article>span{
  color:var(--red);
  font-size:8.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.problem-guide-grid h3{
  margin:18px 0 10px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:30px;
  line-height:.95;
  text-transform:uppercase;
}
.problem-guide-grid p{
  margin:0;
  color:#69727a;
  font-size:10.5px;
  line-height:1.55;
}
.problem-guide-grid button{
  margin-top:auto;
  padding:18px 0 0;
  border:0;
  background:transparent;
  color:#151a1f;
  text-align:left;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.055em;
  cursor:pointer;
}
.problem-guide-grid button b{
  color:var(--red);
  margin-left:5px;
}

/* Red Talleres: dual-sided value. */
.workshop-join{
  margin-top:24px;
  display:grid;
  grid-template-columns:1.1fr 1fr auto;
  align-items:center;
  gap:28px;
  padding:24px 28px;
  border:1px solid #dce0e3;
  border-radius:16px;
  background:linear-gradient(110deg,#f9fafa,#fff);
  box-shadow:0 14px 36px rgba(13,20,27,.045);
}
.workshop-join>div:first-child>span{
  color:var(--red);
  font-size:8.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.workshop-join h3{
  margin:5px 0 7px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:30px;
  line-height:.95;
  text-transform:uppercase;
}
.workshop-join p{
  max-width:610px;
  margin:0;
  color:#6c747c;
  font-size:10.5px;
  line-height:1.5;
}
.workshop-join-points{
  display:grid;
  gap:7px;
}
.workshop-join-points span{
  color:#4e575f;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.workshop-join-points b{
  color:var(--red);
  margin-right:7px;
}

/* External store becomes a clear endpoint, not an internal fake checkout. */
.modal-actions .btn-primary[href*="shop.drfuels.com"]{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}

/* SEO/Speed: below-the-fold containment remains selective. */
.problem-guide,
.sectors{
  content-visibility:auto;
  contain-intrinsic-size:1px 800px;
}

/* Responsive */
@media(max-width:1180px){
  .problem-guide-grid{grid-template-columns:repeat(2,1fr)}
  .workshop-join{
    grid-template-columns:1fr 1fr;
  }
  .workshop-join .btn{grid-column:1/-1;justify-self:start}
}
@media(max-width:820px){
  .protocol-steps{grid-template-columns:1fr}
  .diagnostic-memory{
    align-items:flex-start;
    flex-direction:column;
  }
  .problem-guide-grid{grid-template-columns:1fr 1fr}
  .workshop-join{grid-template-columns:1fr}
  .workshop-join .btn{grid-column:auto}
}
@media(max-width:560px){
  .problem-guide-grid{grid-template-columns:1fr}
  .problem-guide-grid article{min-height:220px}
  .diagnosis-tools{gap:6px}
  .diagnosis-tools button{font-size:8px}
  .recommendation-actions .btn-outline-shop{width:100%}
  .protocol-head{align-items:flex-start;flex-direction:column;gap:3px}
}
@media(prefers-reduced-motion:reduce){
  .external-shop span,
  .problem-guide-grid article,
  .problem-guide-grid article:before,
  .diagnosis-tools button{transition:none!important}
}


/* =========================================================
   V13 — SHOP EXTERNA / HEADER FIX
   ========================================================= */
.main-nav>a.external-shop{
  position:relative;
  min-height:44px;
  padding:12px 18px!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid var(--red)!important;
  border-radius:9px!important;
  background:var(--red)!important;
  color:#fff!important;
  line-height:1!important;
  box-shadow:0 8px 22px rgba(211,13,20,.16);
  overflow:hidden;
}
.main-nav>a.external-shop:after{
  display:none!important;
  content:none!important;
}
.main-nav>a.external-shop:hover{
  background:var(--red2)!important;
  color:#fff!important;
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(211,13,20,.24);
}
.main-nav>a.external-shop:focus-visible{
  outline:3px solid rgba(211,13,20,.28)!important;
  outline-offset:3px;
}
.shop-link-label{
  color:inherit!important;
  font-size:inherit!important;
  font-weight:850;
}
.shop-link-arrow{
  color:inherit!important;
  font-size:13px!important;
  line-height:1;
  transition:transform .18s ease;
}
.external-shop:hover .shop-link-arrow{
  transform:translate(2px,-2px);
}

/* No compact-state CSS may collapse the external shop CTA. */
@media(min-width:1181px){
  .site-header.is-compact .main-nav>a.external-shop{
    padding:11px 18px!important;
    min-height:42px;
  }
}

/* Compact/tablet nav: the store remains the clear terminal CTA. */
@media(max-width:1180px){
  .main-nav>a.external-shop{
    width:100%;
    margin-top:7px;
    padding:14px 16px!important;
  }
}

/* With Sobrecalentamiento removed, keep the symptom grid visually balanced. */
@media(min-width:1181px){
  .symptom-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(min-width:821px) and (max-width:1180px){
  .symptom-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}
@media(max-width:820px){
  .symptom-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


/* =========================================================
   V16 — DIAGNÓSTICO / FLUJO COMERCIAL 10/10
   ========================================================= */

.diagnostic{
  padding-top:92px!important;
  padding-bottom:104px!important;
  background:
    radial-gradient(circle at 90% 7%,rgba(211,13,20,.035),transparent 23%),
    linear-gradient(180deg,#fcfcfb 0%,#f3f5f5 70%,#eef1f1 100%)!important;
}
.diagnostic-heading{
  max-width:980px!important;
}
.diagnostic-heading h2{
  max-width:930px!important;
  font-size:clamp(58px,4.65vw,78px)!important;
}
.diagnostic-heading p{
  max-width:760px!important;
  font-size:14.5px!important;
}

/* Assurance strip */
.diagnostic-assurance{
  display:grid;
  gap:3px;
  margin-bottom:16px;
  padding:13px 15px;
  border:1px solid #dce1e4;
  border-left:3px solid var(--red);
  border-radius:10px;
  background:#fff;
}
.diagnostic-assurance span{
  color:var(--red);
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.diagnostic-assurance b{
  color:#293139;
  font-size:10.5px;
  line-height:1.35;
}

/* Main stage */
.diagnostic-layout{
  grid-template-columns:minmax(420px,.72fr) minmax(700px,1.28fr)!important;
  gap:26px!important;
  align-items:start!important;
}
.symptom-panel{
  padding:20px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.88)!important;
}
.symptom-panel-head{
  padding:3px 2px 13px;
  border-bottom:1px solid #e2e5e7;
}
.symptom-panel-head b{
  font-size:29px!important;
}

/* Symptom cards feel like a decision interface, not admin tiles */
.symptom-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  margin-top:14px;
}
.symptom-card{
  min-height:142px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  text-align:left!important;
  padding:14px 14px 13px!important;
  border-radius:13px!important;
  overflow:hidden;
}
.symptom-card:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--red);
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .2s ease;
}
.symptom-card:hover:before,
.symptom-card[aria-pressed="true"]:before{
  transform:scaleY(1);
}
.symptom-category{
  color:#8a9299;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.085em;
  text-transform:uppercase;
}
.symptom-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  margin:10px 0 5px;
  border-radius:10px;
  background:#f1f3f4;
  color:#151b20;
}
.symptom-card[aria-pressed="true"] .symptom-icon{
  background:#171c21;
  color:#fff;
}
.symptom-icon svg{
  width:25px!important;
  height:25px!important;
}
.symptom-card b{
  margin:3px 0 0!important;
  font-size:12.5px!important;
  line-height:1.12!important;
}
.symptom-card small{
  margin-top:5px!important;
  max-width:150px;
  font-size:8.6px!important;
  line-height:1.35!important;
}
.symptom-arrow{
  position:absolute;
  right:12px;
  bottom:10px;
  color:#afb5ba;
  font-size:14px;
  transition:.18s ease;
}
.symptom-card:hover .symptom-arrow{
  color:var(--red);
  transform:translateX(2px);
}
.symptom-select-mark{
  right:10px!important;
  top:10px!important;
}
.diagnostic-note{
  padding-top:12px;
  border-top:1px solid #e2e5e7;
}

/* Sticky decision panel on desktop */
@media(min-width:1181px){
  .diagnostic-result{
    position:sticky;
    top:96px;
  }
}
.diagnostic-result{
  min-height:600px!important;
  border-radius:19px!important;
  background:#fff;
  transition:opacity .16s ease,transform .16s ease,box-shadow .2s ease!important;
}
.diagnostic-result.has-selection{
  box-shadow:0 28px 70px rgba(12,20,28,.11)!important;
}

/* Empty state */
.premium-empty{
  min-height:600px!important;
  padding:48px!important;
  align-items:flex-start!important;
  text-align:left!important;
}
.empty-system-mark{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:24px;
}
.empty-system-mark>span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--red);
  color:#fff;
  font-size:10px;
  font-weight:900;
}
.empty-system-mark svg{
  width:46px!important;
  height:46px!important;
}
.premium-empty h3{
  max-width:520px;
  font-size:58px!important;
  line-height:.9!important;
}
.premium-empty>p{
  max-width:530px!important;
  font-size:12.5px!important;
  line-height:1.6!important;
}
.empty-decision-flow{
  margin-top:28px!important;
}
.empty-trust{
  max-width:520px;
  display:grid;
  grid-template-columns:32px 1fr;
  gap:12px;
  align-items:center;
  margin-top:22px;
  padding:13px 15px;
  border-radius:11px;
  background:#11171c;
  color:#fff;
}
.empty-trust svg{
  width:27px;
  height:27px;
  color:#ef343a;
}
.empty-trust b{
  display:block;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.empty-trust small{
  display:block;
  margin-top:2px;
  color:#aeb5bb;
  font-size:8.8px;
  line-height:1.4;
}

/* New progress statusbar inside recommendation */
.recommendation-statusbar{
  min-height:52px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 24px;
  border-bottom:1px solid rgba(16,23,29,.08);
  background:rgba(255,255,255,.68);
}
.status-step{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#9aa1a7;
  font-size:8px;
  font-weight:900;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.status-step b{
  color:inherit;
  font-size:8px;
}
.status-step.done{color:#5d686f}
.status-step.current{color:var(--accent,var(--red))}
.recommendation-statusbar>i{
  color:#c6cbd0;
  font-style:normal;
}

/* Main recommendation */
.recommendation-main-v16{
  min-height:548px!important;
  grid-template-columns:minmax(235px,.72fr) minmax(430px,1.28fr)!important;
}
.recommendation-visual{
  min-height:548px!important;
  background:
    radial-gradient(circle at 50% 48%,var(--accent-soft),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.2),rgba(240,242,242,.78));
}
.visual-label{
  position:absolute;
  left:20px;
  top:18px;
  z-index:3;
  color:#626b73;
  font-size:7.8px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.visual-problem-tag{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:4;
  padding:9px 11px;
  border-radius:9px;
  background:rgba(10,14,18,.88);
  color:#fff;
  font-size:8.5px;
  font-weight:800;
  text-align:center;
  backdrop-filter:blur(8px);
}
.recommendation-visual img{
  height:430px!important;
}
.recommendation-copy{
  padding:32px 34px 30px 18px!important;
}
.recommendation-copy h3{
  max-width:600px;
  font-size:52px!important;
}
.recommendation-copy>p{
  font-size:12.5px!important;
}

/* Why it fits */
.decision-explanation{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:11px;
  margin:15px 0;
  padding:13px 14px;
  border:1px solid color-mix(in srgb,var(--accent,var(--red)) 22%,#dde1e4);
  border-radius:11px;
  background:color-mix(in srgb,var(--accent-soft,rgba(211,13,20,.08)) 50%,#fff);
}
.decision-explanation>span{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#fff;
}
.decision-explanation svg{
  width:19px;
  height:19px;
  color:var(--accent,var(--red));
}
.decision-explanation b{
  display:block;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.045em;
}
.decision-explanation p{
  margin:3px 0 0;
  color:#626c74;
  font-size:9.5px;
  line-height:1.45;
}
.decision-explanation.neutral{
  --accent:#d30d14;
  --accent-soft:rgba(211,13,20,.07);
}

/* Facts become concise */
.recommendation-facts-v16{
  gap:7px!important;
}
.recommendation-facts-v16>div{
  min-height:62px!important;
  padding:9px!important;
}

/* Strong next action block */
.next-action-card{
  position:relative;
  display:grid;
  gap:3px;
  margin-top:14px;
  padding:13px 15px 13px 18px;
  border-radius:11px;
  background:#11171c;
  color:#fff;
  overflow:hidden;
}
.next-action-card:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  background:var(--action-accent,var(--red));
}
.next-action-card>span{
  color:#969fa7;
  font-size:7.8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.next-action-card>b{
  font-size:11px;
}
.next-action-card>small{
  color:#aeb5bb;
  font-size:8.7px;
  line-height:1.4;
}
.recommendation-actions-v16{
  gap:10px!important;
  margin-top:14px!important;
  flex-wrap:wrap;
}
.recommendation-actions-v16 .btn{
  min-height:42px;
}
.recommendation-actions-v16 .text-action{
  min-height:42px;
  display:inline-flex;
  align-items:center;
}

/* Utility actions deliberately quieter */
.diagnosis-tools{
  margin-top:12px!important;
  padding-top:11px!important;
}
.diagnosis-tools button{
  background:transparent!important;
  min-height:29px!important;
}

/* Professional result gets same system treatment */
.professional-recommendation.recommendation-v16{
  min-height:600px!important;
  padding:0!important;
  justify-content:flex-start!important;
  background:linear-gradient(145deg,#fff,#f4f6f6)!important;
}
.professional-recommendation.recommendation-v16>.professional-icon,
.professional-recommendation.recommendation-v16>.result-kicker,
.professional-recommendation.recommendation-v16>h3,
.professional-recommendation.recommendation-v16>p,
.professional-recommendation.recommendation-v16>.decision-explanation,
.professional-recommendation.recommendation-v16>.next-action-card,
.professional-recommendation.recommendation-v16>.recommendation-actions,
.professional-recommendation.recommendation-v16>.diagnosis-tools{
  margin-left:46px;
  margin-right:46px;
}
.professional-recommendation.recommendation-v16>.professional-icon{
  margin-top:38px;
}
.professional-recommendation.recommendation-v16>h3{
  font-size:56px!important;
}
.professional-recommendation.recommendation-v16>p{
  max-width:650px;
}

/* Stepper simplified but stronger */
.diagnostic-journey{
  margin-bottom:18px!important;
  box-shadow:0 12px 28px rgba(12,20,28,.04)!important;
}

/* Responsive */
@media(max-width:1180px){
  .diagnostic-layout{
    grid-template-columns:1fr!important;
  }
  .symptom-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .symptom-card{
    min-height:132px!important;
  }
  .diagnostic-result{
    min-height:540px!important;
  }
  .premium-empty{
    min-height:540px!important;
  }
}
@media(max-width:900px){
  .symptom-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .recommendation-main-v16{
    grid-template-columns:1fr!important;
  }
  .recommendation-visual{
    min-height:390px!important;
  }
  .recommendation-visual img{
    height:350px!important;
  }
  .recommendation-copy{
    padding:28px!important;
  }
}
@media(max-width:560px){
  .diagnostic{
    padding-top:68px!important;
    padding-bottom:72px!important;
  }
  .diagnostic-heading h2{
    font-size:46px!important;
  }
  .symptom-grid{
    grid-template-columns:1fr 1fr!important;
  }
  .symptom-card{
    min-height:122px!important;
    padding:12px!important;
  }
  .symptom-category{font-size:7px}
  .symptom-icon{
    width:36px;
    height:36px;
  }
  .symptom-icon svg{
    width:22px!important;
    height:22px!important;
  }
  .premium-empty{
    min-height:450px!important;
    padding:28px!important;
  }
  .premium-empty h3{
    font-size:43px!important;
  }
  .recommendation-statusbar{
    padding:0 14px;
  }
  .status-step b{
    display:none;
  }
  .professional-recommendation.recommendation-v16>.professional-icon,
  .professional-recommendation.recommendation-v16>.result-kicker,
  .professional-recommendation.recommendation-v16>h3,
  .professional-recommendation.recommendation-v16>p,
  .professional-recommendation.recommendation-v16>.decision-explanation,
  .professional-recommendation.recommendation-v16>.next-action-card,
  .professional-recommendation.recommendation-v16>.recommendation-actions,
  .professional-recommendation.recommendation-v16>.diagnosis-tools{
    margin-left:24px;
    margin-right:24px;
  }
}


/* =========================================================
   V17 — RED TALLERES DRFUELS 10/10
   ========================================================= */

.workshops{
  position:relative;
  overflow:hidden;
  padding-top:94px!important;
  padding-bottom:96px!important;
  background:
    radial-gradient(circle at 92% 14%,rgba(211,13,20,.045),transparent 22%),
    linear-gradient(180deg,#f8f9f9 0%,#fff 42%,#f4f6f6 100%)!important;
}
.workshops:before{
  content:"";
  position:absolute;
  right:-180px;
  top:60px;
  width:520px;
  height:520px;
  border-radius:50%;
  border:78px solid rgba(12,18,24,.022);
  pointer-events:none;
}

.workshop-intro{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:70px;
  align-items:end;
  margin-bottom:34px;
}
.workshop-intro h2{
  max-width:850px;
  margin:0 0 14px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:clamp(56px,4.6vw,76px);
  line-height:.92;
  text-transform:uppercase;
}
.workshop-intro p{
  max-width:750px;
  margin:0;
  color:#667078;
  font-size:14px;
  line-height:1.7;
}
.network-trust{
  display:grid;
  gap:8px;
  padding:18px;
  border:1px solid #dce1e4;
  border-radius:14px;
  background:rgba(255,255,255,.78);
  box-shadow:0 14px 36px rgba(13,20,27,.04);
}
.network-trust span{
  display:grid;
  grid-template-columns:30px 1fr;
  align-items:center;
  gap:9px;
  color:#515a62;
  font-size:9.5px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.network-trust b{
  color:var(--red);
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:21px;
}

/* Journey */
.workshop-system{
  position:relative;
  z-index:1;
}
.network-journey{
  margin-bottom:16px;
  padding:18px 20px;
  border-radius:16px;
  background:#0c1014;
  color:#fff;
  box-shadow:0 20px 50px rgba(6,12,18,.13);
}
.network-journey-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:18px;
  padding-bottom:13px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.network-journey-head span{
  color:#ef343a;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.network-journey-head b{
  color:#aeb6bd;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.055em;
}
.network-journey-steps{
  display:grid;
  grid-template-columns:1fr 28px 1fr 28px 1fr;
  gap:10px;
  align-items:center;
  padding-top:15px;
}
.network-journey-steps article{
  min-height:100px;
  display:grid;
  grid-template-columns:34px 42px 1fr;
  gap:11px;
  align-items:center;
  padding:12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(255,255,255,.018);
}
.network-journey-steps article>span{
  color:#e3121b;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:31px;
  font-weight:800;
}
.network-journey-steps svg{
  width:36px;
  height:36px;
  color:#fff;
  fill:none;
  stroke:currentColor;
  stroke-width:1.35;
}
.network-journey-steps b{
  display:block;
  margin-bottom:3px;
  font-size:11px;
  text-transform:uppercase;
}
.network-journey-steps p{
  margin:0;
  color:#9ea7af;
  font-size:8.8px;
  line-height:1.4;
}
.network-journey-steps>i{
  color:#5f6870;
  font-style:normal;
  text-align:center;
}

/* Diagnostic context crossing into the network */
.network-context{
  min-height:74px;
  display:grid;
  grid-template-columns:44px 1fr auto;
  gap:14px;
  align-items:center;
  margin-bottom:16px;
  padding:13px 16px;
  border:1px solid rgba(211,13,20,.18);
  border-radius:13px;
  background:#fff6f6;
}
.network-context[hidden]{display:none!important}
.network-context-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#11171c;
  color:#fff;
}
.network-context-icon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
}
.network-context span{
  color:var(--red);
  font-size:7.8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.network-context b{
  display:block;
  margin:2px 0 3px;
  font-size:12px;
}
.network-context p{
  margin:0;
  color:#6a737b;
  font-size:9.3px;
  line-height:1.4;
}
.network-context button{
  border:0;
  background:transparent;
  color:#6d757c;
  font-size:8px;
  font-weight:850;
  text-transform:uppercase;
  cursor:pointer;
}

/* Main finder */
.workshop-core{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);
  gap:16px;
  align-items:stretch;
}
.finder-v17{
  min-height:425px;
  padding:28px!important;
  border:1px solid #1f252c!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 92% 0,rgba(211,13,20,.14),transparent 26%),
    linear-gradient(145deg,#0b0f13,#10161b)!important;
}
.finder-head-v17{
  align-items:center!important;
}
.finder-head-v17 b{
  font-size:27px!important;
}
.network-status{
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#d9dde0!important;
  font-size:7.5px!important;
  white-space:nowrap;
}
.finder-search-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:9px;
  margin-top:22px;
}
.search-field-v17{
  margin:0!important;
  height:52px!important;
  border-radius:10px!important;
  background:#070a0d!important;
}
.search-field-v17 input{
  font-size:12.5px!important;
}
.network-search-btn{
  min-width:92px;
  border:0;
  border-radius:10px;
  background:var(--red);
  color:#fff;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.045em;
  cursor:pointer;
  transition:.18s ease;
}
.network-search-btn:hover{
  background:#b90d14;
  transform:translateY(-1px);
}
.finder-meta{
  margin-top:10px;
}
.finder-meta>span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#7f8991;
  font-size:8.3px;
}
.finder-meta svg{
  width:15px;
  height:15px;
  color:#a8b0b7;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
}

.workshop-results{
  margin-top:16px!important;
}
.network-empty-v17{
  min-height:205px;
  display:grid!important;
  grid-template-columns:58px 1fr!important;
  gap:16px!important;
  align-items:center!important;
  padding:22px!important;
  border:1px solid #242b32!important;
  border-radius:13px!important;
  background:#11171c!important;
}
.network-empty-icon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#070a0d;
  color:#fff;
}
.network-empty-icon.alert{
  color:#ef343a;
}
.network-empty-icon svg{
  width:29px!important;
  height:29px!important;
  margin:0!important;
}
.network-empty-v17 .result-kicker{
  color:#ef343a!important;
  font-size:8px!important;
}
.network-empty-v17 b{
  display:block;
  margin:4px 0 7px;
  color:#fff!important;
  font-size:17px!important;
}
.network-empty-v17 p{
  max-width:620px;
  margin:0;
  color:#8e98a1!important;
  font-size:9.5px!important;
  line-height:1.5!important;
}
.request-context{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px;
  padding:8px 10px;
  border-radius:8px;
  background:#090d10;
}
.request-context span{
  color:#7e8790;
  font-size:7px;
  font-weight:900;
  text-transform:uppercase;
}
.request-context b{
  margin:0!important;
  font-size:9px!important;
}
.network-empty-actions{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:15px;
}
.network-empty-actions .text-action{
  color:#aeb6bd;
}

/* Real result cards, ready for future data */
.network-results-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin-bottom:8px;
  color:#fff;
}
.network-results-head span{
  color:#ef343a;
  font-size:7.5px;
  font-weight:900;
  text-transform:uppercase;
}
.network-results-head b{
  font-size:10px;
}
.workshop-result-v17{
  padding:15px!important;
  border-radius:12px!important;
  background:#11171c!important;
}
.workshop-result-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
}
.workshop-result-top>svg{
  width:22px;
  height:22px;
  color:#ef343a;
  fill:none;
  stroke:currentColor;
}
.workshop-verified{
  color:#7fd19b!important;
  font-size:7px!important;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.workshop-result-v17 b{
  display:block;
  margin-top:3px;
  color:#fff;
  font-size:12px!important;
}
.workshop-result-v17 p{
  color:#929ba3!important;
}
.workshop-result-actions{
  display:flex;
  gap:8px;
  margin-top:11px;
}
.workshop-result-actions a{
  padding:7px 9px;
  border:1px solid #2c343b;
  border-radius:7px;
  color:#d4d8dc;
  font-size:8px;
  font-weight:850;
  text-decoration:none;
}

/* Sidecard */
.network-sidecard{
  display:flex;
  flex-direction:column;
  min-height:425px;
  padding:27px;
  border:1px solid #dce1e4;
  border-radius:18px;
  background:
    radial-gradient(circle at 100% 0,rgba(211,13,20,.065),transparent 26%),
    #fff;
  box-shadow:0 18px 46px rgba(13,20,27,.055);
}
.sidecard-kicker{
  color:var(--red);
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.085em;
}
.network-sidecard h3{
  margin:15px 0 10px;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:39px;
  line-height:.92;
  text-transform:uppercase;
}
.network-sidecard p{
  margin:0;
  color:#68727a;
  font-size:10.5px;
  line-height:1.55;
}
.sidecard-flow{
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:24px;
  padding:12px;
  border:1px solid #e1e4e6;
  border-radius:10px;
  background:#f7f8f8;
}
.sidecard-flow span{
  display:grid;
  gap:2px;
  color:#59636b;
  font-size:7.2px;
  font-weight:900;
  text-transform:uppercase;
}
.sidecard-flow b{
  color:var(--red);
  font-size:9px;
}
.sidecard-flow i{
  color:#b4bbc0;
  font-style:normal;
}
.network-request-generic{
  margin-top:auto;
  align-self:flex-start;
  color:#11171c!important;
}

/* Workshop acquisition */
.workshop-join-v17{
  margin-top:18px!important;
  grid-template-columns:1.05fr 1.15fr auto!important;
  gap:30px!important;
  padding:28px 30px!important;
  border-radius:17px!important;
  background:
    linear-gradient(112deg,#0b0f13,#11171c 65%,#0a0d10)!important;
  color:#fff;
  border-color:#1f252b!important;
}
.workshop-join-v17 .join-copy>span{
  color:#ef343a!important;
}
.workshop-join-v17 h3{
  color:#fff!important;
  font-size:37px!important;
}
.workshop-join-v17 p{
  color:#9ba4ac!important;
}
.workshop-join-v17 .workshop-join-points{
  grid-template-columns:1fr!important;
  gap:7px!important;
}
.workshop-join-v17 .workshop-join-points span{
  display:grid;
  grid-template-columns:28px 1fr;
  column-gap:8px;
  align-items:start;
  padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
  color:#fff!important;
}
.workshop-join-v17 .workshop-join-points b{
  grid-row:1/3;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:22px;
}
.workshop-join-v17 .workshop-join-points i{
  color:#fff;
  font-size:9px;
  font-style:normal;
  font-weight:900;
  text-transform:uppercase;
}
.workshop-join-v17 .workshop-join-points small{
  color:#87919a;
  font-size:8.2px;
  line-height:1.35;
}

/* Responsive */
@media(max-width:1180px){
  .workshop-intro{
    grid-template-columns:1fr;
    gap:24px;
  }
  .network-trust{
    grid-template-columns:repeat(3,1fr);
  }
  .workshop-core{
    grid-template-columns:1fr;
  }
  .network-sidecard{
    min-height:auto;
  }
  .network-request-generic{
    margin-top:22px;
  }
  .workshop-join-v17{
    grid-template-columns:1fr 1fr!important;
  }
  .workshop-join-v17>.btn{
    grid-column:1/-1;
    justify-self:start;
  }
}
@media(max-width:820px){
  .network-journey-steps{
    grid-template-columns:1fr;
  }
  .network-journey-steps>i{
    display:none;
  }
  .network-journey-steps article{
    min-height:86px;
  }
  .network-context{
    grid-template-columns:42px 1fr;
  }
  .network-context button{
    grid-column:2;
    justify-self:start;
  }
  .workshop-join-v17{
    grid-template-columns:1fr!important;
  }
  .workshop-join-v17>.btn{
    grid-column:auto;
  }
}
@media(max-width:560px){
  .workshops{
    padding-top:72px!important;
    padding-bottom:72px!important;
  }
  .workshop-intro h2{
    font-size:48px;
  }
  .network-trust{
    grid-template-columns:1fr;
  }
  .finder-v17{
    padding:20px!important;
  }
  .finder-search-row{
    grid-template-columns:1fr;
  }
  .network-search-btn{
    min-height:44px;
  }
  .finder-head-v17{
    align-items:flex-start!important;
    flex-direction:column;
  }
  .network-empty-v17{
    grid-template-columns:1fr!important;
  }
  .network-empty-actions{
    align-items:flex-start;
    flex-direction:column;
  }
  .network-sidecard h3{
    font-size:34px;
  }
  .sidecard-flow{
    flex-wrap:wrap;
  }
}


/* =========================================================
   V18 — CATÁLOGO / HANDOFF A TIENDA 10/10
   ========================================================= */

.treatments-premium{
  padding-top:96px!important;
  padding-bottom:100px!important;
}
.treatments-heading{
  max-width:980px;
  margin-left:auto!important;
  margin-right:auto!important;
}
.treatments-heading h2{
  font-size:clamp(58px,4.7vw,78px)!important;
}
.treatments-heading p{
  max-width:800px!important;
}

/* Entry switch: catalog vs diagnostic */
.catalog-entry{
  display:grid;
  grid-template-columns:210px 1fr 230px;
  gap:18px;
  align-items:center;
  margin-bottom:14px;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:15px;
  background:rgba(255,255,255,.035);
  backdrop-filter:blur(8px);
}
.catalog-entry-copy{
  display:grid;
  gap:2px;
}
.catalog-entry-copy>span{
  color:#d9b94b;
  font-size:7.8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.catalog-entry-copy>b{
  color:#fff;
  font-size:13px;
}
.catalog-entry-copy>small{
  color:#7f8991;
  font-size:8.4px;
  line-height:1.35;
}
.catalog-filters{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.catalog-filter{
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:#0e1317;
  color:#9ea7af;
  font-size:8px;
  font-weight:850;
  cursor:pointer;
  transition:.18s ease;
}
.catalog-filter:hover{
  color:#fff;
  border-color:rgba(255,255,255,.22);
}
.catalog-filter.active{
  border-color:#d3b44c;
  background:#d3b44c;
  color:#101214;
}
.catalog-diagnosis-link{
  display:grid;
  gap:2px;
  padding:11px 13px;
  border:1px solid rgba(211,13,20,.28);
  border-radius:11px;
  background:rgba(211,13,20,.055);
  text-decoration:none;
}
.catalog-diagnosis-link span{
  color:#8f989f;
  font-size:7.8px;
  font-weight:850;
  text-transform:uppercase;
}
.catalog-diagnosis-link b{
  color:#fff;
  font-size:9.5px;
}
.catalog-status{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin:0 0 12px;
  padding:0 2px;
}
.catalog-status span{
  color:#d1b34c;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.catalog-status b{
  color:#6f7981;
  font-size:8.5px;
  text-transform:uppercase;
  letter-spacing:.045em;
}

/* Flagship upgraded */
.flagship-v18{
  min-height:570px!important;
}
.product-decision-line{
  display:grid;
  grid-template-columns:1fr 24px 1fr 24px 1fr;
  gap:8px;
  align-items:center;
  margin:20px 0 18px;
  padding:12px 13px;
  border:1px solid rgba(201,162,39,.20);
  border-radius:11px;
  background:rgba(201,162,39,.04);
}
.product-decision-line>div{
  display:grid;
  gap:3px;
}
.product-decision-line span{
  color:#8f8872;
  font-size:7px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.product-decision-line b{
  color:#e2d8b7;
  font-size:9px;
  line-height:1.2;
}
.product-decision-line i{
  color:#806f3a;
  font-style:normal;
  text-align:center;
}
.flagship-actions{
  display:flex;
  align-items:center;
  gap:16px;
  margin-top:22px;
}
.flagship-actions>a{
  color:#d7c889;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  text-decoration:none;
  letter-spacing:.04em;
}

/* Family cards */
.product-card-v18{
  min-height:286px!important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;
}
.product-card-v18:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 45px rgba(0,0,0,.22)!important;
}
.product-card-v18:hover .product-bottle img{
  transform:translateY(-5px) scale(1.025);
}
.product-card-v18 .product-bottle img{
  transition:transform .22s ease;
}
.product-problem-label{
  display:block;
  margin-bottom:6px;
  color:var(--accent);
  font-size:7.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.product-card-route{
  display:flex;
  align-items:center;
  gap:5px;
  margin-top:11px;
  color:#9aa1a7;
  font-size:6.8px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.045em;
}
.product-card-route i{
  color:var(--accent);
  font-style:normal;
}
.product-card-actions{
  display:flex;
  align-items:center;
  gap:11px;
  margin-top:13px;
}
.product-card-actions button,
.product-card-actions a{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  font-size:8.5px!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  letter-spacing:.04em;
  cursor:pointer;
  text-decoration:none;
}
.product-card-actions button{
  color:#151a1f!important;
}
.product-card-actions button span{
  color:var(--accent);
}
.product-card-actions a{
  color:var(--accent)!important;
}
.catalog-empty{
  grid-column:1/-1;
  min-height:190px;
  display:grid;
  place-items:center;
  gap:10px;
  padding:30px;
  border:1px dashed rgba(255,255,255,.13);
  border-radius:14px;
  color:#8e979f;
  text-align:center;
}
.catalog-empty button{
  border:0;
  background:transparent;
  color:#fff;
  font-weight:900;
  cursor:pointer;
}

/* External shop bridge */
.catalog-bridge{
  display:grid;
  grid-template-columns:52px 1fr auto;
  gap:16px;
  align-items:center;
  margin-top:16px;
  padding:18px 20px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:
    radial-gradient(circle at 0 50%,rgba(211,13,20,.10),transparent 18%),
    #0e1317;
}
.catalog-bridge-icon{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#080b0e;
  color:#ef343a;
}
.catalog-bridge-icon svg{
  width:27px;
  height:27px;
}
.catalog-bridge>div:nth-child(2){
  display:grid;
  gap:3px;
}
.catalog-bridge span{
  color:#ef343a;
  font-size:7.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.085em;
}
.catalog-bridge b{
  color:#fff;
  font-size:11px;
}
.catalog-bridge p{
  max-width:800px;
  margin:0;
  color:#7e8890;
  font-size:8.7px;
  line-height:1.4;
}
.catalog-bridge>a{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  color:#fff;
  font-size:8.5px;
  font-weight:900;
  text-transform:uppercase;
  text-decoration:none;
}

/* Modal dossier */
.modal-card{
  width:min(1160px,calc(100vw - 42px))!important;
  max-height:min(860px,calc(100svh - 34px))!important;
}
.modal-treatment-v18{
  grid-template-columns:390px minmax(0,1fr)!important;
  min-height:690px!important;
}
.modal-treatment-v18 .modal-product-image{
  position:relative;
  min-height:690px;
  padding:44px 34px 30px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%,var(--accent-soft),transparent 31%),
    linear-gradient(180deg,#f7f8f8,#e9ecec)!important;
}
.modal-visual-top{
  position:absolute;
  left:24px;
  right:24px;
  top:22px;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.modal-visual-top span{
  color:var(--accent);
  font-size:7.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.modal-visual-top b{
  color:#727b82;
  font-size:7.5px;
  text-transform:uppercase;
}
.modal-visual-halo{
  position:absolute;
  width:310px;
  height:310px;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  box-shadow:
    0 0 0 48px color-mix(in srgb,var(--accent) 5%,transparent),
    0 0 0 96px color-mix(in srgb,var(--accent) 2.5%,transparent);
}
.modal-treatment-v18 .modal-product-image img{
  height:540px!important;
}
.modal-problem-pill{
  position:absolute;
  left:24px;
  right:24px;
  bottom:22px;
  z-index:4;
  display:grid;
  gap:2px;
  padding:11px 13px;
  border-radius:10px;
  background:rgba(12,17,21,.90);
  color:#fff;
  backdrop-filter:blur(8px);
}
.modal-problem-pill span{
  color:#9da6ad;
  font-size:7px;
  font-weight:900;
  text-transform:uppercase;
}
.modal-problem-pill b{
  font-size:10px;
}
.modal-treatment-v18 .modal-product-copy{
  padding:48px 48px 40px!important;
}
.modal-dossier-head h2{
  font-size:58px!important;
}
.modal-dossier-head>p{
  max-width:680px;
}
.modal-route-v18{
  display:grid;
  grid-template-columns:1fr 24px 1fr 24px 1fr;
  gap:8px;
  align-items:center;
  margin:20px 0;
  padding:11px;
  border:1px solid #e0e3e5;
  border-radius:11px;
  background:#f7f8f8;
}
.modal-route-v18>div{
  display:grid;
  gap:2px;
}
.modal-route-v18 span{
  color:var(--accent);
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:18px;
  font-weight:800;
}
.modal-route-v18 b{
  font-size:8px;
  text-transform:uppercase;
}
.modal-route-v18 small{
  color:#727b82;
  font-size:8.2px;
  line-height:1.3;
}
.modal-route-v18 i{
  color:#b3b9bd;
  font-style:normal;
  text-align:center;
}
.specs-v18{
  gap:8px!important;
  margin-top:0!important;
}
.specs-v18 .spec{
  min-height:73px;
  background:#fff;
}
.prepurchase-check{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:12px;
  margin-top:18px;
  padding:14px;
  border-radius:11px;
  background:#11171c;
  color:#fff;
}
.prepurchase-check>svg{
  width:27px;
  height:27px;
  color:#ef343a;
}
.prepurchase-check span{
  color:#ef343a;
  font-size:7.5px;
  font-weight:900;
  text-transform:uppercase;
}
.prepurchase-check b{
  display:block;
  margin:2px 0 3px;
  font-size:10px;
}
.prepurchase-check p{
  margin:0!important;
  color:#9fa8af!important;
  font-size:8.7px!important;
  line-height:1.4!important;
}
.modal-actions-v18{
  display:flex;
  align-items:center;
  gap:16px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid #e0e3e5;
}

/* Responsive */
@media(max-width:1180px){
  .catalog-entry{
    grid-template-columns:1fr;
  }
  .catalog-diagnosis-link{
    max-width:360px;
  }
  .catalog-bridge{
    grid-template-columns:52px 1fr;
  }
  .catalog-bridge>a{
    grid-column:2;
    justify-self:start;
  }
}
@media(max-width:820px){
  .catalog-filters{
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:4px;
    scrollbar-width:thin;
  }
  .catalog-filter{
    flex:0 0 auto;
  }
  .product-decision-line{
    grid-template-columns:1fr;
  }
  .product-decision-line i{
    display:none;
  }
  .modal-treatment-v18{
    grid-template-columns:1fr!important;
  }
  .modal-treatment-v18 .modal-product-image{
    min-height:430px;
  }
  .modal-treatment-v18 .modal-product-image img{
    height:390px!important;
  }
  .modal-route-v18{
    grid-template-columns:1fr;
  }
  .modal-route-v18 i{
    display:none;
  }
}
@media(max-width:560px){
  .catalog-entry{
    padding:14px;
  }
  .catalog-bridge{
    grid-template-columns:1fr;
  }
  .catalog-bridge>a{
    grid-column:auto;
  }
  .flagship-actions{
    align-items:flex-start;
    flex-direction:column;
  }
  .modal-treatment-v18 .modal-product-copy{
    padding:28px 22px 30px!important;
  }
  .modal-dossier-head h2{
    font-size:46px!important;
  }
  .modal-actions-v18{
    align-items:flex-start;
    flex-direction:column;
  }
}
@media(prefers-reduced-motion:reduce){
  .catalog-filter,
  .product-card-v18,
  .product-card-v18 .product-bottle img{
    transition:none!important;
  }
}


/* =========================================================
   V19 — CATÁLOGO FILTRADO: VISTA FOCUS
   Corrige el espacio muerto de filtros individuales
   ========================================================= */

.product-showcase.is-filtered{
  gap:0!important;
}
.product-showcase.is-filtered .product-flagship[hidden]{
  display:none!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}
.catalog-focus-grid{
  display:grid;
  grid-template-columns:1fr;
  width:100%;
  margin:0;
  padding:0;
}

/* El filtro individual se convierte en una ficha protagonista
   de ancho completo en lugar de una tarjeta perdida en 1/3 del grid. */
.catalog-focus-card{
  position:relative;
  min-height:520px;
  display:grid;
  grid-template-columns:minmax(520px,1.08fr) minmax(360px,.92fr);
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--accent) 34%,rgba(255,255,255,.13));
  border-radius:19px;
  background:
    radial-gradient(circle at 82% 45%,var(--accent-soft),transparent 25%),
    linear-gradient(110deg,#f8f9f8 0%,#fff 51%,color-mix(in srgb,var(--accent-soft) 42%,#f4f5f5) 100%);
  color:#12171b;
  box-shadow:0 28px 70px rgba(0,0,0,.20);
}
.catalog-focus-card:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--accent);
}
.catalog-focus-card.is-flagship-focus{
  border-color:rgba(201,162,39,.48);
  background:
    radial-gradient(circle at 81% 48%,rgba(201,162,39,.16),transparent 26%),
    linear-gradient(110deg,#11110f 0%,#16130c 52%,#0d0d0c 100%);
  color:#fff;
}
.catalog-focus-copy{
  position:relative;
  z-index:2;
  align-self:center;
  padding:48px 34px 48px 52px;
}
.catalog-focus-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:22px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(17,23,28,.10);
}
.is-flagship-focus .catalog-focus-meta{
  border-bottom-color:rgba(255,255,255,.10);
}
.catalog-focus-meta span{
  color:var(--accent);
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.catalog-focus-meta b{
  color:#7b848b;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.055em;
}
.catalog-focus-card .product-problem-label{
  margin-bottom:8px;
}
.catalog-focus-card h3{
  max-width:650px;
  margin:0;
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:clamp(58px,4.6vw,76px);
  line-height:.9;
  text-transform:uppercase;
}
.catalog-focus-card> .catalog-focus-copy>p{
  max-width:650px;
  margin:14px 0 0;
  color:#667078;
  font-size:12.5px;
  line-height:1.62;
}
.is-flagship-focus> .catalog-focus-copy>p{
  color:#c2c5c7;
}

.focus-decision-path{
  display:grid;
  grid-template-columns:1fr 24px 1fr 24px 1fr;
  gap:9px;
  align-items:center;
  margin:24px 0 18px;
  padding:13px;
  border:1px solid #dfe3e5;
  border-radius:11px;
  background:rgba(255,255,255,.72);
}
.is-flagship-focus .focus-decision-path{
  border-color:rgba(201,162,39,.22);
  background:rgba(201,162,39,.045);
}
.focus-decision-path>div{
  display:grid;
  gap:2px;
}
.focus-decision-path span{
  color:var(--accent);
  font-family:'Barlow Condensed',Arial,sans-serif;
  font-size:21px;
  font-weight:800;
}
.focus-decision-path b{
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.focus-decision-path small{
  color:#6e777f;
  font-size:8.2px;
  line-height:1.3;
}
.is-flagship-focus .focus-decision-path small{
  color:#b1aa94;
}
.focus-decision-path i{
  color:#adb4b9;
  font-style:normal;
  text-align:center;
}

.focus-facts{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:16px;
}
.focus-facts span{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 10px;
  border:1px solid #dce0e3;
  border-radius:999px;
  background:#fff;
  color:#59636a;
}
.focus-facts svg{
  width:14px;
  height:14px;
  color:var(--accent);
}
.focus-facts b{
  font-size:7.8px;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.is-flagship-focus .focus-facts span{
  border-color:rgba(201,162,39,.25);
  background:rgba(201,162,39,.05);
  color:#d5c78f;
}

.focus-actions{
  display:flex;
  align-items:center;
  gap:17px;
  margin-top:23px;
}
.focus-shop-link{
  color:#373f46;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.045em;
  text-decoration:none;
}
.is-flagship-focus .focus-shop-link{
  color:#d6c786;
}

/* Product image gets its own premium visual territory */
.catalog-focus-visual{
  position:relative;
  min-height:520px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.catalog-focus-visual:after{
  content:"";
  position:absolute;
  left:25%;
  right:25%;
  bottom:34px;
  height:28px;
  border-radius:50%;
  background:rgba(0,0,0,.16);
  filter:blur(15px);
}
.catalog-focus-visual img{
  position:relative;
  z-index:3;
  height:465px;
  width:auto;
  object-fit:contain;
  filter:drop-shadow(0 23px 19px rgba(0,0,0,.19));
  transition:transform .25s ease;
}
.catalog-focus-card:hover .catalog-focus-visual img{
  transform:translateY(-5px) scale(1.018);
}
.focus-halo{
  position:absolute;
  width:320px;
  height:320px;
  border-radius:50%;
  background:var(--accent-soft);
  filter:blur(2px);
}
.focus-orbit{
  position:absolute;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--accent) 27%,transparent);
}
.focus-orbit-one{
  width:310px;
  height:310px;
}
.focus-orbit-two{
  width:410px;
  height:220px;
  transform:rotate(-8deg);
  opacity:.52;
}
.focus-visual-label{
  position:absolute;
  top:22px;
  right:23px;
  z-index:4;
  display:grid;
  gap:2px;
  text-align:right;
}
.focus-visual-label span{
  color:var(--accent);
  font-size:7.5px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.085em;
}
.focus-visual-label b{
  color:#737c84;
  font-size:7.5px;
  text-transform:uppercase;
}
.is-flagship-focus .focus-visual-label b{
  color:#a89f80;
}

/* Filtered section loses unnecessary vertical voids. */
.product-showcase.is-single-focus{
  min-height:0!important;
}
.product-showcase.is-single-focus + .catalog-bridge{
  margin-top:14px;
}
.product-showcase.is-single-focus .catalog-focus-grid{
  min-height:0;
}

/* Responsive */
@media(max-width:1180px){
  .catalog-focus-card{
    grid-template-columns:minmax(0,1fr) 360px;
  }
  .catalog-focus-copy{
    padding-left:38px;
  }
  .catalog-focus-visual img{
    height:430px;
  }
}
@media(max-width:820px){
  .catalog-focus-card{
    grid-template-columns:1fr;
    min-height:auto;
  }
  .catalog-focus-copy{
    padding:36px 28px 20px;
  }
  .catalog-focus-visual{
    min-height:430px;
  }
  .catalog-focus-visual img{
    height:390px;
  }
  .focus-decision-path{
    grid-template-columns:1fr;
  }
  .focus-decision-path i{
    display:none;
  }
}
@media(max-width:560px){
  .catalog-focus-copy{
    padding:30px 22px 16px;
  }
  .catalog-focus-card h3{
    font-size:50px;
  }
  .focus-actions{
    align-items:flex-start;
    flex-direction:column;
  }
  .catalog-focus-visual{
    min-height:365px;
  }
  .catalog-focus-visual img{
    height:335px;
  }
  .focus-orbit-one{
    width:250px;
    height:250px;
  }
  .focus-orbit-two{
    width:315px;
    height:175px;
  }
}
@media(prefers-reduced-motion:reduce){
  .catalog-focus-visual img{
    transition:none!important;
  }
}


/* =========================================================
   V20 — MOTION & MICROINTERACTIONS
   Movement communicates state; never tuning decoration.
   ========================================================= */
:root{
  --motion-fast:160ms;
  --motion-base:260ms;
  --motion-slow:520ms;
  --motion-ease:cubic-bezier(.22,.8,.25,1);
}

/* Reveal */
.motion-ready .reveal{
  opacity:0;
  transform:translateY(20px);
  filter:blur(1.5px);
  transition:
    opacity var(--motion-slow) var(--motion-ease),
    transform var(--motion-slow) var(--motion-ease),
    filter var(--motion-base) ease;
}
.motion-ready .reveal.in{
  opacity:1;
  transform:none;
  filter:none;
}
.motion-item{--stagger-delay:calc(var(--motion-index,0) * 34ms)}
.motion-ready .reveal.in .motion-item{
  animation:drfuelsItemIn 430ms var(--motion-ease) both;
  animation-delay:var(--stagger-delay);
}
@keyframes drfuelsItemIn{
  from{opacity:.001;transform:translateY(9px)}
  to{opacity:1;transform:none}
}

/* Tactile controls */
.interaction-ready{
  transition:
    transform var(--motion-fast) var(--motion-ease),
    box-shadow var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    color var(--motion-fast) ease!important;
}
.interaction-ready:active{transform:translateY(1px) scale(.985)!important}
.btn span[aria-hidden="true"],
.text-action span[aria-hidden="true"]{
  display:inline-block;
  transition:transform var(--motion-fast) var(--motion-ease);
}
.btn:hover span[aria-hidden="true"],
.text-action:hover span[aria-hidden="true"]{transform:translateX(3px)}

/* Header */
.main-nav>a:not(.external-shop){transition:color var(--motion-fast) ease!important}
.main-nav>a:not(.external-shop):after{transition:right var(--motion-base) var(--motion-ease)!important}
.scroll-progress span{box-shadow:0 0 10px rgba(211,13,20,.20)}

/* Hero */
.hero .btn:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 32px rgba(211,13,20,.22);
}
.hero-proof>div{
  transition:opacity var(--motion-fast) ease,transform var(--motion-fast) var(--motion-ease);
}
.hero-proof>div:hover{transform:translateY(-2px)}

/* Diagnostic */
.symptom-card{transform-origin:center;will-change:transform}
.symptom-card.selection-pulse{animation:diagnosticSelect 330ms var(--motion-ease)}
@keyframes diagnosticSelect{
  0%{transform:translateY(-2px) scale(1)}
  45%{transform:translateY(-3px) scale(1.018)}
  100%{transform:translateY(-2px) scale(1)}
}
.symptom-card[aria-pressed="true"] .symptom-icon{animation:iconConfirm 300ms var(--motion-ease)}
@keyframes iconConfirm{
  from{transform:scale(.84);opacity:.6}
  to{transform:scale(1);opacity:1}
}
.diagnostic-result{
  will-change:opacity,transform;
  transition:
    opacity 210ms ease,
    transform 300ms var(--motion-ease),
    box-shadow 260ms ease!important;
}
.diagnostic-result.is-updating{
  opacity:.42!important;
  transform:translateY(5px) scale(.994)!important;
  pointer-events:none;
}
.recommendation-visual img{
  transition:transform 360ms var(--motion-ease),filter 260ms ease!important;
}
.diagnostic-recommendation-card:hover .recommendation-visual img{
  transform:translateY(-4px) scale(1.012);
}
.diagnostic-journey>div{
  transition:
    background-color var(--motion-base) ease,
    box-shadow var(--motion-base) ease,
    transform var(--motion-base) var(--motion-ease)!important;
}
.diagnostic-journey>div.is-active{transform:translateY(-1px)}
.diagnostic-journey>div>span{
  transition:background-color var(--motion-base) ease,transform var(--motion-base) var(--motion-ease);
}
.diagnostic-journey>div.is-active>span{transform:scale(1.06)}

/* Catalog switching: no scroll jump */
.product-showcase{
  transition:
    opacity 180ms ease,
    transform 260ms var(--motion-ease),
    filter 180ms ease;
}
.product-showcase.catalog-switching{
  opacity:.18;
  transform:translateY(5px);
  filter:blur(2px);
  pointer-events:none;
}
.catalog-filter.active{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(201,162,39,.12);
}

/* Product motion */
.product-card-v18{
  transition:
    transform var(--motion-base) var(--motion-ease),
    box-shadow var(--motion-base) ease,
    border-color var(--motion-fast) ease!important;
}
.product-card-v18:hover{transform:translateY(-5px)!important}
.product-card-v18 .product-bottle-halo{
  transition:transform 380ms var(--motion-ease),opacity 220ms ease;
}
.product-card-v18:hover .product-bottle-halo{transform:scale(1.08)}
.premium-flagship .flagship-visual img{
  transition:transform 420ms var(--motion-ease),filter 260ms ease;
}
.premium-flagship:hover .flagship-visual img{transform:translateY(-5px) scale(1.012)}
.catalog-focus-visual img{
  transition:transform 380ms var(--motion-ease),filter 260ms ease!important;
}
.catalog-focus-card:hover .catalog-focus-visual img{transform:translateY(-5px) scale(1.018)}
.gold-orbit,.focus-orbit{transition:transform 520ms var(--motion-ease),opacity 280ms ease}
.premium-flagship:hover .gold-orbit{transform:scale(1.025)}
.catalog-focus-card:hover .focus-orbit-one{transform:scale(1.035)}
.catalog-focus-card:hover .focus-orbit-two{transform:rotate(-6deg) scale(1.025)}

/* Modal layered entrance */
.modal{transition:opacity 190ms ease!important}
.modal-card{
  transform:translate(-50%,calc(-50% + 18px)) scale(.987)!important;
  opacity:0!important;
  transition:
    transform 360ms var(--motion-ease),
    opacity 220ms ease!important;
}
.modal.open .modal-card{
  transform:translate(-50%,-50%) scale(1)!important;
  opacity:1!important;
}
.modal.motion-in .modal-product-image img{animation:modalBottleIn 460ms var(--motion-ease) 80ms both}
.modal.motion-in .modal-dossier-head,
.modal.motion-in .modal-route-v18,
.modal.motion-in .specs-v18,
.modal.motion-in .protocol-block,
.modal.motion-in .prepurchase-check,
.modal.motion-in .modal-actions-v18{
  animation:modalContentIn 380ms var(--motion-ease) both;
}
.modal.motion-in .modal-route-v18{animation-delay:55ms}
.modal.motion-in .specs-v18{animation-delay:90ms}
.modal.motion-in .protocol-block{animation-delay:125ms}
.modal.motion-in .prepurchase-check{animation-delay:155ms}
.modal.motion-in .modal-actions-v18{animation-delay:185ms}
@keyframes modalBottleIn{
  from{opacity:.2;transform:translateY(12px) scale(.96)}
  to{opacity:1;transform:none}
}
@keyframes modalContentIn{
  from{opacity:.001;transform:translateY(9px)}
  to{opacity:1;transform:none}
}
.modal-close{
  transition:transform var(--motion-fast) var(--motion-ease),background-color var(--motion-fast) ease!important;
}
.modal-close:hover{transform:rotate(4deg) scale(1.04);background:#f5f6f6}

/* Photography */
.sector-card{
  transition:
    transform var(--motion-base) var(--motion-ease),
    box-shadow var(--motion-base) ease!important;
}
.sector-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 50px rgba(10,18,26,.12)!important;
}
.sector-media img{
  transition:transform 620ms var(--motion-ease),filter 360ms ease!important;
}
.sector-card:hover .sector-media img{
  transform:scale(1.035);
  filter:saturate(.98) contrast(1.05)!important;
}
.sector-icon{transition:transform 260ms var(--motion-ease),background-color 220ms ease}
.sector-card:hover .sector-icon{transform:translateY(-2px);background:rgba(8,12,16,.88)}

/* Content cards */
.problem-guide-grid article,
.evidence-grid article,
.distributor-points>div{
  transition:
    transform var(--motion-base) var(--motion-ease),
    box-shadow var(--motion-base) ease!important;
}
.problem-guide-grid article:hover,
.evidence-grid article:hover,
.distributor-points>div:hover{transform:translateY(-4px)}

/* Workshop */
.network-search-btn.is-searching{
  transform:translateY(1px) scale(.975);
  filter:brightness(.92);
}
.network-empty-v17,
.workshop-result-v17,
.network-context{
  animation:networkResultIn 360ms var(--motion-ease) both;
}
@keyframes networkResultIn{
  from{opacity:.001;transform:translateY(8px)}
  to{opacity:1;transform:none}
}
.network-journey-steps article{
  transition:
    transform var(--motion-base) var(--motion-ease),
    border-color var(--motion-fast) ease,
    background-color var(--motion-fast) ease;
}
.network-journey-steps article:hover{
  transform:translateY(-3px);
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.03);
}

/* Forms */
.lead-form input,
.lead-form select,
.lead-form textarea{
  transition:border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease!important;
}

/* Accessibility focus */
.catalog-filter:focus-visible,
.symptom-card:focus-visible,
.network-search-btn:focus-visible,
.interaction-ready:focus-visible{
  outline:3px solid rgba(211,13,20,.23);
  outline-offset:3px;
}

/* Top button */
.to-top{
  transition:
    opacity 220ms ease,
    transform var(--motion-base) var(--motion-ease),
    background-color var(--motion-fast) ease!important;
}
.to-top:not(.visible){transform:translateY(8px) scale(.94)}
.to-top.visible{transform:none}

/* Mobile */
@media(max-width:820px){
  .motion-ready .reveal{transform:translateY(14px);filter:none}
  .sector-card:hover,
  .problem-guide-grid article:hover,
  .product-card-v18:hover{transform:none!important}
}

/* Respect system preference */
@media(prefers-reduced-motion:reduce){
  .motion-ready .reveal,
  .motion-ready .reveal.in,
  .motion-item,
  .selection-pulse,
  .modal.motion-in .modal-product-image img,
  .modal.motion-in .modal-dossier-head,
  .modal.motion-in .modal-route-v18,
  .modal.motion-in .specs-v18,
  .modal.motion-in .protocol-block,
  .modal.motion-in .prepurchase-check,
  .modal.motion-in .modal-actions-v18,
  .network-empty-v17,
  .workshop-result-v17,
  .network-context{
    animation:none!important;
    transition:none!important;
    opacity:1!important;
    transform:none!important;
    filter:none!important;
  }
  .product-showcase.catalog-switching{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
  }
}


/* =========================================================
   V21 — RESET FIABLE DE "TODOS"
   ========================================================= */
.product-showcase[data-catalog-mode="all"]{
  min-height:0!important;
}
.product-showcase[data-catalog-mode="all"] .product-flagship{
  display:block!important;
}
.product-showcase[data-catalog-mode="all"] .product-family-grid{
  width:100%;
}
.catalog-status[data-visible-products="7"] b:after{
  content:" · gama completa";
  color:#8b949b;
  font-weight:700;
}


/* =========================================================
   V22 — RESPONSIVE QA / PRODUCTION PASS
   Desktop large · laptop · tablet · mobile
   ========================================================= */

/* Defensive layout rules */
html,body{max-width:100%;overflow-x:clip}
main,section,.shell,
.header-inner,.hero-layout,.diagnostic-layout,
.product-showcase,.product-family-grid,.catalog-focus-grid,
.workshop-core,.contact-layout,.evidence-layout{
  min-width:0;
}
img{max-width:100%}
button,a,input,select,textarea{max-width:100%}

/* ---------------------------------------------------------
   1440–1599: keep premium scale without crowding
   --------------------------------------------------------- */
@media(min-width:1400px) and (max-width:1599px){
  :root{--shell:1420px}
  .shell{width:min(var(--shell),calc(100% - 48px))}
  .main-nav{gap:23px;font-size:11.5px}
  .brand{width:170px}
  .brand img{width:168px}
  .hero h1{font-size:clamp(66px,5.05vw,82px)}
  .hero-lead{max-width:610px}
  .diagnostic-layout{grid-template-columns:minmax(410px,.8fr) minmax(610px,1.2fr);gap:28px}
  .premium-flagship .flagship-copy h3{font-size:80px!important}
  .premium-flagship .flagship-visual img{height:470px!important}
}

/* ---------------------------------------------------------
   1121–1399: laptop
   --------------------------------------------------------- */
@media(min-width:1121px) and (max-width:1399px){
  :root{--shell:1320px}
  .shell{width:min(var(--shell),calc(100% - 40px))}
  .header-inner{gap:24px}
  .brand{width:154px;height:58px}
  .brand img{width:151px}
  .main-nav{gap:17px;font-size:10.5px}
  .main-nav>a{padding-left:0;padding-right:0}
  .main-nav>a.external-shop{padding-left:13px!important;padding-right:13px!important}
  .hero,.hero-layout{min-height:650px}
  .hero-layout{grid-template-columns:minmax(510px,620px) 1fr}
  .hero-copy{padding-top:60px;padding-bottom:50px}
  .hero h1{font-size:clamp(60px,5.2vw,75px)}
  .hero-method{font-size:30px}
  .hero-lead{font-size:14px;max-width:570px}
  .hero-proof{max-width:640px;gap:14px}
  .method-inner{
    grid-template-columns:150px 1fr 24px 1fr 24px 1fr!important;
    gap:14px!important;
  }
  .method-step{grid-template-columns:30px 48px 1fr!important;gap:9px!important}
  .method-step svg{width:44px!important;height:44px!important}
  .diagnostic-layout{
    grid-template-columns:minmax(390px,.78fr) minmax(590px,1.22fr)!important;
    gap:24px!important;
  }
  .symptom-panel{padding:18px!important}
  .symptom-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .symptom-card{min-height:132px!important}
  .recommendation-main-v16{grid-template-columns:220px minmax(0,1fr)!important}
  .recommendation-copy{padding-right:26px!important}
  .recommendation-copy h3{font-size:47px!important}
  .product-family-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .premium-product-body{grid-template-columns:112px 1fr!important;padding:12px!important}
  .premium-product-card .product-bottle img{height:175px!important}
  .premium-product-card .product-copy h3{font-size:25px!important}
  .catalog-focus-card{grid-template-columns:minmax(480px,1fr) 390px!important}
  .catalog-focus-copy{padding-left:42px!important}
  .workshop-core{grid-template-columns:minmax(0,1.35fr) minmax(285px,.65fr)!important}
  .network-sidecard{padding:23px!important}
}

/* ---------------------------------------------------------
   <=1120: navigation becomes mobile before it starts wrapping
   --------------------------------------------------------- */
@media(max-width:1120px){
  :root{--header:72px}
  .shell{width:min(var(--shell),calc(100% - 32px))}
  .header-inner{height:var(--header)!important;gap:16px}
  .brand{width:144px!important;height:58px!important}
  .brand img{width:140px!important;max-height:58px!important}

  .nav-toggle{
    display:block!important;
    margin-left:auto;
    width:44px;
    height:44px;
    border-radius:9px;
    position:relative;
    z-index:3;
  }
  .main-nav{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    top:calc(100% + 8px)!important;
    margin:0!important;
    padding:10px!important;
    display:none!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    border:1px solid #dde1e4;
    border-radius:14px;
    background:rgba(255,255,255,.985);
    box-shadow:0 22px 60px rgba(8,15,22,.16);
    backdrop-filter:blur(16px);
  }
  .main-nav.open{display:flex!important}
  .main-nav>a{
    width:100%;
    min-height:44px;
    display:flex!important;
    align-items:center;
    padding:11px 12px!important;
    border-radius:8px;
    font-size:12px;
  }
  .main-nav>a:hover{background:#f4f5f5}
  .main-nav>a:after{display:none!important}
  .main-nav>a.external-shop{
    min-height:46px;
    margin-top:6px!important;
    justify-content:space-between!important;
    padding:11px 13px!important;
  }

  .hero,.hero-layout{min-height:640px}
  .hero-layout{grid-template-columns:1fr!important}
  .hero-copy{max-width:620px;padding:62px 0 48px!important}
  .hero h1{font-size:clamp(58px,7vw,76px)!important}
  .hero-lead{max-width:570px}
  .hero-proof{max-width:620px}
  .hero-media{background-position:72% center}

  .method-inner{
    min-height:auto!important;
    grid-template-columns:140px repeat(3,minmax(0,1fr))!important;
    gap:14px!important;
    padding:22px 0!important;
  }
  .method-arrow{display:none!important}
  .method-title{align-self:center}
  .method-step{
    min-width:0;
    grid-template-columns:30px 42px 1fr!important;
    gap:8px!important;
  }
  .method-step svg{width:40px!important;height:40px!important}
  .method-step p{font-size:9.5px!important;max-width:none!important}

  .diagnostic-layout{grid-template-columns:1fr!important;gap:18px!important}
  .symptom-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .symptom-card{min-height:124px!important}
  .diagnostic-result{position:relative!important;top:auto!important;min-height:0!important}
  .recommendation-main-v16{grid-template-columns:260px minmax(0,1fr)!important}
  .recommendation-visual{min-height:500px!important}
  .recommendation-visual img{height:405px!important}
  .recommendation-copy{padding:28px!important}

  .catalog-entry{grid-template-columns:1fr!important}
  .catalog-entry-copy{max-width:620px}
  .catalog-filters{
    width:100%;
    overflow-x:auto;
    flex-wrap:nowrap!important;
    padding-bottom:5px;
    scrollbar-width:thin;
  }
  .catalog-filter{flex:0 0 auto}
  .catalog-diagnosis-link{max-width:350px}
  .product-family-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .premium-flagship{grid-template-columns:minmax(0,1fr) 390px!important}
  .premium-flagship .flagship-copy{padding-left:38px!important;padding-right:22px!important}
  .premium-flagship .flagship-copy h3{font-size:70px!important}
  .premium-flagship .flagship-visual{min-height:500px!important}
  .premium-flagship .flagship-visual img{height:445px!important}

  .catalog-focus-card{grid-template-columns:minmax(0,1fr) 360px!important}
  .catalog-focus-copy{padding:38px!important}
  .catalog-focus-card h3{font-size:62px!important}
  .catalog-focus-visual{min-height:480px!important}
  .catalog-focus-visual img{height:420px!important}

  .evidence-layout{grid-template-columns:1fr!important;gap:26px!important}
  .evidence-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  .sector-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  .workshop-intro{grid-template-columns:1fr!important;gap:22px!important}
  .network-trust{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .workshop-core{grid-template-columns:1fr!important}
  .network-sidecard{min-height:auto!important}
  .network-request-generic{margin-top:22px!important}
  .workshop-join-v17{grid-template-columns:1fr 1fr!important}
  .workshop-join-v17>.btn{grid-column:1/-1;justify-self:start}

  .contact-layout{grid-template-columns:1fr!important;gap:28px!important}
}

/* ---------------------------------------------------------
   821–960: tablet landscape / small laptop
   --------------------------------------------------------- */
@media(min-width:821px) and (max-width:960px){
  .hero-media{
    background-image:url('assets/hero/hero-motor-mobile.webp')!important;
    background-position:68% center!important;
  }
  .hero-shade{
    background:linear-gradient(90deg,rgba(5,7,9,.97),rgba(5,7,9,.82) 54%,rgba(5,7,9,.30))!important;
  }
  .hero-copy{max-width:590px}
  .hero h1{font-size:66px!important}
  .symptom-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .diagnostic-journey{
    grid-template-columns:1fr 18px 1fr 18px 1fr!important;
    gap:7px!important;
  }
  .diagnostic-journey>div{grid-template-columns:36px 1fr!important;column-gap:8px!important}
  .diagnostic-journey span{width:36px!important;height:36px!important}
  .recommendation-main-v16{grid-template-columns:230px minmax(0,1fr)!important}
  .recommendation-copy h3{font-size:44px!important}
}

/* ---------------------------------------------------------
   <=820: tablet portrait
   --------------------------------------------------------- */
@media(max-width:820px){
  :root{--header:68px}
  .shell{width:calc(100% - 28px)!important}
  .section{padding:74px 0!important}
  .section-heading{margin-bottom:28px!important}
  .section-heading h2,
  .diagnostic-heading h2,
  .treatments-heading h2{
    font-size:clamp(44px,8vw,58px)!important;
    line-height:.95!important;
  }
  .section-heading p{font-size:13px!important;line-height:1.62!important}

  .hero,.hero-layout{min-height:690px!important}
  .hero-media{
    background-image:url('assets/hero/hero-motor-mobile.webp')!important;
    background-position:60% center!important;
  }
  .hero-shade{
    background:linear-gradient(180deg,rgba(5,7,9,.72) 0%,rgba(5,7,9,.89) 57%,#050709 100%)!important;
  }
  .hero-layout{align-items:end!important}
  .hero-copy{padding:88px 0 38px!important;max-width:none!important}
  .hero h1{font-size:clamp(52px,11vw,68px)!important;max-width:650px}
  .hero-method{font-size:28px!important}
  .hero-lead{font-size:13px!important;line-height:1.65!important;max-width:610px}
  .hero-proof{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin-top:26px!important}
  .hero-proof>div{padding-right:7px!important}
  .hero-proof b{font-size:9px!important}
  .hero-proof small{font-size:8px!important}
  .hero-proof svg{width:23px!important;height:23px!important}

  .method-inner{
    grid-template-columns:1fr!important;
    gap:0!important;
    padding:20px 0!important;
  }
  .method-title{margin-bottom:8px;text-align:left!important}
  .method-title small{display:block!important}
  .method-step{
    min-height:76px;
    grid-template-columns:30px 42px 1fr!important;
    padding:12px 0!important;
    border-top:1px solid #252b31;
  }
  .method-step p{font-size:9.8px!important}
  .method-arrow{display:none!important}

  .diagnostic-journey{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    padding:8px!important;
  }
  .diagnostic-journey>i{display:none!important}
  .diagnostic-journey>div{
    grid-template-columns:32px 1fr!important;
    column-gap:7px!important;
    min-height:58px;
    padding:7px;
    border-radius:9px;
  }
  .diagnostic-journey span{
    width:32px!important;height:32px!important;font-size:13px!important
  }
  .diagnostic-journey b{font-size:8.5px!important}
  .diagnostic-journey small{font-size:7.5px!important}
  .symptom-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .symptom-card{min-height:120px!important}
  .recommendation-main-v16{grid-template-columns:1fr!important}
  .recommendation-visual{min-height:380px!important}
  .recommendation-visual img{height:330px!important}
  .recommendation-copy{padding:26px!important}
  .recommendation-copy h3{font-size:46px!important}
  .recommendation-facts-v16{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .recommendation-actions-v16{align-items:flex-start!important}
  .professional-recommendation.recommendation-v16{min-height:0!important}

  .premium-flagship{grid-template-columns:1fr!important}
  .premium-flagship .flagship-copy{padding:36px 28px 20px!important}
  .premium-flagship .flagship-copy h3{font-size:64px!important}
  .premium-flagship .flagship-visual{min-height:420px!important}
  .premium-flagship .flagship-visual img{height:370px!important}
  .product-decision-line{grid-template-columns:1fr!important}
  .product-decision-line>i{display:none}
  .product-family-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .premium-product-body{grid-template-columns:102px 1fr!important}
  .premium-product-card .product-bottle img{height:158px!important}
  .premium-product-card .product-copy h3{font-size:24px!important}

  .catalog-focus-card{grid-template-columns:1fr!important}
  .catalog-focus-copy{padding:32px 26px 18px!important}
  .catalog-focus-card h3{font-size:58px!important}
  .focus-decision-path{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .focus-decision-path>i{display:none!important}
  .catalog-focus-visual{min-height:410px!important}
  .catalog-focus-visual img{height:360px!important}

  .catalog-bridge{grid-template-columns:46px 1fr!important}
  .catalog-bridge>a{grid-column:2!important;justify-self:start}

  .problem-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sector-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  .network-journey-steps{grid-template-columns:1fr!important}
  .network-journey-steps>i{display:none!important}
  .network-journey-steps article{min-height:82px!important}
  .network-trust{grid-template-columns:1fr!important}
  .network-context{grid-template-columns:40px 1fr!important}
  .network-context button{grid-column:2!important;justify-self:start}
  .workshop-join-v17{grid-template-columns:1fr!important}
  .workshop-join-v17>.btn{grid-column:auto!important}

  .modal-card{
    width:min(760px,calc(100vw - 24px))!important;
    max-height:calc(100svh - 20px)!important;
  }
  .modal-treatment-v18{grid-template-columns:1fr!important;min-height:0!important}
  .modal-treatment-v18 .modal-product-image{min-height:390px!important}
  .modal-treatment-v18 .modal-product-image img{height:350px!important}
  .modal-treatment-v18 .modal-product-copy{padding:30px 28px 32px!important}
  .modal-dossier-head h2{font-size:50px!important}
  .modal-route-v18{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .modal-route-v18>i{display:none!important}
}

/* ---------------------------------------------------------
   <=620: phones
   --------------------------------------------------------- */
@media(max-width:620px){
  :root{--header:64px}
  .shell{width:calc(100% - 24px)!important}
  .site-header{backdrop-filter:blur(12px)}
  .header-inner{height:64px!important}
  .brand{width:118px!important;height:54px!important}
  .brand img{width:116px!important}
  .nav-toggle{width:42px;height:42px}
  .main-nav{left:10px!important;right:10px!important;top:calc(100% + 5px)!important}

  .section{padding:64px 0!important}
  .section-heading h2,
  .diagnostic-heading h2,
  .treatments-heading h2{
    font-size:44px!important;
  }
  .eyebrow{font-size:8.5px!important;letter-spacing:.13em!important}

  .hero,.hero-layout{min-height:700px!important}
  .hero-media{background-position:57% center!important;opacity:.76}
  .hero-shade{
    background:linear-gradient(180deg,rgba(5,7,9,.58) 0%,rgba(5,7,9,.88) 52%,#050709 100%)!important;
  }
  .hero-copy{padding:82px 0 30px!important}
  .hero h1{font-size:48px!important;line-height:.9!important}
  .hero-method{font-size:25px!important;margin:19px 0 12px!important}
  .hero-lead{font-size:12.5px!important;line-height:1.6!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important}
  .hero-actions .btn{width:100%;min-height:48px}
  .hero-proof{
    grid-template-columns:1fr!important;
    gap:0!important;
    padding-top:12px!important;
    margin-top:20px!important;
  }
  .hero-proof>div{
    min-height:47px;
    padding:7px 0!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .hero-proof>div:last-child{border-bottom:0}

  .method-title strong{font-size:27px!important}
  .method-title span{font-size:11px!important}
  .method-title small{font-size:8px!important}
  .method-step b{font-size:12px!important}

  .diagnostic{padding-top:64px!important}
  .diagnostic-assurance{padding:11px 12px!important}
  .diagnostic-journey{
    margin-bottom:12px!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
  }
  .diagnostic-journey>div{
    grid-template-columns:30px 1fr!important;
    min-height:48px!important;
  }
  .diagnostic-journey>div:not(.is-active):not(.is-done) small{display:none}
  .symptom-panel{padding:12px!important}
  .symptom-panel-head b{font-size:23px!important}
  .symptom-grid{gap:8px!important}
  .symptom-card{
    min-height:114px!important;
    padding:11px!important;
  }
  .symptom-category{font-size:6.5px!important}
  .symptom-icon{width:34px!important;height:34px!important;margin:7px 0 4px!important}
  .symptom-card b{font-size:11px!important}
  .symptom-card small{font-size:7.9px!important}
  .diagnostic-note{font-size:9px!important}
  .premium-empty{min-height:420px!important;padding:24px!important}
  .premium-empty h3{font-size:42px!important}
  .recommendation-statusbar{padding:0 12px!important;min-height:46px!important}
  .recommendation-visual{min-height:335px!important}
  .recommendation-visual img{height:292px!important}
  .visual-problem-tag{left:12px!important;right:12px!important;bottom:12px!important}
  .recommendation-copy{padding:22px!important}
  .recommendation-copy h3{font-size:42px!important}
  .recommendation-facts-v16{grid-template-columns:1fr!important}
  .recommendation-actions-v16{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%;
  }
  .recommendation-actions-v16 .btn,
  .recommendation-actions-v16 .btn-outline-shop{
    width:100%;
    min-height:46px;
  }
  .diagnosis-tools{display:flex;flex-wrap:wrap;gap:4px!important}

  .catalog-entry{padding:13px!important}
  .catalog-entry-copy>small{font-size:8px!important}
  .catalog-filters{
    margin-inline:-2px;
    padding:1px 2px 7px;
    scroll-snap-type:x proximity;
  }
  .catalog-filter{
    min-height:38px!important;
    scroll-snap-align:start;
  }
  .catalog-diagnosis-link{max-width:none!important;width:100%}
  .catalog-status{margin-top:2px}
  .premium-flagship{min-height:0!important}
  .premium-flagship .flagship-copy{padding:28px 22px 12px!important}
  .premium-flagship .flagship-copy h3{font-size:56px!important}
  .premium-flagship .flagship-copy p{font-size:11px!important}
  .premium-flagship .flagship-points{gap:5px!important}
  .premium-flagship .flagship-points span{font-size:7.5px!important;padding:6px 8px!important}
  .premium-flagship .flagship-visual{min-height:360px!important}
  .premium-flagship .flagship-visual img{height:320px!important}
  .flagship-actions{align-items:flex-start!important;flex-direction:column!important}
  .flagship-actions .btn{width:100%;min-height:46px}

  /* Todos: six family treatments visible vertically on phone */
  .product-family-grid{grid-template-columns:1fr!important;gap:10px!important}
  .premium-product-card{min-height:220px!important}
  .premium-product-body{
    grid-template-columns:94px minmax(0,1fr)!important;
    min-height:190px!important;
    padding:12px!important;
  }
  .premium-product-card .product-bottle{min-height:166px!important}
  .premium-product-card .product-bottle img{height:150px!important}
  .premium-product-card .product-copy h3{font-size:26px!important}
  .premium-product-card .product-copy p{font-size:9.2px!important}
  .product-card-route{display:none!important}
  .product-card-actions{gap:9px!important;flex-wrap:wrap}

  .catalog-focus-copy{padding:27px 21px 12px!important}
  .catalog-focus-card h3{font-size:48px!important}
  .catalog-focus-card>.catalog-focus-copy>p{font-size:10.5px!important}
  .focus-decision-path{grid-template-columns:1fr!important}
  .focus-facts{gap:5px!important}
  .focus-facts span{width:100%;justify-content:flex-start}
  .focus-actions{align-items:stretch!important;flex-direction:column!important}
  .focus-actions .btn{width:100%;min-height:46px}
  .catalog-focus-visual{min-height:350px!important}
  .catalog-focus-visual img{height:310px!important}
  .focus-visual-label{top:14px!important;right:14px!important}

  .catalog-bridge{
    grid-template-columns:1fr!important;
    padding:15px!important;
  }
  .catalog-bridge-icon{width:42px;height:42px}
  .catalog-bridge>a{
    grid-column:auto!important;
    width:100%;
    min-height:44px;
    justify-content:center;
  }

  .evidence-grid{grid-template-columns:1fr!important}
  .problem-guide-grid{grid-template-columns:1fr!important}
  .sector-grid{grid-template-columns:1fr!important}
  .sector-card{min-height:0!important}

  .workshops{padding-top:64px!important;padding-bottom:64px!important}
  .workshop-intro h2{font-size:45px!important}
  .network-journey{padding:14px!important}
  .network-journey-head{align-items:flex-start!important;flex-direction:column!important;gap:4px!important}
  .finder-v17{padding:17px!important;min-height:0!important}
  .finder-head-v17{align-items:flex-start!important;flex-direction:column!important;gap:8px!important}
  .finder-search-row{grid-template-columns:1fr!important}
  .network-search-btn{min-height:46px}
  .network-empty-v17{grid-template-columns:1fr!important;padding:16px!important}
  .network-empty-actions{align-items:stretch!important;flex-direction:column!important}
  .network-empty-actions .btn{width:100%}
  .network-sidecard{padding:20px!important}
  .network-sidecard h3{font-size:33px!important}
  .sidecard-flow{flex-wrap:wrap}
  .workshop-join-v17{padding:22px!important}
  .workshop-join-v17 h3{font-size:32px!important}
  .workshop-join-v17>.btn{width:100%;min-height:46px}

  .field-row{grid-template-columns:1fr!important}
  .lead-form .btn{width:100%;min-height:48px}
  .footer-grid{grid-template-columns:1fr 1fr!important}
  .footer-brand{grid-column:1/-1!important}
  .footer-bottom{align-items:flex-start!important;flex-direction:column!important;gap:7px!important}

  .modal-card{
    width:calc(100vw - 16px)!important;
    max-height:calc(100svh - 12px)!important;
    border-radius:14px!important;
  }
  .modal-treatment-v18 .modal-product-image{min-height:330px!important;padding:38px 18px 18px!important}
  .modal-treatment-v18 .modal-product-image img{height:292px!important}
  .modal-treatment-v18 .modal-product-copy{padding:24px 18px 26px!important}
  .modal-dossier-head h2{font-size:43px!important}
  .modal-route-v18{grid-template-columns:1fr!important}
  .specs-v18{grid-template-columns:1fr!important}
  .modal-actions-v18{align-items:stretch!important;flex-direction:column!important}
  .modal-actions-v18 .btn{width:100%;min-height:46px}
  .protocol-steps{grid-template-columns:1fr!important}
}

/* ---------------------------------------------------------
   <=390: narrow phones
   --------------------------------------------------------- */
@media(max-width:390px){
  .shell{width:calc(100% - 20px)!important}
  .hero h1{font-size:43px!important}
  .hero-method{font-size:23px!important}
  .section-heading h2,
  .diagnostic-heading h2,
  .treatments-heading h2{font-size:40px!important}
  .symptom-card{min-height:108px!important}
  .symptom-card b{font-size:10px!important}
  .premium-product-body{grid-template-columns:82px minmax(0,1fr)!important}
  .premium-product-card .product-bottle img{height:138px!important}
  .premium-product-card .product-copy h3{font-size:23px!important}
  .catalog-focus-card h3{font-size:44px!important}
  .catalog-focus-visual img{height:290px!important}
}

/* Preserve accessibility and avoid hover-only behavior on touch */
@media(hover:none){
  .sector-card:hover,
  .product-card-v18:hover,
  .catalog-focus-card:hover,
  .problem-guide-grid article:hover,
  .evidence-grid article:hover,
  .network-journey-steps article:hover{
    transform:none!important;
  }
}


/* =========================================================
   V23 — PERFORMANCE / CORE WEB VITALS
   ========================================================= */

/* Hero is a real responsive image so the browser can discover and
   prioritize the LCP resource without waiting for CSS parsing. */
.hero-media{
  overflow:hidden;
  background-image:none!important;
}
.hero-media picture,
.hero-media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.hero-media img{
  object-fit:cover;
  object-position:70% center;
}
@media(max-width:1120px){
  .hero-media img{object-position:72% center}
}
@media(max-width:960px){
  .hero-media img{object-position:68% center}
}
@media(max-width:820px){
  .hero-media img{object-position:60% center}
}
@media(max-width:620px){
  .hero-media img{object-position:57% center}
}

/* Skip rendering deep below-the-fold sections until required.
   Intrinsic size reserves scroll space and reduces initial render work. */
.problem-guide,
.treatments-premium,
.evidence,
.sectors,
.workshops,
.distributors,
.contact{
  content-visibility:auto;
  contain-intrinsic-size:auto 900px;
}

/* Dynamic images below the fold are isolated from the rest of layout. */
.product-bottle,
.flagship-visual,
.catalog-focus-visual,
.sector-media{
  contain:layout paint;
}

/* GPU promotion only where an animation is actually used. */
.product-showcase.catalog-switching,
.modal.open .modal-card{
  will-change:transform,opacity;
}
.product-showcase:not(.catalog-switching),
.modal:not(.open) .modal-card{
  will-change:auto;
}
