.al-documentales { --cine-papel: #f4efe9; --cine-tinta: #0b0710; }
.al-dc-portada { position: relative; isolation: isolate; overflow: hidden; min-height: 90svh; padding: 165px 0 75px; background: #0b0710; color: #f4efe9; }
.al-dc-fondo { position: absolute; inset: 0; z-index: -1; }
.al-dc-fondo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 55%; opacity: 0; filter: saturate(.45); transition: opacity 1.2s ease; }
.al-dc-fondo img.al-activa { opacity: .32; }
.al-dc-fondo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,#0b0710eb 5%,#0b0710a6 57%,#0b071040),linear-gradient(180deg,#0b071066,transparent 45%,#0b0710ed); }
.al-dc-hero-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(340px,.85fr); gap: clamp(40px,6vw,100px); align-items: center; }
.al-dc-k { display: inline-flex; gap: 10px; align-items: center; color: #ceb4db; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; }
.al-dc-k::before { content: ""; width: 26px; height: 1px; background: #cfa8ef; }
.al-dc-portada h1 { max-width: 14ch; color: #f4efe9; font: 500 clamp(2.8rem,4.6vw,5rem)/1.04 var(--display,Arial,sans-serif); letter-spacing: -.047em; margin: 25px 0 26px; text-wrap: balance; }
.al-dc-portada h1 em { color: #cfa8ef; font-family: var(--serif,Georgia,serif); font-weight: 400; }
.al-dc-intro { max-width: 45ch; color: #d8cedd; line-height: 1.75; font-size: .96rem; }
.al-dc-stage { margin-top: 32px; padding-top: 22px; border-top: 1px solid #cfa8ef36; }
.al-dc-stage-status { color: #cfa8ef; font-size: .66rem; text-transform: uppercase; letter-spacing: .14em; }
.al-dc-stage h2 { font: 500 1.35rem/1.2 var(--display,Arial,sans-serif); color: #fff; margin: 10px 0; }
.al-dc-stage p { color: #c6bbce; font-size: .86rem; line-height: 1.6; min-height: 3.2em; margin: 0 0 22px; }
.al-dc-stage .al-acciones { gap: 20px; }
.al-dc-stage [hidden] { display: none; }
.al-dc-stage .mil-button { padding-inline: 25px; }
.al-dc-stage .mil-button span { font-size: .69rem; }
.al-dc-selector { border-left: 1px solid #cfa8ef38; padding-left: 25px; }
.al-dc-selector-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; color: #c6bbce; font-size: .64rem; letter-spacing: .16em; text-transform: uppercase; }
.al-dc-choices { display: grid; gap: 12px; }
.al-dc-choice { position: relative; display: grid; grid-template-columns: minmax(90px,.8fr) minmax(0,1fr); align-items: center; gap: 18px; padding: 13px; border: 1px solid #cfa8ef29; border-radius: 15px; background: #1a1124a3; color: #fff; text-align: left; font: inherit; cursor: pointer; transition: background .35s ease,border-color .35s ease,transform .35s ease; }
.al-dc-choice img { width: 100%; aspect-ratio: 16/10; height: auto; object-fit: cover; border-radius: 6px; filter: saturate(.7); transition: filter .4s ease; }
.al-dc-choice strong { display: block; font-size: 1rem; line-height: 1.2; font-weight: 500; margin: 6px 0 8px; }
.al-dc-choice small { display: block; color: #c5b5ce; font-size: .61rem; line-height: 1.4; text-transform: uppercase; letter-spacing: .08em; }
.al-dc-choice .al-dc-choice-n { color: #cfa8ef; font: italic 1.25rem var(--serif,Georgia,serif); }
.al-dc-choice.al-elegida, .al-dc-choice:hover, .al-dc-choice:focus-visible { background: #41214d96; border-color: #cfa8efa6; transform: translateX(-4px); outline: none; }
.al-dc-choice.al-elegida img { filter: saturate(1); }
.al-dc-selector-note { margin-top: 16px; color: #a998b2; font-size: .72rem; line-height: 1.6; }
.al-dc-indice { background: #f4efe9; border-bottom: 1px solid #301f3f1a; }
.al-dc-indice .al-ancho { display: flex; flex-wrap: wrap; gap: 12px 30px; align-items: center; padding-block: 24px; }
.al-dc-indice a { display: inline-flex; align-items: center; gap: 10px; color: #33213e; font-size: .73rem; text-decoration: none; padding-block: 6px; border-bottom: 1px solid transparent; }
.al-dc-indice a:hover, .al-dc-indice a:focus-visible { color: #8a00c6; border-bottom-color: #8a00c6; }
.al-dc-indice a span { color: #8a00c6; font-family: var(--serif,Georgia,serif); font-style: italic; font-size: 1.1rem; }
.al-documentales .al-doc-estreno { background: radial-gradient(60% 70% at 0 30%,#153f4b4d,transparent),#0c1117 !important; }
.al-documentales .al-de-afiche { border-radius: 5px 20px 20px 5px; box-shadow: -7px 0 0 #06121a, -9px 0 0 #687e8140,0 28px 70px #0006; }
.al-documentales .al-de-acto { transition: background .35s ease,transform .35s ease,border-color .35s ease; }
.al-documentales .al-de-acto:hover { background: #152933; transform: translateY(-5px); border-color: #9ec7d080; }
.al-documentales .al-doc { padding-block: clamp(65px,7vw,110px); }
.al-documentales #doc-1 { background: #100b15; }
.al-documentales #doc-2 { background: #18121c; }
.al-documentales #doc-3 { background: #0c0910; }
.al-documentales .al-video { border: 1px solid #cfa8ef30; box-shadow: 0 20px 65px #0004; }
.al-documentales .al-video-yt { object-fit: contain; background: #08060c; }
.al-documentales .al-doc-num { margin-bottom: 10px; font-size: 3rem; }
.al-dc-temas { display: flex; flex-wrap: wrap; gap: 7px; list-style: none; padding: 0; margin: 22px 0 24px; }
.al-dc-temas li { border: 1px solid #cfa8ef36; border-radius: 99px; padding: 6px 11px; font-size: .66rem; color: #d0bddb; }
.al-dc-pregunta { border-left: 1px solid #a66dc5; padding-left: 17px; margin: 22px 0 !important; color: #e4d6eb !important; font-family: var(--serif,Georgia,serif); font-style: italic; font-size: 1.35rem !important; line-height: 1.4 !important; }
.al-dc-pregunta span { display: block; font: 500 .6rem/1.5 var(--display,Arial,sans-serif); letter-spacing: .12em; text-transform: uppercase; color: #bca1cd; margin-bottom: 7px; }
.al-dc-despues { background: #f4efe9; padding-block: clamp(75px,8vw,120px); color: #211528; }
.al-dc-despues .al-dc-d-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px,6vw,100px); align-items: start; }
.al-dc-despues h2 { font: 500 clamp(2.4rem,3.9vw,4rem)/1.02 var(--display,Arial,sans-serif); letter-spacing: -.04em; margin: 16px 0 25px; max-width: 12ch; }
.al-dc-despues h2 em { color: #8a00c6; font-family: var(--serif,Georgia,serif); font-weight: 400; }
.al-dc-despues > .al-ancho p { color: #675a70; font-size: .93rem; line-height: 1.7; }
.al-dc-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.al-dc-tab { background: transparent; border: 1px solid #9878aa55; border-radius: 99px; color: #5c3c6a; padding: 10px 15px; font: inherit; font-size: .77rem; cursor: pointer; }
.al-dc-tab[aria-pressed="true"] { background: #261332; color: #fff; border-color: #261332; }
.al-dc-panel { background: #fff; border: 1px solid #bda2ce36; border-radius: 20px; padding: clamp(26px,3vw,42px); min-height: 270px; }
.al-dc-panel h3 { font: 500 1.65rem/1.2 var(--display,Arial,sans-serif); letter-spacing: -.025em; margin: 0 0 16px; }
.al-dc-panel .mil-button { margin-top: 18px; }
.al-dc-proyeccion { background: #e9e0ed; color: #27172f; padding-block: clamp(75px,8vw,125px); }
.al-dc-proy-grid { display: grid; grid-template-columns: 1fr .85fr; gap: clamp(35px,7vw,100px); align-items: start; }
.al-dc-proyeccion h2 { font: 500 clamp(2.6rem,4.5vw,4.7rem)/1.02 var(--display,Arial,sans-serif); letter-spacing: -.045em; max-width: 13ch; margin: 18px 0 25px; }
.al-dc-proyeccion h2 em { font-family: var(--serif,Georgia,serif); color: #8a00c6; font-weight: 400; }
.al-dc-proyeccion p { color: #63536d; font-size: .93rem; line-height: 1.7; }
.al-dc-proy-pasos { list-style: none; margin: 28px 0 0; padding: 0; counter-reset: proy; }
.al-dc-proy-pasos li { display: grid; grid-template-columns: 28px 1fr; gap: 13px; margin: 17px 0; color: #55425f; font-size: .85rem; line-height: 1.5; counter-increment: proy; }
.al-dc-proy-pasos li::before { content: "0" counter(proy); color: #8a00c6; font: italic 1.35rem var(--serif,Georgia,serif); }
.al-dc-ticket { position: relative; border: 1px solid #a38aad4d; background: #fbf8fc; padding: 35px; border-radius: 10px; box-shadow: 0 22px 45px -25px #49305355; }
.al-dc-ticket::before { content: ""; position: absolute; left: 0; right: 0; top: 56px; border-top: 1px dashed #9f83ac66; }
.al-dc-ticket > small { display: block; color: #7c638b; font-size: .64rem; text-transform: uppercase; letter-spacing: .16em; margin-bottom: 30px; }
.al-dc-ticket h3 { font: 500 1.45rem/1.2 var(--display,Arial,sans-serif); letter-spacing: -.02em; margin: 0 0 15px; }
.al-dc-publicos { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0; }
.al-dc-publicos button { padding: 9px 12px; border: 1px solid #ad90bc66; border-radius: 99px; background: transparent; color: #674d75; font: inherit; font-size: .73rem; cursor: pointer; }
.al-dc-publicos button[aria-pressed="true"] { background: #8a00c6; border-color: #8a00c6; color: #fff; }
.al-dc-ticket .mil-button { width: 100%; justify-content: center; margin-top: 10px; }
.al-dc-ticket .al-dc-mail-nota { margin: 17px 0 0; font-size: .7rem; color: #8b7597; }
.al-dc-tab:focus-visible, .al-dc-publicos button:focus-visible { outline: 2px solid #8a00c6; outline-offset: 4px; }
@media(max-width:1000px) {
 .al-dc-portada { padding-top: 135px; }
 .al-dc-hero-grid { grid-template-columns: 1fr; }
 .al-dc-portada h1 { max-width: 18ch; }
 .al-dc-selector { border-left: 0; padding-left: 0; }
 .al-dc-choices { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .al-dc-choice { display: block; }
 .al-dc-choice img { margin-bottom: 10px; }
 .al-dc-despues .al-dc-d-grid, .al-dc-proy-grid { grid-template-columns: 1fr; }
}
@media(max-width:600px) {
 .al-dc-portada { padding-top: 115px; padding-bottom: 50px; }
 .al-dc-portada h1 { font-size: 3rem; }
 .al-dc-choices { grid-template-columns: 1fr; }
 .al-dc-choice { display: grid; grid-template-columns: 105px 1fr; gap: 14px; }
 .al-dc-choice img { margin: 0; }
 .al-dc-stage .al-acciones { align-items: flex-start; flex-direction: column; }
 .al-dc-indice .al-ancho { gap: 5px 18px; }
 .al-dc-indice a { font-size: .68rem; }
 .al-dc-ticket { padding: 28px 22px; }
 .al-documentales .al-doc-texto h2 { font-size: 2.4rem; }
}
@media(prefers-reduced-motion:reduce) {
 .al-dc-fondo img,.al-dc-choice,.al-dc-choice img,.al-documentales .al-de-acto { transition:none; }
}
