/*
 * Parte de abajo del inicio (28 sep 2026) con design-systems/discord/ en los colores de la web:
 * titulares en mayúsculas de peso 800 (Poppins, sustituto de ABC Ginto Nord), paneles de 24px
 * con su propio fondo y sin sombras, tarjetas de 16px y botones de 12px. El Blurple se cambia por
 * el naranja de TWINS y el fondo índigo por la página blanca (la web es solo clara).
 */
:root{
  --dc-snow:#ffffff; --dc-off-white:#f6f6f6; --dc-ink:#23272a; --dc-charcoal:#2c2f33; --dc-graphite:#333333;
  --dc-void:#000000; --dc-fog:#babcd9; --dc-greyple:#99aab5; --dc-dim:#50555f; --dc-ember:#fda220;
  --dc-accent:#ff4500; --dc-cta:#d63a00; --dc-wa:#25d366;
  --dc-display:'Poppins','Outfit',ui-sans-serif,system-ui,sans-serif;
  --dc-ui:'DM Sans',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --dc-r-btn:12px; --dc-r-btn-lg:16px; --dc-r-card:16px; --dc-r-panel:24px; --dc-r-pill:104px;
}

.dc-brands,.dc-reviews,.dc-cta{padding:40px 0;background:var(--dc-snow);color:var(--dc-ink);font-family:var(--dc-ui);font-size:16px;line-height:1.5;letter-spacing:.016em}
.dc-brands{padding-top:80px}
.dc-cta{padding-bottom:80px}

/* Tipografía */
.dc-h{margin:0;font-family:var(--dc-display);font-size:48px;font-weight:800;line-height:.93;letter-spacing:-.48px;text-transform:uppercase;overflow-wrap:break-word}
.dc-h-sm{font-size:36px;font-weight:700;line-height:1.2;letter-spacing:-.36px}
.dc-kicker{display:inline-block;margin-bottom:16px;color:var(--dc-accent);font-size:16px;font-weight:500;line-height:1.2;letter-spacing:.016em}
.dc-lead{max-width:560px;margin:20px 0 0;font-size:20px;line-height:1.38;letter-spacing:.013em}

/* Botones: primario naranja, secundario blanco con borde, oscuro para WhatsApp */
.dc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;margin:0;padding:15px 24px;border:1px solid transparent;border-radius:var(--dc-r-btn);font-family:var(--dc-ui);font-size:16px;font-weight:500;line-height:1.2;letter-spacing:.016em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s,filter .15s}
.dc-btn-primary{padding:19.5px 24px;background:var(--dc-cta);color:var(--dc-snow)}
.dc-btn-primary:hover{filter:brightness(.9)}
.dc-btn-light{border-color:var(--dc-ink);background:var(--dc-snow);color:var(--dc-ink)}
.dc-btn-light:hover{background:var(--dc-off-white)}
.dc-btn-dark{background:var(--dc-ink);color:var(--dc-snow)}
.dc-btn-dark:hover{background:var(--dc-charcoal)}
.dc-btn-dark svg{color:var(--dc-wa)}
.dc-btn:focus-visible,.dc-arrow:focus-visible{outline:2px solid var(--dc-accent);outline-offset:3px}
.dc-ctas{display:flex;flex-wrap:wrap;gap:16px;margin-top:36px}

/* ¿Por qué elegirnos? — escenario oscuro con las cuatro razones */

/* Reseñas — panel claro con la fuente de Google y las tarjetas */
.dc-panel{padding:56px;border-radius:var(--dc-r-panel);background:var(--dc-off-white)}
.dc-panel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.dc-reviews .dc-lead{color:var(--dc-graphite)}
.dc-arrows{display:flex;flex:none;gap:8px}
.dc-arrow{display:grid;place-items:center;width:52px;height:52px;margin:0;padding:0;border:1px solid var(--dc-ink);border-radius:var(--dc-r-btn);background:var(--dc-snow);color:var(--dc-ink);cursor:pointer;transition:background-color .15s,color .15s}
.dc-arrow:hover{background:var(--dc-ink);color:var(--dc-snow)}
.dc-source{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:16px;margin:36px 0 16px;padding:20px 24px;border-radius:var(--dc-r-card);background:var(--dc-snow)}
.dc-source-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--dc-r-btn);background:var(--dc-ink);color:var(--dc-snow)}
.dc-source strong{display:block;font-weight:700;line-height:1.2}
.dc-source div>span{display:block;margin-top:4px;color:var(--dc-graphite)}
.dc-reviews .ab-review-track{grid-auto-columns:calc((100% - 32px)/3);gap:16px}
.dc-reviews .ab-review{gap:16px;padding:28px;border:0;border-radius:var(--dc-r-card);background:var(--dc-snow)}
.dc-reviews .ab-stars{gap:4px;color:var(--dc-ember)}
.dc-reviews .ab-stars svg{width:16px;height:16px}
.dc-reviews .ab-review-text{color:var(--dc-ink);font-size:16px;line-height:1.5}
.dc-reviews .ab-more{margin:-8px 0 0;color:var(--dc-cta);font-size:16px;font-weight:500}
.dc-reviews .ab-avatar{width:44px;height:44px;border-radius:var(--dc-r-btn);background:var(--dc-accent);color:var(--dc-snow);font-family:var(--dc-display);font-size:16px;font-weight:800}
.dc-reviews .ab-review-author a{color:var(--dc-ink);font-weight:700}
.dc-reviews .ab-review-author a.ab-review-source{margin-top:6px;padding:4px 12px;border:0;border-radius:var(--dc-r-pill);background:var(--dc-off-white);color:var(--dc-graphite);font-weight:500}

/* Marcas — panel claro con el logo de cada marca de la flota */
.dc-brands-panel{padding:56px;border-radius:var(--dc-r-panel);background:var(--dc-off-white)}
.dc-brands-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:end;gap:24px 48px}
.dc-brands-head .dc-lead{margin:0;max-width:none;color:var(--dc-graphite)}
.dc-brand-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:40px 0 0;padding:0;list-style:none}
.dc-brand{position:relative;display:grid;justify-items:center;align-content:start;gap:2px;padding:24px 8px 18px;border:1px solid transparent;border-radius:var(--dc-r-card);background:var(--dc-snow);color:var(--dc-ink);text-align:center;text-decoration:none;transition:border-color .15s,transform .2s}
.dc-brand::after{content:"";position:absolute;left:24px;right:24px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--dc-accent);transform:scaleX(0);transition:transform .25s}
.dc-brand-logo{width:48px;height:48px;margin-bottom:12px;fill:currentColor;transition:fill .15s,transform .25s}
.dc-brand-name{font-family:var(--dc-display);font-size:14px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.dc-brand-count{min-height:1.4em;color:var(--dc-accent);font-size:13px;font-weight:500}
.dc-brand.is-idle{cursor:default;color:var(--dc-dim)}
.dc-brand.is-idle:hover,.dc-brand.is-idle:focus-visible{border-color:transparent;transform:none}
.dc-brand.is-idle:hover .dc-brand-logo{fill:currentColor;transform:none}
.dc-brand.is-idle:hover::after{transform:scaleX(0)}
.dc-brand:hover,.dc-brand:focus-visible{border-color:var(--dc-ink);transform:translateY(-3px)}
.dc-brand:hover .dc-brand-logo,.dc-brand:focus-visible .dc-brand-logo{fill:var(--dc-accent);transform:scale(1.06)}
.dc-brand:hover::after,.dc-brand:focus-visible::after{transform:scaleX(1)}
.dc-brand:focus-visible{outline:2px solid var(--dc-accent);outline-offset:3px}
.dc-brands-foot{display:flex;flex-wrap:wrap;gap:16px;margin-top:40px}
@media (prefers-reduced-motion:reduce){.dc-brand,.dc-brand-logo,.dc-brand::after{transition:none}.dc-brand:hover{transform:none}}

/* Cierre — panel naranja con video de la costa al fondo a la derecha */
.dc-cta-panel{position:relative;overflow:hidden;display:flex;align-items:center;min-height:400px;padding:56px;border-radius:var(--dc-r-panel);background:linear-gradient(135deg,var(--dc-accent),var(--dc-cta));color:var(--dc-snow)}
.dc-cta-copy{position:relative;z-index:1;width:54%}
.dc-cta-panel .dc-h{max-width:640px;color:var(--dc-snow)}
.dc-cta-panel p{max-width:520px;margin:20px 0 0;font-size:20px;line-height:1.38;letter-spacing:.013em}
.dc-cta-panel .dc-ctas{margin-top:32px}
.dc-cta-panel .dc-btn-light{border-color:var(--dc-snow)}
.dc-cta-media{position:absolute;top:0;right:0;bottom:0;width:52%;-webkit-mask-image:linear-gradient(to right,transparent,#000 38%);mask-image:linear-gradient(to right,transparent,#000 38%)}
.dc-cta-media video{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}

/* Pie — fondo negro, columnas sin divisores y la marca en grande */
.dc-footer{padding:80px 0 calc(112px + env(safe-area-inset-bottom,0px));border-top:0;background:var(--dc-void);color:var(--dc-snow);font-family:var(--dc-ui);font-size:16px;line-height:1.5;letter-spacing:.016em}
.dc-foot-top{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:36px 32px}
.dc-foot-brand a{display:inline-block;line-height:0}
.dc-foot-brand img{width:120px;height:auto}
.dc-foot-brand p{margin:16px 0 0;color:var(--dc-fog)}
.dc-foot-brand strong{display:block;color:var(--dc-snow);font-weight:700}
.dc-foot-col{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
.dc-foot-col h2{margin:0 0 8px;color:var(--dc-snow);font-size:16px;font-weight:500;line-height:1.2;letter-spacing:.013em}
.dc-foot-col a,.dc-foot-col span,.dc-foot-col .ab-link{margin:0;padding:0;border:0;background:none;color:var(--dc-fog);font:inherit;text-align:left;text-decoration:none;cursor:pointer;transition:color .15s}
.dc-foot-col span{cursor:default}
.dc-foot-col a:hover,.dc-foot-col .ab-link:hover{color:var(--dc-snow)}
.dc-foot-word{margin:56px 0 0;font-family:var(--dc-display);font-size:112px;font-weight:800;line-height:.86;letter-spacing:-1.12px;color:var(--dc-charcoal);white-space:nowrap;overflow:hidden;user-select:none}
.dc-foot-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:24px;padding-top:24px;border-top:1px solid var(--dc-dim);color:var(--dc-greyple)}
.dc-foot-bottom a{color:inherit;text-decoration:none}
.dc-foot-bottom a:hover{color:var(--dc-snow)}

@media (max-width:1100px){
  .dc-brands-panel{padding:40px}
  .dc-brand-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dc-foot-word{font-size:80px}
  .dc-reviews .ab-review-track{grid-auto-columns:calc((100% - 16px)/2)}
}
@media (max-width:760px){
  .dc-brands,.dc-reviews,.dc-cta{padding:12px 0}
  .dc-brands{padding-top:48px}
  .dc-cta{padding-bottom:48px}
  .dc-h{font-size:36px;line-height:1.2;letter-spacing:-.36px}
  .dc-lead,.dc-cta-panel p{font-size:16px;line-height:1.5}
  .dc-ctas{margin-top:28px}
  .dc-ctas{flex-direction:column;align-items:stretch}
  .dc-ctas .dc-btn{width:100%}
  .dc-panel-head{flex-direction:column;align-items:flex-start}
  .dc-arrows{display:none}
  .dc-source{grid-template-columns:48px minmax(0,1fr);margin-top:28px;padding:20px}
  .dc-source .dc-btn{grid-column:1/-1;width:100%}
  .dc-reviews .ab-review-track{grid-auto-columns:85%;gap:12px}
  .dc-reviews .ab-review{padding:24px}
  .dc-brands-panel,.dc-panel,.dc-cta-panel{padding:36px 20px}
  .dc-brands-head{grid-template-columns:minmax(0,1fr)}
  .dc-brand-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:28px}
  .dc-brand{padding:18px 4px 14px}
  .dc-brand-logo{width:36px;height:36px;margin-bottom:8px}
  .dc-brand-name{font-size:11px;letter-spacing:.02em}
  .dc-brand-count{font-size:11px}
  .dc-brands-foot{flex-direction:column;margin-top:28px}
  .dc-brands-foot .dc-btn{width:100%}
  .dc-cta-panel{flex-direction:column;align-items:stretch;min-height:0}
  .dc-cta-copy{width:auto;order:2}
  .dc-cta-media{position:relative;order:1;width:auto;height:240px;margin:-36px -20px 28px;-webkit-mask-image:linear-gradient(to bottom,#000 55%,transparent);mask-image:linear-gradient(to bottom,#000 55%,transparent)}
  .dc-footer{padding-top:56px}
  .dc-foot-top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dc-foot-brand{grid-column:1/-1}
  .dc-foot-word{margin-top:40px;font-size:36px;line-height:1.2;letter-spacing:-.36px}
}

/* Al tocar una marca el catálogo baja a su primer vehículo */
#grid article[id^="brand-"]{scroll-margin-top:96px}

.dc-top{position:fixed;right:16px;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:45;display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--dc-ink);border-radius:50%;background:var(--dc-snow);color:var(--dc-ink);cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.18);transition:opacity .2s,transform .2s,background .15s,color .15s,border-color .15s}
.dc-top[hidden],body.is-booking .dc-top{display:none}
.dc-top:hover,.dc-top:focus-visible{background:var(--dc-accent);border-color:var(--dc-accent);color:#fff;transform:translateY(-2px)}
.dc-top:focus-visible{outline:2px solid var(--dc-ink);outline-offset:3px}