/* =========================================================
   Starken · Header Secondary + Offcanvas
   ========================================================= */
.starken-header-secondary,.starken-offcanvas { font-family:'Google Sans Flex',sans-serif; }
.starken-header-secondary { width:100%; background-color:#fff; }
.starken-header-secondary__inner { display:flex; align-items:center; min-height:64px; gap:1rem; padding:0 18px; }
.starken-header-secondary__logo { display:inline-flex; align-items:center; width:100px; max-width:40vw; text-decoration:none; }
.starken-header-secondary__logo img { display:block; width:100%; height:auto; }
.brand-serie-dorada .starken-header-secondary__logo { width:150px; }

.starken-menu-trigger { display:inline-flex; align-items:center; justify-content:center; width:20px; height:40px; flex:0 0 auto; padding:0; border:0; background:transparent; color:var(--custom-brand-text,#28242A); box-shadow:none; }
.starken-menu-trigger:hover,.starken-menu-trigger:focus,.starken-menu-trigger:active { border:0; background:transparent; color:var(--custom-brand-text,#28242A); box-shadow:none; }
.starken-menu-trigger:focus-visible { outline:2px solid rgba(40,36,42,.25); outline-offset:5px; border-radius:50%; }
.starken-menu-trigger__dots { display:inline-flex; align-items:center; justify-content:center; gap:3px; width:18px; height:18px; transform-origin:center; transition:transform .45s cubic-bezier(.16,1,.3,1); }
.starken-menu-trigger__dots span { display:block; width:3px; height:3px; flex:0 0 3px; border-radius:50%; background-color:currentColor; }
.starken-menu-trigger:hover .starken-menu-trigger__dots,.starken-menu-trigger:focus .starken-menu-trigger__dots { transform:rotate(90deg); }

/* Panel: apertura y cierre suaves, incluso sobre los estilos de Bootstrap. */
.starken-offcanvas.offcanvas.offcanvas-start { top:14px; left:14px; bottom:14px; width:400px; height:auto; margin:0; border:0; border-radius:0 .9rem .9rem 0; background-color:#fff; overflow:hidden; box-shadow:none; will-change:transform; transition:transform .62s cubic-bezier(.16,1,.3,1),visibility .62s cubic-bezier(.16,1,.3,1) !important; }
.starken-offcanvas.offcanvas.offcanvas-start:not(.show):not(.showing):not(.hiding) { transform:translate3d(calc(-100% - 80px),0,0) !important; }
.starken-offcanvas.offcanvas.offcanvas-start.showing,.starken-offcanvas.offcanvas.offcanvas-start.show:not(.hiding) { transform:translate3d(0,0,0) !important; }
.starken-offcanvas.offcanvas.offcanvas-start.hiding { transform:translate3d(calc(-100% - 80px),0,0) !important; }

.starken-offcanvas__header { display:flex; align-items:center; justify-content:flex-end; padding:1rem 1rem 0; border:0; }
.starken-offcanvas-close { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:0; border:0; border-radius:50%; background-color:#ededed; color:var(--custom-brand-text,#28242A); font-size:1.7rem; font-weight:300; line-height:1; box-shadow:none; transition:background-color .25s ease,transform .35s cubic-bezier(.16,1,.3,1); }
.starken-offcanvas-close span { display:block; line-height:.9; transform:translateY(-1px); }
.starken-offcanvas-close:hover,.starken-offcanvas-close:focus { background-color:#dedede; color:var(--custom-brand-text,#28242A); transform:rotate(90deg); }
.starken-offcanvas-close:focus-visible { outline:2px solid rgba(40,36,42,.25); outline-offset:3px; }

.starken-offcanvas__body { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; min-height:calc(100vh - 28px - 4rem); padding:clamp(3rem,8vh,5rem) 2.25rem 2.5rem; text-align:left; }
.starken-offcanvas__nav { width:100%; }
.starken-offcanvas-menu { align-items:flex-start; gap:1.15rem; }

/* Estado inicial/cierre: ocultos, sin delay. */
.starken-offcanvas-menu .nav-link { display:inline-flex; align-items:center; justify-content:flex-start; width:fit-content; padding:0; color:var(--custom-brand-text,#28242A); font-size:clamp(1.85rem,2.4vw,2.45rem); font-weight:300; line-height:1.18; text-align:left; text-decoration:none; opacity:0; transform:translate3d(0,18px,0); transition:color .25s ease,opacity .62s cubic-bezier(.16,1,.3,1),transform .72s cubic-bezier(.16,1,.3,1); transition-delay:0s; }
.starken-offcanvas-menu .nav-link::after { content:none; }
.starken-offcanvas-menu .nav-link:hover,.starken-offcanvas-menu .nav-link:focus,.starken-offcanvas-menu .nav-link:active,.starken-offcanvas-menu .current-menu-item>.nav-link,.starken-offcanvas-menu .current-menu-ancestor>.nav-link { color:var(--custom-brand-text,#28242A); opacity:.65; }
.starken-offcanvas-menu .nav-link:focus-visible { outline:2px solid rgba(40,36,42,.25); outline-offset:4px; border-radius:.25rem; }

/* Entrar mientras el panel ya se está moviendo, no al final. */
.starken-offcanvas.showing .starken-offcanvas-menu .nav-link,.starken-offcanvas.show .starken-offcanvas-menu .nav-link { opacity:1; transform:translate3d(0,0,0); }
.starken-offcanvas.showing .starken-offcanvas-menu .menu-item:nth-child(1)>.nav-link,.starken-offcanvas.show .starken-offcanvas-menu .menu-item:nth-child(1)>.nav-link { transition-delay:.10s; }
.starken-offcanvas.showing .starken-offcanvas-menu .menu-item:nth-child(2)>.nav-link,.starken-offcanvas.show .starken-offcanvas-menu .menu-item:nth-child(2)>.nav-link { transition-delay:.18s; }
.starken-offcanvas.showing .starken-offcanvas-menu .menu-item:nth-child(3)>.nav-link,.starken-offcanvas.show .starken-offcanvas-menu .menu-item:nth-child(3)>.nav-link { transition-delay:.26s; }
.starken-offcanvas.showing .starken-offcanvas-menu .menu-item:nth-child(4)>.nav-link,.starken-offcanvas.show .starken-offcanvas-menu .menu-item:nth-child(4)>.nav-link { transition-delay:.34s; }
.starken-offcanvas.showing .starken-offcanvas-menu .menu-item:nth-child(5)>.nav-link,.starken-offcanvas.show .starken-offcanvas-menu .menu-item:nth-child(5)>.nav-link { transition-delay:.42s; }
.starken-offcanvas.showing .starken-offcanvas-menu .menu-item:nth-child(6)>.nav-link,.starken-offcanvas.show .starken-offcanvas-menu .menu-item:nth-child(6)>.nav-link { transition-delay:.50s; }

/* Cierre: todos salen suaves y rápido antes de que termine el panel. */
.starken-offcanvas.hiding .starken-offcanvas-menu .nav-link { opacity:0; transform:translate3d(0,10px,0); transition-delay:0s; transition-duration:.24s; }

.starken-offcanvas__social { display:flex; align-items:center; justify-content:flex-start; gap:2.15rem; margin-top:4.5rem; opacity:0; transform:translate3d(0,12px,0); transition:opacity .55s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1); transition-delay:0s; }
.starken-offcanvas.showing .starken-offcanvas__social,.starken-offcanvas.show .starken-offcanvas__social { opacity:1; transform:translate3d(0,0,0); transition-delay:.56s; }
.starken-offcanvas.hiding .starken-offcanvas__social { opacity:0; transform:translate3d(0,8px,0); transition-delay:0s; transition-duration:.2s; }
.starken-offcanvas__social a { display:inline-flex; align-items:center; justify-content:center; color:var(--custom-brand-text,#28242A); font-size:1.75rem; line-height:1; text-decoration:none; transition:opacity .25s ease,transform .25s ease; }
.starken-offcanvas__social a:hover,.starken-offcanvas__social a:focus { color:var(--custom-brand-text,#28242A); opacity:.65; transform:translateY(-2px); }

.offcanvas-backdrop { transition:opacity .45s ease !important; }
.offcanvas-backdrop.show { opacity:.82; }

@media (max-width:575.98px) {
	.starken-header-secondary__inner { min-height:62px; padding-inline:16px; gap:.9rem; }
	.starken-header-secondary__logo { width:130px; }
	.brand-serie-dorada .starken-header-secondary__logo { width:138px; }
	.starken-offcanvas.offcanvas.offcanvas-start { top:14px; left:14px; right:14px; bottom:14px; width:auto; }
	.starken-offcanvas.offcanvas.offcanvas-start:not(.show):not(.showing):not(.hiding) { transform:translate3d(calc(-100vw - 80px),0,0) !important; }
	.starken-offcanvas.offcanvas.offcanvas-start.hiding { transform:translate3d(calc(-100vw - 80px),0,0) !important; }
	.starken-offcanvas__body { padding:3rem 2rem 2.5rem; }
	.starken-offcanvas-menu .nav-link { font-size:2rem; }
	.starken-offcanvas__social { gap:1.8rem; margin-top:4rem; }
	.starken-offcanvas__social a { font-size:1.65rem; }
}