/* ORGASTRO BCN — Estilos base globales.
   Reset, tipografía base del documento y comportamiento de scroll por
   secciones. Los estilos de cada componente viven inline en la plantilla
   DesignCode (bindings {{ }}); aquí solo va lo global y estático. */

*{box-sizing:border-box;margin:0;padding:0}

/* El recorte horizontal vive aquí (viewport) y no en el wrapper interno:
   un ancestro con overflow-x:hidden crea un scroll container y rompería el
   position:sticky de la sección Postres. El wrapper usa overflow-x:clip. */
html{scroll-behavior:smooth;scroll-padding-top:0;overflow-x:hidden}
body{margin:0;background:#0f0a0b}

/* Sin scroll-snap: las "detenciones" del scroll por sección se retiraron a
   petición del cliente; el scroll fluye libre. El margen solo afecta anclajes. */
section,footer{scroll-margin-top:68px}
#inicio{scroll-margin-top:0}

image-slot{display:block}
#welcome video{transform-origin:center center}

/* ===== POSTRES · rotador automático con fundido ==============================
   Sin recorrido de scroll: los postres cambian solos cada pocos segundos con
   crossfade (scroll-fx.js · bindPostres). Las diapositivas se apilan en la
   misma celda de una rejilla (grid-area 1/1), así el contenedor toma la
   altura de la más alta y no hace falta medir con JS. El viñeteado interior
   funde los bordes de cada foto con el fondo. */
.org-postres{position:relative;background:#0f0a0b}
.org-postres__stage{padding:clamp(64px,9vh,110px) clamp(18px,5vw,56px) 40px}
.org-postres__head{text-align:center;max-width:760px;margin:0 auto}
.org-postres__slides{position:relative;display:grid;width:100%;max-width:1180px;margin:clamp(28px,5vh,48px) auto 0}
.org-postres__slide{grid-area:1/1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;will-change:opacity}
.org-postres__media{position:relative;justify-self:end;width:100%;max-width:520px;height:min(58vh,560px);height:min(58svh,560px)}
.org-postres__media img{width:100%;height:100%;object-fit:cover;display:block}
.org-postres__vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 clamp(44px,6vw,90px) clamp(24px,4vw,52px) #0f0a0b,inset 0 0 clamp(90px,12vw,180px) clamp(36px,6vw,80px) rgba(15,10,11,.88)}
.org-postres__info{justify-self:start;max-width:46ch}
.org-postres__dots{display:flex;justify-content:center;gap:11px;padding-top:22px}
.org-postres__dot{width:9px;height:9px;border-radius:50%;background:#f4eada;opacity:.22;transition:opacity .3s ease,transform .3s ease}

/* Móvil: mismo rotador, en columna y centrado. */
@media (max-width:860px){
  .org-postres__stage{padding:72px 20px 36px}
  .org-postres__slides{max-width:min(84vw,360px)}
  .org-postres__slide{grid-template-columns:1fr;gap:14px;text-align:center}
  .org-postres__media{justify-self:center;max-width:340px;height:auto;aspect-ratio:9/10}
  .org-postres__info{justify-self:center;max-width:100%;padding:0 4px}
  .org-postres__dots{padding-top:16px}
}

/* Accesibilidad: sin rotación automática, los postres se muestran en flujo
   normal, uno debajo de otro (anula el opacity:0 inicial inline). */
@media (prefers-reduced-motion: reduce){
  .org-postres__slides{display:flex;flex-direction:column;gap:clamp(40px,7vh,72px);padding:32px 0 0}
  .org-postres__slide{opacity:1 !important;transform:none !important}
  .org-postres__dots{display:none}
}

::selection{background:#ae0035;color:#f4eada}

/* Foco visible para navegación por teclado (accesibilidad). */
a:focus-visible,button:focus-visible{outline:3px solid #f28c14;outline-offset:2px;border-radius:4px}
