@font-face{font-family:Lato;src:url('../fonts/lato-v23-latin-regular1.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url('../fonts/lato-v23-latin-7001.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url('../fonts/lato-v23-latin-italic1.woff') format('woff');font-weight:400;font-style:italic;font-display:swap}
:root{--navy:#102746;--navy-deep:#0a182c;--red:#ae2a28;--ink:#172238;--muted:#687386;--cream:#f3f0ea;--paper:#fff;--line:#dfe3e8;--shadow:0 24px 60px rgba(16,39,70,.12);--max:1240px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:112px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Lato,Arial,sans-serif;line-height:1.6;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
.container{width:min(calc(100% - 48px),var(--max));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Shared navigation */
.contact-bar{height:31px;background:var(--navy-deep);color:#fff;font-size:.8rem;letter-spacing:.03em}
.contact-bar__inner{height:100%;display:flex;align-items:center;justify-content:flex-end;gap:26px}
.contact-bar a{text-decoration:none;opacity:.9;transition:opacity .2s ease}.contact-bar a:hover{opacity:1}
.nav-shell{height:90px;position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(16,39,70,.12);backdrop-filter:blur(14px)}
.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{display:block;width:250px;transition:opacity .2s ease}.brand:hover{opacity:.8}.brand img{width:100%;height:auto}
.site-nav{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.82rem;font-weight:700;letter-spacing:.08em}
.site-nav a{padding:11px 15px;border-radius:999px;text-decoration:none;transition:background .2s ease,color .2s ease}.site-nav a:hover,.site-nav a:focus-visible{background:var(--cream);color:var(--red)}
.menu-toggle{display:none;border:1px solid var(--line);border-radius:50%;background:#fff;padding:11px;cursor:pointer;box-shadow:0 8px 20px rgba(16,39,70,.08)}
.menu-toggle span:not(.sr-only){display:block;width:23px;height:2px;background:var(--navy);margin:4px 0}

/* Home hero */
.hero{min-height:650px;position:relative;display:grid;align-items:center;background:url('../images/reparacion-de-frenos.jpg') center/cover no-repeat;color:#fff;isolation:isolate}
.hero::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(6,18,35,.9) 0%,rgba(10,24,44,.7) 42%,rgba(10,24,44,.18) 100%)}
.hero::after{content:'';position:absolute;z-index:-1;right:-7vw;bottom:-110px;width:48vw;height:260px;background:var(--red);opacity:.88;transform:skewX(-22deg)}
.hero__veil{display:none}
.hero__content{position:relative;max-width:var(--max);width:min(calc(100% - 48px),var(--max));margin-inline:auto;padding:106px 0 138px}
.hero__content::before{content:'BEN-RAZ  /  FRENOS Y CLUTCH';display:block;margin-bottom:20px;color:#f6b1ad;font-size:.78rem;letter-spacing:.2em;font-weight:700}
.hero h1{max-width:750px;margin:0;font-size:clamp(3.5rem,8vw,7.5rem);line-height:.94;letter-spacing:.04em;font-weight:700}
.button{display:inline-flex;align-items:center;justify-content:center;min-width:172px;border:1px solid var(--navy);border-radius:999px;padding:12px 27px;background:var(--navy);color:#fff;font:700 .82rem/1.2 Lato,Arial,sans-serif;letter-spacing:.1em;text-decoration:none;text-transform:uppercase;cursor:pointer;transition:transform .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease}
.button::after{content:'↗';margin-left:10px;font-size:1rem;line-height:0}.button:hover,.button:focus-visible{background:var(--red);border-color:var(--red);color:#fff;transform:translateY(-2px);box-shadow:0 10px 20px rgba(174,42,40,.2)}
.button--hero{margin-top:38px;min-width:144px;background:var(--red);border-color:var(--red)}

/* Sections */
.section-pad{padding:112px 0}.section-pad--compact{padding-top:72px;padding-bottom:72px}
h2{margin:0;color:var(--red);font-size:clamp(1.8rem,3vw,3rem);line-height:1.05;text-transform:uppercase;letter-spacing:.035em}
.eyebrow{margin:0 0 17px;color:var(--red);font-size:.76rem;font-weight:700;letter-spacing:.18em}
.principles{position:relative;background:var(--navy);color:#fff;overflow:hidden}.principles::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%);pointer-events:none}
.split-section{position:relative;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);align-items:center;gap:100px}
.principles h2{color:#fff}.principles-list{margin:35px 0 0;padding:0;list-style:none;font-size:1.07rem;line-height:1.7;color:#dce4ef}
.principles-list li{margin:0 0 15px;padding-left:28px;position:relative}.principles-list li::before{content:'+';position:absolute;left:0;color:#f2a39f;font-size:1.25rem;font-weight:700}
.principles__logo{justify-self:end;max-width:420px;padding:35px;border-radius:24px;background:#fff;box-shadow:var(--shadow)}
.services{background:var(--cream)}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:45px}.section-heading h2{max-width:350px}.section-heading p{max-width:470px;margin:0;color:var(--muted);font-size:1.12rem;line-height:1.45}
.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.service-card{display:flex;flex-direction:column;min-height:395px;overflow:hidden;border:1px solid rgba(16,39,70,.1);border-radius:18px;background:#fff;text-decoration:none;box-shadow:0 12px 26px rgba(16,39,70,.06);transition:transform .25s ease,box-shadow .25s ease}
.service-card img{width:100%;height:245px;object-fit:cover;transition:transform .45s ease}.service-card span{display:flex;align-items:center;justify-content:space-between;flex:1;gap:12px;padding:22px 20px;color:var(--navy);font-size:1rem;line-height:1.32;font-weight:700}.service-card span::after{content:'↗';flex:none;color:var(--red);font-size:1.35rem}.service-card:hover{transform:translateY(-7px);box-shadow:0 22px 45px rgba(16,39,70,.14)}.service-card:hover img{transform:scale(1.06)}
.service-tagline{margin:44px 0 0;color:var(--red);font-size:.78rem;font-weight:700;letter-spacing:.24em;text-align:right}
.brands{background:var(--navy-deep);color:#fff}.brands .section-title{color:#fff}.section-title{max-width:850px;margin:0 0 35px;font-size:1.6rem;line-height:1.2}
.brand-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}.brand-grid a,.gallery a{display:flex;align-items:center;justify-content:center;min-height:96px;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.96);text-decoration:none;transition:transform .2s ease,background .2s ease}.brand-grid a:hover{transform:translateY(-4px);background:#fff}.brand-grid img{max-height:65px;width:auto;object-fit:contain}
.workshop{background:#fff}.workshop .section-title{max-width:1040px}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.gallery a{min-height:0;padding:0;aspect-ratio:1.35;overflow:hidden;border-color:var(--line);background:var(--cream)}.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.gallery a:hover img{transform:scale(1.06)}
.story{background:var(--cream)}.story__inner{max-width:1060px}.story h2{max-width:800px}.story>.container>p{max-width:830px;margin:22px 0 0;color:var(--muted);font-size:1.12rem}.story__columns{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:55px}.story__columns p{margin:0;padding-top:20px;border-top:2px solid var(--red);font-size:1rem}
.contact{background:var(--navy);color:#fff}.contact-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:90px;align-items:start}.contact-info h2{color:#fff;margin-bottom:28px}.map-link{display:block;max-width:500px;margin:0 0 25px;overflow:hidden;border-radius:14px}.map-link img{width:100%;height:154px;object-fit:cover;filter:saturate(.75)}address{font-style:normal;line-height:1.8;color:#dae3ef}.contact-info p{line-height:1.9;color:#dae3ef}.contact-info a{text-decoration:none;color:#fff}.contact-info a:hover,.contact-info a:focus-visible{color:#f5aaa6;text-decoration:underline}.contact-form{padding:34px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:#fff;color:var(--ink);box-shadow:var(--shadow)}.form-field{margin-bottom:19px}.form-field label{display:block;margin-bottom:7px;color:var(--muted);font-size:.76rem;font-weight:700;letter-spacing:.1em}.form-field input,.form-field textarea{display:block;width:100%;border:1px solid var(--line);border-radius:9px;padding:13px 14px;font:inherit;color:var(--ink);background:#f8fafc;transition:border .2s,box-shadow .2s}.form-field input:focus,.form-field textarea:focus{outline:0;border-color:var(--red);box-shadow:0 0 0 4px rgba(174,42,40,.12)}.form-field textarea{resize:vertical;min-height:124px}.honeypot{position:absolute;left:-10000px}.form-status{margin:14px 0 0;font-size:.92rem}.form-status.is-success{color:#276c3a}.form-status.is-error{color:#a32828}.contact-form .button{margin-top:4px}
.site-footer{padding:26px 0;background:var(--navy-deep);color:#fff;font-size:.78rem;letter-spacing:.08em}.site-footer .container{display:flex;align-items:center;justify-content:space-between;gap:25px}.site-footer nav{display:flex;gap:22px}.site-footer a{text-decoration:none}.site-footer a:hover{color:#f3aaa6}

/* Service pages */
.service-page{background:var(--cream)}.service-hero{position:relative;isolation:isolate;min-height:380px;padding:90px 20px 76px;display:grid;place-items:center;text-align:center;overflow:hidden;background:url('../images/reparacion-de-frenos.jpg') center/cover no-repeat;color:#fff}.service-hero::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,rgba(7,20,37,.92),rgba(16,39,70,.62))}.service-hero::after{content:'';position:absolute;right:-8vw;bottom:-140px;width:35vw;height:240px;background:var(--red);opacity:.86;transform:skewX(-25deg);z-index:-1}.service-hero h1{max-width:950px;margin:0;text-transform:uppercase;color:#fff;font-size:clamp(2.1rem,4.6vw,4.5rem);line-height:1.02;letter-spacing:.015em}.service-hero .button{margin-top:32px}.service-gallery{padding:90px 0 120px}.service-gallery .gallery{max-width:1000px;margin:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.service-gallery .gallery a{aspect-ratio:1.2;border-radius:16px;box-shadow:0 14px 28px rgba(16,39,70,.08)}

@media (max-width:1050px){.container,.hero__content{width:min(calc(100% - 40px),var(--max))}.brand{width:225px}.site-nav a{padding-inline:11px}.split-section{gap:55px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.contact-grid{gap:55px}}
@media (max-width:700px){html{scroll-padding-top:88px}.container,.hero__content{width:min(calc(100% - 32px),var(--max))}.contact-bar{height:30px;font-size:.72rem}.contact-bar__inner{justify-content:space-between;gap:10px}.nav-shell{height:72px}.brand{width:205px}.menu-toggle{display:block}.site-nav{display:none;position:absolute;top:72px;left:0;right:0;padding:12px 16px 18px;align-items:stretch;flex-direction:column;gap:3px;background:rgba(255,255,255,.98);border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(16,39,70,.12)}.site-nav.is-open{display:flex}.site-nav a{text-align:center;padding:12px}.hero{min-height:610px}.hero::after{right:-25vw;bottom:-75px;width:70vw;height:175px}.hero__content{padding:100px 0 130px}.hero__content::before{font-size:.63rem;letter-spacing:.13em}.hero h1{font-size:clamp(3.1rem,15vw,5.2rem);line-height:.97}.button--hero{margin-top:30px}.section-pad{padding:75px 0}.section-pad--compact{padding:55px 0}.split-section,.contact-grid{grid-template-columns:1fr;gap:42px}.principles__logo{justify-self:start;max-width:255px;padding:22px;order:-1}.principles-list{font-size:1rem}.section-heading{display:block;margin-bottom:30px}.section-heading p{margin-top:15px;font-size:1rem}.service-grid{grid-template-columns:1fr;gap:16px}.service-card{min-height:0}.service-card img{height:220px}.service-card span{font-size:1rem}.service-tagline{margin-top:34px;text-align:left;font-size:.68rem;letter-spacing:.16em}.brand-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.brand-grid a{min-height:76px;padding:8px}.brand-grid img{max-height:54px}.section-title{font-size:1.3rem}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.gallery a{border-radius:9px}.story>.container>p{font-size:1rem}.story__columns{grid-template-columns:1fr;gap:22px;margin-top:35px}.contact-form{padding:24px 20px}.site-footer .container{align-items:flex-start;flex-direction:column}.site-footer nav{gap:12px;flex-wrap:wrap}.service-hero{min-height:400px;padding:65px 16px 80px}.service-hero::after{right:-25vw;width:70vw}.service-gallery{padding:60px 0 80px}.service-gallery .gallery{gap:12px}.service-gallery .gallery a{border-radius:10px}}
@media (max-width:380px){.brand{width:180px}.contact-bar__inner{font-size:.66rem}.brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero h1{font-size:2.9rem}}