/* ============================================================
   Autoescuela Conreria — bespoke build.
   Concept: "La escuela de la L" — the Spanish learner plate
   (white L on green) IS their brand, down to the shop shutters.
   Palette sampled from their real assets:
   logo green #015700 · shutter green #138f37 · awning yellow #ebd83e
   Type: Michroma (display, echoes the CONRERIA wordmark) + Asap (body).
   ============================================================ */

/* ---------- self-hosted fonts ---------- */
@font-face{
  font-family:'Michroma';
  src:url('fonts/michroma-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Asap';
  src:url('fonts/asap-var.woff2') format('woff2-variations');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Asap';
  src:url('fonts/asap-var-italic.woff2') format('woff2');
  font-weight:400;font-style:italic;font-display:swap;
}

/* ---------- house tokens (all sizing/spacing/motion from here) ---------- */
:root{
  /* colour */
  --verde-l:#147b28;        /* their logo + site green */
  --verde-oscuro:#0c6018;   /* deepened field for large surfaces */
  --verde-persiana:#138f37; /* shutter green — hover/accent */
  --amarillo-toldo:#ebd83e; /* awning yellow — keylines only */
  --papel:#f7f8f4;
  --papel-2:#eef1e9;
  --tinta:#14210f;
  --tinta-suave:#47543f;
  --blanco:#ffffff;
  --linea:#d9dfd2;
  --ok:color-mix(in srgb, var(--verde-persiana) 80%, var(--tinta));
  --focus:var(--amarillo-toldo);

  /* type scale — ratio ~1.28, fluid */
  --t-0:clamp(.78rem,.72rem + .2vw,.86rem);
  --t-1:clamp(.95rem,.9rem + .25vw,1.05rem);
  --t-2:clamp(1.08rem,1rem + .4vw,1.28rem);
  --t-3:clamp(1.3rem,1.15rem + .8vw,1.7rem);
  --t-4:clamp(1.6rem,1.3rem + 1.6vw,2.3rem);
  --t-5:clamp(2rem,1.5rem + 2.8vw,3.2rem);
  --t-6:clamp(2.5rem,1.8rem + 4.6vw,4.4rem);

  /* space scale (4px base) */
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem;
  --s-5:1.5rem; --s-6:2rem;  --s-7:3rem;   --s-8:4.5rem;
  --s-9:clamp(4rem,4rem + 4vw,7.5rem);

  /* motion */
  --ease:cubic-bezier(.22,.75,.25,1);
  --ease-park:cubic-bezier(.34,1.35,.45,1);  /* the L "parking" settle */
  --dur-1:240ms;
  --dur-2:480ms;
  --dur-3:900ms;

  /* shape */
  --r-1:4px;
  --r-2:14px;
  --sombra-1:0 1px 3px rgba(20,33,15,.10);
  --sombra-2:0 14px 40px -12px rgba(1,67,10,.28);

  --maxw:1160px;
  --display:'Michroma','Trebuchet MS',sans-serif;
  --body:'Asap','Segoe UI',sans-serif;
}

/* ---------- base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--papel);color:var(--tinta);
  font-family:var(--body);font-size:var(--t-1);line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
p{margin:0 0 var(--s-4);text-wrap:pretty}
h1,h2,h3,h4{margin:0;line-height:1.12;text-wrap:balance}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:var(--r-1)}
::selection{background:var(--amarillo-toldo);color:var(--tinta)}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--s-5)}
.section{padding:var(--s-9) 0}
.section--tight{padding:var(--s-8) 0}

/* display voice */
.display{font-family:var(--display);font-weight:400;letter-spacing:.01em}
.eyebrow{
  display:inline-flex;align-items:center;gap:var(--s-3);
  font-family:var(--display);font-size:var(--t-0);letter-spacing:.14em;
  text-transform:uppercase;color:var(--verde-l);margin-bottom:var(--s-4);
}
.eyebrow::before{
  content:"";width:.7em;height:.7em;border-left:3px solid var(--verde-l);
  border-bottom:3px solid var(--verde-l); /* the little L */
}
.on-dark .eyebrow{color:var(--amarillo-toldo)}
.on-dark .eyebrow::before{border-color:var(--amarillo-toldo)}
h2{font-family:var(--display);font-size:var(--t-4);color:var(--verde-oscuro)}
h3{font-family:var(--body);font-weight:700;font-size:var(--t-3)}
.lead{font-size:var(--t-2);color:var(--tinta-suave);max-width:62ch}

/* ---------- L-plate mark ---------- */
.l-plate{
  display:inline-grid;place-items:center;background:var(--verde-l);
  border-radius:var(--r-1);aspect-ratio:1;
}
.l-plate svg{width:62%;height:auto;display:block}

/* ---------- L-corner bracket (signature frame) ---------- */
.l-frame{position:relative}
.l-frame::after{
  content:"";position:absolute;left:calc(-1*var(--s-2));bottom:calc(-1*var(--s-2));
  width:var(--s-7);height:var(--s-7);pointer-events:none;
  border-left:6px solid var(--verde-l);border-bottom:6px solid var(--verde-l);
  transition:border-color var(--dur-1) var(--ease);
}
.on-dark .l-frame::after{border-color:var(--blanco)}
.l-frame--amarillo::after{border-color:var(--amarillo-toldo)}

/* ============================================================
   header — white fascia over the awning keyline (their storefront)
   ============================================================ */
.header{
  position:sticky;top:0;z-index:50;background:var(--blanco);
  border-bottom:4px solid var(--amarillo-toldo);
  box-shadow:var(--sombra-1);
}
.header-in{
  display:flex;align-items:center;gap:var(--s-5);
  padding:var(--s-3) var(--s-5);max-width:var(--maxw);margin:0 auto;
}
.brand{display:flex;align-items:center;gap:var(--s-3);min-width:0}
.brand .l-plate{width:2.4rem;flex:none}
.brand-name{display:flex;flex-direction:column;line-height:1.05}
.brand-name .b1{font-family:var(--body);font-weight:600;font-size:var(--t-0);letter-spacing:.06em;color:var(--tinta-suave)}
.brand-name .b2{font-family:var(--display);font-size:var(--t-2);color:var(--verde-l);letter-spacing:.03em}
.nav{margin-left:auto;display:flex;align-items:center;gap:var(--s-2)}
.nav a{
  padding:var(--s-2) var(--s-3);border-radius:var(--r-1);
  font-weight:600;font-size:var(--t-1);color:var(--tinta);
  transition:background var(--dur-1) var(--ease),color var(--dur-1) var(--ease);
}
.nav a:hover{background:var(--papel-2)}
.nav a[aria-current="page"]{color:var(--verde-l);box-shadow:inset 0 -3px 0 var(--verde-l)}
.nav .cta{background:var(--verde-l);color:var(--blanco)}
.nav .cta:hover{background:var(--verde-persiana)}
.nav .cta[aria-current="page"]{color:var(--blanco);background:var(--verde-persiana);box-shadow:inset 0 -3px 0 var(--amarillo-toldo)}
.lang{display:flex;gap:2px;margin-left:var(--s-2);border:1px solid var(--linea);border-radius:var(--r-1);padding:2px}
.lang button{
  border:0;background:transparent;font:inherit;font-weight:700;font-size:var(--t-0);
  padding:.2rem .5rem;border-radius:3px;cursor:pointer;color:var(--tinta-suave);
}
.lang button[aria-pressed="true"]{background:var(--verde-l);color:var(--blanco)}
.nav-toggle{
  display:none;margin-left:auto;border:1px solid var(--linea);background:var(--blanco);
  border-radius:var(--r-1);padding:var(--s-2) var(--s-3);font:inherit;font-weight:700;cursor:pointer;
}
@media (max-width:920px){
  .nav-toggle{display:block}
  .nav{
    display:none;position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;background:var(--blanco);
    border-bottom:4px solid var(--amarillo-toldo);padding:var(--s-3) var(--s-5) var(--s-5);
    box-shadow:var(--sombra-2);
  }
  .nav.open{display:flex}
  .lang{margin:var(--s-3) 0 0}
}

/* ============================================================
   hero — the L parks in on the green field
   ============================================================ */
.hero{
  background:
    radial-gradient(120% 90% at 85% -10%, color-mix(in srgb,var(--verde-persiana) 30%, var(--verde-oscuro)) 0%, transparent 60%),
    var(--verde-oscuro);
  color:var(--blanco);overflow:clip;
}
.hero-in{
  display:grid;grid-template-columns:1.25fr .75fr;gap:var(--s-7);
  align-items:center;padding-top:var(--s-9);padding-bottom:var(--s-9);
}
.hero h1{font-family:var(--display);font-size:var(--t-6);color:var(--blanco)}
.hero .sub{font-size:var(--t-2);color:color-mix(in srgb,var(--blanco) 82%,var(--verde-persiana));max-width:48ch;margin-top:var(--s-5)}
.hero .since{
  display:inline-flex;align-items:center;gap:var(--s-3);margin-bottom:var(--s-5);
  font-family:var(--display);font-size:var(--t-0);letter-spacing:.14em;text-transform:uppercase;
  color:var(--amarillo-toldo);
}
.hero .since::before{content:"";width:2.4rem;height:4px;background:var(--amarillo-toldo)}
.hero-plate{
  justify-self:center;width:min(100%,300px);
  background:var(--verde-l);border:6px solid var(--blanco);border-radius:var(--r-2);
  box-shadow:var(--sombra-2);padding:14%;
}
.hero-plate svg{width:100%;height:auto;display:block}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s-4);margin-top:var(--s-6)}
.btn{
  display:inline-flex;align-items:center;gap:var(--s-2);
  padding:var(--s-3) var(--s-6);border-radius:var(--r-1);
  font-weight:700;font-size:var(--t-1);
  transition:background var(--dur-1) var(--ease),transform var(--dur-1) var(--ease);
}
.btn:active{transform:translateY(1px)}
.btn--amarillo{background:var(--amarillo-toldo);color:var(--tinta)}
.btn--amarillo:hover{background:color-mix(in srgb,var(--amarillo-toldo) 84%,var(--blanco))}
.btn--borde{border:2px solid color-mix(in srgb,var(--blanco) 50%,transparent);color:var(--blanco)}
.btn--borde:hover{border-color:var(--blanco);background:rgba(255,255,255,.08)}
.btn--verde{background:var(--verde-l);color:var(--blanco)}
.btn--verde:hover{background:var(--verde-persiana)}

/* hero load sequence */
@media (prefers-reduced-motion:no-preference){
  .hero .rise{opacity:0;transform:translateY(26px);animation:rise var(--dur-2) var(--ease) forwards}
  .hero .rise:nth-child(2){animation-delay:120ms}
  .hero .rise:nth-child(3){animation-delay:240ms}
  .hero .rise:nth-child(4){animation-delay:360ms}
  .hero-plate{opacity:0;transform:translateX(70px) rotate(4deg);animation:park var(--dur-3) var(--ease-park) 250ms forwards}
  @keyframes rise{to{opacity:1;transform:none}}
  @keyframes park{60%{opacity:1}to{opacity:1;transform:none}}
}

/* rating chip */
.rating{
  display:inline-flex;align-items:center;gap:var(--s-3);margin-top:var(--s-6);
  color:color-mix(in srgb,var(--blanco) 85%,transparent);font-weight:600;font-size:var(--t-1);
}
.rating .stars{color:var(--amarillo-toldo);letter-spacing:.1em}
.rating a{text-decoration:underline;text-underline-offset:3px}

/* ============================================================
   scroll reveals (staggered)
   ============================================================ */
.reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:no-preference){
  .js .reveal{opacity:0;transform:translateY(24px);transition:opacity var(--dur-2) var(--ease),transform var(--dur-2) var(--ease)}
  .js .reveal.in{opacity:1;transform:none}
}

/* ============================================================
   permit "placas"
   ============================================================ */
.placas{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--s-5)}
.placa{
  position:relative;background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--r-2);overflow:hidden;box-shadow:var(--sombra-1);
  transition:transform var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease);
  display:flex;flex-direction:column;
}
.placa:hover{transform:translateY(-5px);box-shadow:var(--sombra-2)}
.placa .foto{aspect-ratio:16/10;overflow:hidden;background:var(--papel-2)}
.placa .foto img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-2) var(--ease)}
.placa:hover .foto img{transform:scale(1.04)}
.placa .cuerpo{padding:var(--s-5);display:flex;flex-direction:column;gap:var(--s-2);flex:1}
.placa .letra{
  position:absolute;top:var(--s-4);left:var(--s-4);
  background:var(--verde-l);color:var(--blanco);
  font-family:var(--display);font-size:var(--t-3);line-height:1;
  padding:var(--s-2) var(--s-3);border-radius:var(--r-1);border:2px solid var(--blanco);
  transition:background var(--dur-1) var(--ease);
}
.placa:hover .letra{background:var(--verde-persiana)}
.placa .edad{font-weight:700;color:var(--verde-l);font-size:var(--t-0);text-transform:uppercase;letter-spacing:.08em}
.placa h3{font-size:var(--t-2)}
.placa p{color:var(--tinta-suave);font-size:var(--t-1);margin:0}
.placa .mas{margin-top:auto;font-weight:700;color:var(--verde-l)}
.placa .mas::after{content:" →"}

/* permit detail rows (permisos.html) */
.permiso{
  display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s-7);
  align-items:start;padding:var(--s-8) 0;border-top:1px solid var(--linea);
}
.permiso:first-of-type{border-top:0}
.permiso .letra-grande{
  font-family:var(--display);font-size:var(--t-5);color:var(--blanco);
  background:var(--verde-l);display:inline-block;line-height:1;
  padding:var(--s-3) var(--s-4);border-radius:var(--r-1);margin-bottom:var(--s-4);
}
.permiso h4{font-family:var(--body);font-weight:700;font-size:var(--t-1);color:var(--verde-l);
  text-transform:uppercase;letter-spacing:.08em;margin:var(--s-5) 0 var(--s-2)}
.permiso ul{display:grid;gap:var(--s-2)}
.permiso li{padding-left:var(--s-5);position:relative;color:var(--tinta-suave)}
.permiso li::before{
  content:"";position:absolute;left:0;top:.5em;width:.55em;height:.55em;
  border-left:3px solid var(--verde-persiana);border-bottom:3px solid var(--verde-persiana);
}
.permiso li strong{color:var(--tinta)}
.permiso .nota{
  margin-top:var(--s-4);padding:var(--s-4) var(--s-5);
  background:var(--papel-2);border-left:4px solid var(--amarillo-toldo);border-radius:var(--r-1);
  font-style:italic;color:var(--tinta-suave);
}
.permiso .fotos{display:grid;gap:var(--s-5)}
.permiso .fotos figure{margin:0}
.permiso .fotos img{border-radius:var(--r-2);width:100%;box-shadow:var(--sombra-1)}
.permiso .fotos .chica{max-width:320px} /* small sources stay in small slots */
.permiso .fotos figcaption{font-size:var(--t-0);color:var(--tinta-suave);margin-top:var(--s-2)}
.permiso .fotos .l-frame figcaption{padding-left:var(--s-4)} /* clear the L-bracket's vertical bar */

/* ============================================================
   photo editorial (nosotros)
   ============================================================ */
.mosaico{display:grid;gap:var(--s-5);grid-template-columns:repeat(12,1fr)}
.mosaico figure{margin:0;position:relative;border-radius:var(--r-2);overflow:hidden;box-shadow:var(--sombra-1)}
.mosaico img{width:100%;height:100%;object-fit:cover}
.mosaico figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:var(--s-6) var(--s-4) var(--s-3);
  background:linear-gradient(transparent,rgba(1,67,10,.82));
  color:var(--blanco);font-weight:600;font-size:var(--t-0);letter-spacing:.04em;
}
.m-6{grid-column:span 6}.m-4{grid-column:span 4}.m-8{grid-column:span 8}.m-12{grid-column:span 12}
@media (max-width:760px){.m-6,.m-4,.m-8{grid-column:span 12}}

/* full-bleed band */
.banda{
  position:relative;min-height:52vh;overflow:hidden;display:grid;align-items:end;
}
.banda>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banda .velo{position:absolute;inset:0;background:linear-gradient(15deg,rgba(1,67,10,.78) 12%,rgba(1,67,10,.12) 60%)}
.banda .texto{position:relative;color:var(--blanco);padding:var(--s-8) 0}
.banda .texto h2{color:var(--blanco)}

/* ============================================================
   oferta
   ============================================================ */
.oferta-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--s-8);align-items:start}
.oferta-poster img{border-radius:var(--r-2);box-shadow:var(--sombra-2)}
.pack{display:grid;gap:var(--s-5)}
.pack-item{
  background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r-2);
  padding:var(--s-6);box-shadow:var(--sombra-1);
}
.pack-item h3{color:var(--verde-l);font-size:var(--t-2);margin-bottom:var(--s-2)}
.pack-precio{
  display:flex;align-items:baseline;gap:var(--s-4);
  font-family:var(--display);color:var(--verde-oscuro);
}
.pack-precio .num{font-size:var(--t-6);line-height:1}
.pack-precio .eur{font-family:var(--body);font-weight:800;font-size:.72em;vertical-align:.06em} /* Michroma's € glyph is broken — set the euro in the body face */
.pack-precio .desc{font-family:var(--body);font-weight:600;color:var(--tinta-suave);font-size:var(--t-1)}
.regalo{
  border:2px dashed var(--verde-persiana);border-radius:var(--r-2);
  padding:var(--s-5) var(--s-6);color:var(--verde-oscuro);font-weight:700;
  background:color-mix(in srgb,var(--verde-persiana) 7%,var(--blanco));
}

/* ============================================================
   alumno cards / enlaces
   ============================================================ */
.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s-5)}
.tarjeta{
  background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r-2);
  padding:var(--s-6);box-shadow:var(--sombra-1);display:flex;flex-direction:column;gap:var(--s-3);
  transition:transform var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease);
}
a.tarjeta:hover{transform:translateY(-5px);box-shadow:var(--sombra-2)}
.tarjeta .ico{
  width:2.6rem;height:2.6rem;border-radius:var(--r-1);display:grid;place-items:center;
  background:var(--verde-l);color:var(--blanco);
}
.tarjeta .ico svg{width:1.3rem;height:1.3rem}
.tarjeta h3{font-size:var(--t-2)}
.tarjeta p{color:var(--tinta-suave);margin:0;flex:1}
.tarjeta .dominio{font-size:var(--t-0);color:var(--verde-l);font-weight:700}
.marco-embed{border:1px solid var(--linea);border-radius:var(--r-2);overflow:hidden;box-shadow:var(--sombra-1);background:var(--blanco)}
.marco-embed iframe{display:block;width:100%;border:0}

/* ============================================================
   contacto
   ============================================================ */
.contacto-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-8);align-items:start}
.dato{display:flex;gap:var(--s-4);padding:var(--s-4) 0;border-bottom:1px solid var(--linea)}
.dato:last-child{border-bottom:0}
.dato .ico{flex:none;width:2.4rem;height:2.4rem;border-radius:var(--r-1);display:grid;place-items:center;background:var(--verde-l);color:var(--blanco)}
.dato .ico svg{width:1.2rem;height:1.2rem}
.dato h3{font-size:var(--t-1);font-weight:700}
.dato p{margin:0;color:var(--tinta-suave)}
.dato a{color:var(--verde-l);font-weight:600}
.dato a:hover{text-decoration:underline;text-underline-offset:3px}
.horario dt{font-weight:700;margin-top:var(--s-3)}
.horario dd{margin:0;color:var(--tinta-suave)}
.form{display:grid;gap:var(--s-4);background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r-2);padding:var(--s-6);box-shadow:var(--sombra-1)}
.form label{font-weight:700;font-size:var(--t-0);display:grid;gap:var(--s-1)}
.form input,.form textarea{
  font:inherit;padding:var(--s-3);border:1px solid var(--linea);border-radius:var(--r-1);
  background:var(--papel);color:var(--tinta);width:100%;
}
.form input:focus-visible,.form textarea:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
.form .check{display:flex;gap:var(--s-3);align-items:flex-start;font-weight:400;font-size:var(--t-0);color:var(--tinta-suave)}
.form .check input{width:auto;margin-top:.2em}
.form .aviso{font-size:var(--t-0);color:var(--tinta-suave)}
.whatsapp{
  display:inline-flex;align-items:center;gap:var(--s-2);
  background:#25D366;color:#fff;font-weight:700;
  padding:var(--s-3) var(--s-5);border-radius:var(--r-1);
  transition:filter var(--dur-1) var(--ease);
}
.whatsapp:hover{filter:brightness(1.07)}
.whatsapp svg{width:1.2rem;height:1.2rem}

/* ============================================================
   CTA band + footer
   ============================================================ */
.cta-banda{background:var(--verde-oscuro);color:var(--blanco)}
.cta-banda .in{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-5);
  justify-content:space-between;padding:var(--s-8) 0;
}
.cta-banda h2{color:var(--blanco);max-width:22ch}
.footer{background:var(--tinta);color:#c8d2c2;border-top:6px solid var(--verde-l)}
.footer-in{
  display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--s-7);
  padding:var(--s-8) 0 var(--s-6);
}
.footer .marca img{max-width:220px;border-radius:var(--r-1)}
.footer h4{font-family:var(--display);font-size:var(--t-0);letter-spacing:.12em;text-transform:uppercase;color:var(--blanco);margin-bottom:var(--s-4)}
.footer ul{display:grid;gap:var(--s-2)}
.footer a:hover{color:var(--blanco);text-decoration:underline;text-underline-offset:3px}
.footer .social{display:flex;gap:var(--s-3);margin-top:var(--s-4)}
.footer .social a{
  width:2.4rem;height:2.4rem;border-radius:var(--r-1);display:grid;place-items:center;
  background:rgba(255,255,255,.08);color:var(--blanco);
  transition:background var(--dur-1) var(--ease);
}
.footer .social a:hover{background:var(--verde-persiana)}
.footer .social svg{width:1.15rem;height:1.15rem}
.footer-baja{
  border-top:1px solid rgba(255,255,255,.12);padding:var(--s-4) 0;
  display:flex;flex-wrap:wrap;gap:var(--s-4);justify-content:space-between;
  font-size:var(--t-0);color:#93a08b;
}
.footer-baja a{text-decoration:underline;text-underline-offset:3px}

/* page hero (interior pages) */
.cabecera{background:var(--verde-oscuro);color:var(--blanco);padding:var(--s-8) 0}
.cabecera h1{font-family:var(--display);font-size:var(--t-5);color:var(--blanco)}
.cabecera p{color:color-mix(in srgb,var(--blanco) 80%,var(--verde-persiana));max-width:60ch;margin:var(--s-4) 0 0;font-size:var(--t-2)}

/* legal */
.legal{max-width:76ch}
.legal h2{font-size:var(--t-3);margin:var(--s-7) 0 var(--s-4)}
.legal h3{font-size:var(--t-2);margin:var(--s-6) 0 var(--s-3);color:var(--verde-l)}
.legal p,.legal li{color:var(--tinta-suave)}
.legal ul{list-style:disc;padding-left:1.2em;display:grid;gap:var(--s-2)}

/* ES/CA/EN visibility */
[data-lang="es"] .en,[data-lang="es"] .ca{display:none!important}
[data-lang="en"] .es,[data-lang="en"] .ca{display:none!important}
[data-lang="ca"] .es,[data-lang="ca"] .en{display:none!important}

/* ============================================================
   aviso de cookies (texto del cliente, siempre en castellano)
   ============================================================ */
.aviso-cookies{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  background:var(--tinta);color:#c8d2c2;
  border-top:4px solid var(--amarillo-toldo);
  box-shadow:0 -6px 24px rgba(20,33,15,.25);
}
.aviso-cookies-in{
  display:flex;align-items:center;gap:var(--s-5);
  max-width:var(--maxw);margin:0 auto;padding:var(--s-4) var(--s-5);
}
.aviso-cookies p{margin:0;flex:1;font-size:var(--t-0);line-height:1.5}
.aviso-cookies a{color:var(--blanco);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.aviso-cookies a:hover{color:var(--amarillo-toldo)}
.aviso-cookies .btn{border:0;cursor:pointer;font-family:inherit;flex:none;padding:var(--s-2) var(--s-5)}
@media (max-width:920px){
  .aviso-cookies-in{flex-direction:column;align-items:flex-start;gap:var(--s-3)}
}

/* responsive */
@media (max-width:920px){
  .hero-in{grid-template-columns:1fr;gap:var(--s-6)}
  .hero-plate{width:min(46%,220px);justify-self:start}
  .oferta-grid,.contacto-grid{grid-template-columns:1fr}
  .permiso{grid-template-columns:1fr;gap:var(--s-5)}
  .footer-in{grid-template-columns:1fr;gap:var(--s-6)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}