/*
Theme Name: Meicor SAS
Theme URI: https://meicorltda.com
Author: My PC Staff
Description: Tema ligero de una sola página para Meicor SAS (Bogotá): piezas especiales CNC, rodamientos, cadenas, reductores y acoples. SEO local, datos estructurados y formulario de cotización.
Version: 1.0.1
Requires at least: 6.3
Requires PHP: 7.4
License: Proprietary
Text Domain: meicor
*/

@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('assets/fonts/inter-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --ink:#06100A; --ink-2:#0B1A12; --ink-3:#10241A;
  --green:#0A9A47; --green-d:#077a38; --lime:#C8D82B;
  --paper:#F3F6EE; --line:rgba(255,255,255,.12);
  --txt:#E8EFE9; --muted:#9FB3A6;
  --r:28px; --wrap:1240px;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--ink);color:var(--txt);font-family:var(--font);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
.wrap{width:min(100% - 40px,var(--wrap));margin-inline:auto}
.skip{position:absolute;left:-999px;top:8px;background:var(--lime);color:#000;padding:10px 16px;border-radius:10px;z-index:100}
.skip:focus{left:8px}
.hide-sm{display:inline-flex}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px;border-radius:6px}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;border-radius:999px;font-weight:700;font-size:15px;letter-spacing:.01em;border:2px solid transparent;transition:transform .2s,background .2s,color .2s,border-color .2s;cursor:pointer;font-family:inherit}
.btn:hover{transform:translateY(-2px)}
.btn--lime{background:var(--lime);color:#0a1a0e}
.btn--lime:hover{background:#d8e84a}
.btn--ghost{border-color:rgba(255,255,255,.35);color:#fff}
.btn--ghost:hover{border-color:var(--lime);color:var(--lime)}
.btn--block{width:100%}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(6,16,10,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:28px;height:92px}
.brand{display:flex;flex:none;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}
.brand img{height:76px;width:auto}
.nav{display:flex;gap:26px;margin-left:auto;font-weight:600;font-size:15px}
.nav a{color:var(--txt);opacity:.8;transition:.2s;position:relative}
.nav a:hover{opacity:1;color:var(--lime)}
.burger{display:none;margin-left:auto;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative}
.burger span{position:absolute;left:10px;right:10px;height:2.5px;background:#fff;border-radius:2px;transition:.3s}
.burger span:first-child{top:17px}.burger span:last-child{top:26px}
.burger[aria-expanded=true] span:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:last-child{top:21px;transform:rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:calc(100svh - 92px);padding:56px 0 80px;overflow:hidden;
  background:radial-gradient(900px 520px at 85% 8%,rgba(10,154,71,.35),transparent 60%),radial-gradient(700px 500px at 0% 100%,rgba(200,216,43,.10),transparent 60%),var(--ink)}
.hero__gear{position:absolute;width:min(78vw,760px);right:-12vw;top:50%;margin-top:-340px;color:rgba(200,216,43,.13);fill:none;stroke:currentColor;stroke-width:1.4;will-change:transform;pointer-events:none}
.hero__gear path{fill:none}
.hero__gear--b{width:min(34vw,320px);right:auto;left:-6vw;top:auto;bottom:-90px;margin:0;color:rgba(10,154,71,.35)}
.hero__in{position:relative;z-index:2}
.eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:clamp(13px,1.5vw,18px);color:var(--lime)}
.eyebrow--green{color:var(--green)}
.eyebrow--dark{color:#06260f}
.hero__title{margin-top:12px}
.hero__title{position:relative;isolation:isolate}
.mega{position:relative;display:flex;font-weight:900;font-size:clamp(4.2rem,19.5vw,19rem);line-height:.88;letter-spacing:-.045em;text-transform:uppercase;user-select:none;filter:drop-shadow(0 18px 40px rgba(10,154,71,.35))}
.mega::before{content:attr(data-text);position:absolute;left:0;top:0;z-index:-1;transform:translate(.03em,.03em);color:transparent;-webkit-text-stroke:1.5px rgba(200,216,43,.32);letter-spacing:inherit;pointer-events:none}
.mega span{display:inline-block;transform:translateY(105%);opacity:0;animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards;background:linear-gradient(180deg,#fff 8%,#e4f4ea 50%,#8fd6a9 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.01em}
.mega span:nth-child(2){animation-delay:.07s}.mega span:nth-child(3){animation-delay:.14s}.mega span:nth-child(4){animation-delay:.21s}.mega span:nth-child(5){animation-delay:.28s}.mega span:nth-child(6){animation-delay:.35s}
.mega span:nth-child(3){background:linear-gradient(180deg,#e6f26a 0%,#C8D82B 55%,#7fae1d 100%);-webkit-background-clip:text;background-clip:text}
.swoosh{display:block;width:min(100%,1060px);height:auto;margin-top:6px;overflow:visible}
@keyframes rise{to{transform:none;opacity:1}}
.h1sub{display:block;margin-top:22px;font-size:clamp(1rem,1.7vw,1.4rem);font-weight:600;color:var(--muted);max-width:640px;letter-spacing:0}

.hero__grid{display:grid;grid-template-columns:minmax(300px,420px) minmax(260px,400px) 1fr;grid-template-areas:"glass lead cue";gap:28px 36px;margin-top:48px;align-items:end}
.glass{background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.16);border-radius:var(--r);padding:32px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 30px 80px -30px rgba(0,0,0,.7)}
.hero__grid .glass{grid-area:glass}
.glass__tag{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);margin-bottom:12px}
.glass__title{font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.12;letter-spacing:-.025em;font-weight:800;color:#fff}
.dots{border:0;border-top:1.5px dashed rgba(255,255,255,.25);margin:22px 0}
.glass__txt{color:var(--muted);font-size:15.5px}
.glass__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.scrollcue{grid-area:cue;justify-self:center;align-self:end;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.scrollcue svg{animation:bounce 1.6s ease-in-out infinite;color:var(--lime)}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.hero__lead{grid-area:lead;font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.5;font-weight:500;color:#fff;text-align:right;align-self:end}
.hero__lead strong{color:var(--lime)}

/* ---------- Marquee ---------- */
.marquee{background:var(--lime);color:#0a1a0e;overflow:hidden;border-block:1px solid rgba(0,0,0,.15)}
.marquee__track{display:flex;width:max-content;animation:slide 32s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__list{display:flex;flex:none}
.marquee__list li{font-weight:900;text-transform:uppercase;font-size:clamp(1.1rem,2vw,1.6rem);letter-spacing:-.01em;padding:18px 32px;white-space:nowrap;display:flex;align-items:center;gap:64px}
.marquee__list li::after{content:"";width:22px;height:22px;background:#0a1a0e;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
@keyframes slide{to{transform:translateX(-50%)}}

/* ---------- Secciones ---------- */
.sec{padding:clamp(72px,10vw,140px) 0;background:var(--paper);color:#0d1f14}
.sec--dark{background:var(--ink);color:var(--txt)}
.sec--green{background:var(--green);color:#fff}
.sec__head{max-width:880px;margin-bottom:clamp(36px,5vw,64px)}
.h2{font-size:clamp(2rem,5vw,4rem);line-height:1.02;letter-spacing:-.04em;font-weight:900;margin-top:10px}
.h2 em{font-style:normal;color:var(--green)}
.sec--dark .h2 em{color:var(--lime)}
.h2--light{color:#fff}
.sub{margin-top:16px;font-size:1.15rem;color:#47594d;max-width:640px}

/* ---------- Bento de servicios ---------- */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}
.card{grid-column:span 4;background:#fff;border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(10,26,14,.08);box-shadow:0 18px 40px -26px rgba(6,40,18,.35);transition:transform .35s,box-shadow .35s}
.card:hover{transform:translateY(-6px);box-shadow:0 30px 60px -28px rgba(6,40,18,.5)}
.card--xl{grid-column:span 8;flex-direction:row}
.card__img{background:#fff;border:3px solid var(--lime);border-radius:calc(var(--r) - 6px);margin:12px 12px 0;display:grid;place-items:center;overflow:hidden;aspect-ratio:16/10}
.card__img--dark{background:#000}
.card__img img{width:100%;height:100%;object-fit:contain;transition:transform .6s}
.card:hover .card__img img{transform:scale(1.06)}
.card--xl .card__img{flex:1.25;margin:12px 0 12px 12px;aspect-ratio:auto;min-height:260px}
.card--xl .card__body{flex:1;display:flex;flex-direction:column;justify-content:center}
.card__body{padding:20px 26px 28px}
.card h3{font-size:1.35rem;letter-spacing:-.02em;font-weight:800;line-height:1.15;color:#0a1a0e}
.card--xl h3{font-size:clamp(1.5rem,2.4vw,2rem)}
.card p{margin-top:8px;font-size:15.5px;color:#4a5d51}
.chip{display:inline-block;background:var(--green);color:#fff;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:12px}
.also{margin-top:36px;text-align:center;font-size:1.05rem;color:#47594d}

/* ---------- Sectores ---------- */
.sectors{display:grid;gap:22px}
.sector{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;background:linear-gradient(160deg,var(--ink-3),var(--ink-2));border:1px solid var(--line);border-radius:36px;padding:clamp(22px,3.5vw,48px)}
.sector--rev{grid-template-columns:1fr 1.1fr}
.sector--rev .sector__txt{order:2}
.num{font-weight:900;font-size:clamp(3rem,7vw,6rem);line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--lime);letter-spacing:-.04em}
.sector h3{font-size:clamp(1.5rem,3vw,2.4rem);line-height:1.08;letter-spacing:-.03em;font-weight:800;color:#fff;margin:10px 0 12px}
.sector p{color:var(--muted)}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.tags li{border:1px solid rgba(200,216,43,.5);color:var(--lime);font-size:13px;font-weight:600;padding:6px 14px;border-radius:999px}
.sector__img{background:#fff;border:4px solid var(--lime);border-radius:30px;overflow:hidden;display:grid;place-items:center;padding:6px}
.sector__img img{width:100%;height:auto;max-height:340px;object-fit:contain}

/* ---------- Proceso ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
.steps li{background:#fff;border-radius:var(--r);padding:30px 26px 34px;border:1px solid rgba(10,26,14,.08);position:relative;overflow:hidden}
.steps li::after{content:"";position:absolute;right:-30px;bottom:-30px;width:120px;height:120px;border-radius:50%;background:radial-gradient(var(--lime),transparent 70%);opacity:.35}
.steps span{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--green);color:#fff;font-weight:900;font-size:1.2rem;margin-bottom:22px}
.steps h3{font-size:1.2rem;letter-spacing:-.02em;font-weight:800;color:#0a1a0e}
.steps p{margin-top:8px;font-size:15.5px;color:#4a5d51}

/* ---------- Nosotros ---------- */
.about{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.about__txt .h2{margin-bottom:22px}
.about__txt p{margin-top:16px;font-size:1.1rem;color:rgba(255,255,255,.9)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.stats li{background:rgba(6,16,10,.28);border:1px solid rgba(255,255,255,.25);border-radius:var(--r);padding:26px 22px}
.stats strong{display:block;font-size:clamp(2rem,4vw,3.2rem);font-weight:900;letter-spacing:-.04em;line-height:1;color:var(--lime)}
.stats span{display:block;margin-top:8px;font-size:14.5px;color:rgba(255,255,255,.85)}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:.9fr 1.3fr;gap:clamp(24px,5vw,72px);align-items:start}
.faq .sec__head{margin:0;position:sticky;top:110px}
.faq__list{display:grid;gap:12px}
details{background:#fff;border:1px solid rgba(10,26,14,.1);border-radius:22px;padding:6px 24px}
summary{cursor:pointer;list-style:none;font-weight:700;font-size:1.08rem;padding:16px 36px 16px 0;position:relative;color:#0a1a0e}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:1.7rem;font-weight:500;color:var(--green);transition:.3s}
details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
details p{padding:0 0 18px;color:#4a5d51}

/* ---------- Contacto ---------- */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px);align-items:start}
.clist{margin:28px 0;display:grid;gap:14px}
.clist li{display:flex;flex-direction:column;border-left:3px solid var(--lime);padding-left:16px;font-size:1.1rem;font-weight:600;color:#fff}
.clist span{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.clist a:hover{color:var(--lime)}
.map{border-radius:26px;overflow:hidden;border:3px solid var(--lime);height:260px;background:#0b1a12}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(.25) contrast(1.05)}
.form{display:grid;gap:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:grid;gap:6px;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
input,textarea{font:inherit;font-size:16px;text-transform:none;letter-spacing:0;font-weight:500;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:14px;padding:14px 16px;width:100%;transition:.2s}
input:focus,textarea:focus{outline:none;border-color:var(--lime);background:rgba(255,255,255,.1)}
::placeholder{color:rgba(255,255,255,.4)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.notice{padding:12px 16px;border-radius:12px;font-weight:600;font-size:15px}
.notice--ok{background:rgba(10,154,71,.25);border:1px solid var(--green)}
.notice--err{background:rgba(220,60,60,.2);border:1px solid #d44}

/* ---------- Footer ---------- */
.site-footer{background:#030a06;border-top:1px solid var(--line);padding-top:56px}
.foot{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px}
.foot__logo{width:250px;height:auto;margin-bottom:12px}
.foot__h{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--lime);margin-bottom:12px}
.foot p,.foot li{color:var(--muted);font-size:15px}
.foot a:hover{color:var(--lime)}
.foot__list{display:grid;gap:6px}
.muted{color:var(--muted)}
.legal{margin-top:44px;padding:22px 0 30px;border-top:1px solid var(--line);font-size:13.5px;color:#6f8577}
.wa-float{position:fixed;right:20px;bottom:20px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px -8px rgba(37,211,102,.7);transition:transform .2s}
.wa-float:hover{transform:scale(1.08)}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .hero__grid{grid-template-columns:1fr 1fr;grid-template-areas:"glass glass" "lead lead" "cue cue"}
  .hero__lead{text-align:left}
  .card{grid-column:span 6}.card--xl{grid-column:span 12}
  .steps{grid-template-columns:1fr 1fr}
  .about,.contact,.faq{grid-template-columns:1fr}
  .faq .sec__head{position:static}
}
@media (max-width:820px){
  .hide-sm{display:none}
  .burger{display:block}
  .nav{position:fixed;inset:76px 0 auto 0;background:rgba(6,16,10,.97);flex-direction:column;gap:0;padding:8px 20px 24px;margin:0;border-bottom:1px solid var(--line);transform:translateY(-130%);transition:transform .35s;max-height:calc(100svh - 76px);overflow:auto}
  .nav.open{transform:none}
  .nav a{padding:16px 0;border-bottom:1px solid var(--line);font-size:18px}
  .sector,.sector--rev{grid-template-columns:1fr}
  .sector--rev .sector__txt{order:0}
}
@media (max-width:640px){
  body{font-size:16px}
  .hero{padding-top:36px}
  .hero__grid{grid-template-columns:1fr;grid-template-areas:"glass" "lead" "cue"}
  .glass{padding:24px}
  .card,.card--xl{grid-column:span 12}
  .card--xl{flex-direction:column}
  .card--xl .card__img{margin:12px 12px 0;min-height:0;aspect-ratio:16/10;flex:none}
  .steps,.row,.stats,.foot{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .brand img{height:52px}
  .bar{height:76px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .mega span,.reveal{opacity:1!important;transform:none!important}
}

/* ---------- Escenario 3D del banner ---------- */
.stage{position:absolute;z-index:3;right:calc((100% - 100vw)/2 + 1.2vw);top:300px;width:min(24vw,380px);height:min(78vh,600px);perspective:1100px;pointer-events:none}
.stage__glow{position:absolute;left:50%;top:48%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(200,216,43,.28),rgba(10,154,71,.18) 45%,transparent 72%);filter:blur(10px)}
.stage__ring{position:absolute;left:50%;top:48%;border-radius:50%;border:1.5px solid rgba(200,216,43,.5);transform:translate(-50%,-50%) rotateX(68deg)}
.stage__ring--1{width:92%;aspect-ratio:1;animation:spinRing 18s linear infinite}
.stage__ring--2{width:68%;aspect-ratio:1;border-color:rgba(10,154,71,.7);border-width:3px;animation:spinRing 12s linear infinite reverse}
@keyframes spinRing{from{transform:translate(-50%,-50%) rotateX(68deg) rotateZ(0)}to{transform:translate(-50%,-50%) rotateX(68deg) rotateZ(360deg)}}
.stage__tilt{position:absolute;inset:0;display:grid;place-items:center;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,-16deg));transition:transform .25s ease-out;animation:floaty 6s ease-in-out infinite}
@keyframes floaty{0%,100%{translate:0 -8px}50%{translate:0 10px}}
.piece{height:min(70vh,560px);width:auto;max-width:none;transform:rotate(16deg) translateZ(60px);filter:drop-shadow(0 30px 28px rgba(0,0,0,.6)) drop-shadow(0 0 22px rgba(200,216,43,.28)) contrast(1.08) saturate(1.05)}
.stage__shadow{position:absolute;left:50%;bottom:2%;width:62%;height:7%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(0,0,0,.65),transparent);filter:blur(6px)}
@media (max-width:1024px){
  .stage{position:relative;right:auto;top:auto;width:min(86vw,360px);height:430px;margin:8px auto 0}
  .piece{height:380px}
}
@media (prefers-reduced-motion:reduce){.stage__tilt,.stage__ring{animation:none!important}}
@media (min-width:1025px){.hero{min-height:max(calc(100svh - 92px),900px)}.scrollcue{display:none}.hero__lead{text-align:left}}

/* ---------- Bronce y cobre ---------- */
.sec--cream{background:#F5EEE3;color:#1d1710}
.sec--cream .h2 em{color:#B4632B}
.sec--cream .sub{color:#5a4a3a}
.bz{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(20px,3vw,40px);margin-top:12px}
.bz__main,.bz__side{border-radius:32px;padding:clamp(24px,3.4vw,44px)}
.bz__main{background:#fff;border:1px solid rgba(120,80,40,.15)}
.bz__main h3,.bz__side h3,.bz__title{font-size:clamp(1.25rem,2.2vw,1.7rem);font-weight:800;letter-spacing:-.02em}
.bz__h3b{margin-top:34px}
.bz__list{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.bz__list li{background:linear-gradient(180deg,#f7e6d2,#eccaa4);color:#5a2d0e;font-weight:700;font-size:14px;padding:8px 16px;border-radius:999px;border:1px solid rgba(180,99,43,.35)}
.bz__ticks{display:grid;gap:14px;margin-top:18px}
.bz__ticks li{position:relative;padding-left:34px;color:#4a3d30}
.bz__ticks li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.bz__ticks b{color:#1d1710}
.bz__side{background:linear-gradient(160deg,#1c130a,#0b0805);color:#f3e6d6;display:flex;flex-direction:column;align-items:flex-start;gap:14px;border:1px solid rgba(180,99,43,.4)}
.bz__side h3{color:#fff}
.bz__side ul{display:grid;gap:10px;color:#d9c6b0}
.bz__side li{padding-left:18px;position:relative}
.bz__side li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--lime)}
.bushing{width:150px;aspect-ratio:1;border-radius:50%;margin:0 0 6px;position:relative;background:conic-gradient(from 20deg,#f2c58a,#b4632B,#7a3d17,#e7a964,#b4632B,#f6d4a3,#8a4a1e,#f2c58a);box-shadow:0 20px 40px rgba(0,0,0,.5),inset 0 0 0 6px rgba(255,255,255,.12);animation:spinSlow 40s linear infinite}
.bushing span{position:absolute;inset:34%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2a1a0d,#080503);box-shadow:inset 0 4px 10px #000,0 0 0 5px rgba(246,212,163,.55)}
@keyframes spinSlow{to{transform:rotate(360deg)}}
.bz__title{margin:clamp(40px,6vw,72px) 0 18px}
.alloys{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.alloy{background:#fff;border:1px solid rgba(120,80,40,.15);border-radius:26px;padding:26px 24px 28px;position:relative;overflow:hidden}
.alloy h4{font-size:1.15rem;font-weight:800;letter-spacing:-.02em;margin-top:16px}
.alloy__ref{font-weight:800;color:#B4632B;font-size:13.5px;letter-spacing:.06em;margin:6px 0 8px}
.alloy p:last-child{color:#5a4a3a;font-size:15px}
.alloy__sw{display:block;width:54px;height:54px;border-radius:16px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.alloy__sw--1{background:linear-gradient(135deg,#f5c78e,#c47a35 55%,#8a4a1e)}
.alloy__sw--2{background:linear-gradient(135deg,#e8b074,#a8632b 55%,#6b3716)}
.alloy__sw--3{background:linear-gradient(135deg,#f7dc8a,#d6a62e 55%,#9a7316)}
.alloy__sw--4{background:linear-gradient(135deg,#d9b48d,#9c6a43 55%,#5f3b22)}
.copper{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(20px,3vw,44px);align-items:center;margin-top:22px;padding:clamp(26px,4vw,48px);border-radius:34px;background:linear-gradient(135deg,#d9783a,#b4632B 45%,#7d3d17);color:#fff}
.copper .eyebrow{color:#ffe3c2}
.copper h3{font-size:clamp(1.5rem,3vw,2.3rem);font-weight:900;letter-spacing:-.03em;line-height:1.05;margin:8px 0 12px}
.copper p{color:#ffeedd}
.copper__pts{display:grid;gap:12px}
.copper__pts li{background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:16px 20px}
.copper__pts b{display:block;font-size:1.05rem}
.copper__pts span{color:#ffe9d3;font-size:14.5px}
.bz__cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:22px;padding:22px 28px;border-radius:999px;background:#fff;border:2px solid var(--lime)}
.bz__cta p{max-width:720px}
@media (max-width:1024px){.alloys{grid-template-columns:1fr 1fr}.bz{grid-template-columns:1fr}.copper{grid-template-columns:1fr}}
@media (max-width:640px){.alloys{grid-template-columns:1fr}.bz__cta{border-radius:28px}}
@media (prefers-reduced-motion:reduce){.bushing{animation:none}}

/* Bronce y cobre: fotos */
.bz__photo{margin:0 0 18px;border-radius:24px;overflow:hidden;border:2px solid var(--lime,#c6f432);box-shadow:0 20px 40px rgba(0,0,0,.35)}
.bz__photo img,.bz__gallery img,.copper__photo img{display:block;width:100%;height:100%;object-fit:cover}
.bz__photo img{aspect-ratio:4/3}
.bz__gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0 8px}
.bz__gallery figure{position:relative;margin:0;border-radius:22px;overflow:hidden;border:2px solid var(--lime,#c6f432);aspect-ratio:4/3;background:#0b1a12}
.bz__gallery figcaption{position:absolute;left:10px;bottom:10px;padding:6px 12px;border-radius:999px;background:rgba(8,24,16,.82);color:#fff;font-weight:700;font-size:.82rem}
.copper__photo{grid-column:1/-1;margin:0;border-radius:24px;overflow:hidden;aspect-ratio:21/8}
@media (max-width:1024px){.bz__gallery{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.bz__gallery{gap:10px}.copper__photo{aspect-ratio:16/9}}
