/* ===== Barreth en línea v6 ===== */
/* tonos: la página cambia de color según la sección que tienes enfrente */
.o-page.o2{--bg:var(--noche);--fg:var(--crema);--mut:var(--arena);--acc:var(--ambar);--line:rgba(205,170,129,.2);background:var(--bg);color:var(--fg);transition:background-color .9s ease,color .9s ease;overflow-x:hidden;overflow-x:clip}
.o2[data-t=crema]{--bg:var(--crema);--fg:var(--choco);--mut:var(--madera);--acc:var(--moca);--line:rgba(91,52,23,.16)}
.o2[data-t=cacao]{--bg:var(--cacao);--fg:var(--crema);--mut:var(--arena);--acc:var(--ambar);--line:rgba(205,170,129,.22)}
.o2 .o2-k,.o2 .o2-h,.o2 .o2-lede,.o2 .o2-note,.o2-day,.o2-co,.o2 .o2-rh h3,.o2-inc{transition:color .9s ease}
/* entradas por los lados */
.o2 .rv{transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1),color .9s ease}
.o2 .rv.in-l{transform:translateX(-64px)}
.o2 .rv.in-r{transform:translateX(64px)}
.o2 .rv.in{transform:none}
.fx-still .o2 .rv{transition:none!important}
.o2-sec{position:relative;padding:clamp(72px,10vw,132px) 0}
.o2-k{font:italic 400 19px var(--serif);color:var(--acc);margin:0 0 12px}
.o2-h{font:italic 400 clamp(46px,7vw,104px)/.95 var(--serif);letter-spacing:-.025em;color:var(--fg);margin:0 0 20px}
.o2-lede{font-size:clamp(16px,1.3vw,18px);line-height:1.6;color:var(--mut);max-width:54ch;margin:0 0 clamp(30px,4vw,48px)}
.o2-note{margin-top:22px;font:italic 400 17px var(--serif);color:var(--mut)}
/* portada: video con el logo encima */
.o2-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--noche);color:var(--crema)}
.o2-hv{position:absolute;inset:0}
.o2-hv .clipv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.o2-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,18,11,.55) 0%,rgba(30,18,11,.12) 32%,rgba(30,18,11,.72) 74%,var(--noche) 100%)}
.o2-hin{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:clamp(30px,6vw,90px);align-items:end;padding-top:calc(110px + env(safe-area-inset-top,0px));padding-bottom:clamp(96px,13vh,150px)}
.o2-logo{margin:0;line-height:1}
.o2-logo .wm{display:block;font-size:clamp(88px,15vw,220px);line-height:.82;color:var(--crema);text-shadow:0 0 60px rgba(233,161,91,.35)}
.o2-ol{display:block;font:italic 400 clamp(22px,2.8vw,36px) var(--serif);color:var(--ambar);margin-top:12px;letter-spacing:.02em}
.o2-hsub{font-size:clamp(16px,1.4vw,19px);line-height:1.55;color:var(--arena);max-width:44ch;margin:22px 0 0}
.o2-hsub b{color:var(--crema);font-weight:500}
.o2-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.o2-hm{width:100%}
.o2-hm .mirror{position:relative}
.o2-hm .clipv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (min-width:861px){.o2-hv{filter:blur(22px) brightness(.5) saturate(1.1);transform:scale(1.15)}}
@media (max-width:860px){.o2-hin{grid-template-columns:1fr;text-align:center;justify-items:center}.o2-hsub{margin-left:auto;margin-right:auto}.o2-ctas{justify-content:center}.o2-hm{display:none}.o2-shade{background:linear-gradient(180deg,rgba(30,18,11,.5) 0%,rgba(30,18,11,.05) 30%,rgba(30,18,11,.7) 66%,var(--noche) 100%)}}
.x-top.clear{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
/* opción 1: tu semana */
.o2-week{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3vw,40px) clamp(16px,2.4vw,30px)}
.o2-day{display:grid;gap:8px;padding:0;border:0;background:none;text-align:left;color:var(--fg);cursor:pointer}
.o2-day .dl{display:flex;align-items:center;gap:8px;min-height:34px}
.o2-day .dl b{font:italic 400 30px/1 var(--serif);margin-right:4px}
.o2-day .dl span{font:500 11px var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:var(--choco);color:var(--crema)}
.o2-day .dl span.ok{background:var(--lino);color:var(--choco)}
.o2-day .pst{position:relative;aspect-ratio:4/3;border-radius:20px;overflow:hidden;background:var(--cacao);transition:box-shadow .5s}
.o2-day .pst img{width:100%;height:100%;object-fit:cover;filter:brightness(.78) saturate(.95);transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s}
.o2-day:hover .pst img{transform:scale(1.04);filter:brightness(.9)}
.o2-day.today .pst{box-shadow:0 0 0 2px var(--cara),0 0 44px rgba(233,161,91,.55)}
.o2 .pl{position:absolute;left:14px;bottom:14px;width:46px;height:46px;border-radius:50%;background:rgba(254,244,235,.92);color:var(--choco);display:grid;place-items:center}
.o2-day .pg{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(254,244,235,.25)}.o2-day .pg i{display:block;height:100%;background:var(--ambar)}
.o2-day h3{font:italic 400 24px/1.15 var(--serif);color:var(--fg);margin-top:4px}
.o2-day p{font-size:14px;color:var(--mut)}.o2-day p.eq{font-size:13px;margin-top:-6px;opacity:.85}
@media (max-width:860px){.o2-week{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(240px,78%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-right:calc(-1*clamp(20px,5vw,64px));padding-right:clamp(20px,5vw,64px)}.o2-day{scroll-snap-align:start}}
/* opción 2: encuentra tu clase */
.o2-driftw{overflow:hidden;margin-bottom:clamp(36px,5vw,64px)}
.o2-drift{display:block;width:max-content;padding:0 6vw;will-change:transform}
.o2-seg{display:inline-flex;padding:4px;border-radius:999px;border:1px solid var(--line);margin-bottom:26px}
.o2-seg button{border:0;background:none;color:var(--mut);font:400 14.5px var(--sans);padding:10px 20px;border-radius:999px;cursor:pointer;transition:background .3s,color .3s}
.o2-seg button.on{background:var(--crema);color:var(--choco)}
.o2-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.o2-tiles.t3{grid-template-columns:repeat(3,minmax(0,1fr))}
.o2-tile{position:relative;aspect-ratio:3/4;border-radius:24px;overflow:hidden;border:0;padding:0;text-align:left;color:var(--crema);background:linear-gradient(160deg,var(--choco),var(--cacao));cursor:pointer;transition:box-shadow .4s}
.o2-tile.tm{aspect-ratio:4/3}
.o2-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55) saturate(.9);transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .5s}
.o2-tile:hover img{transform:scale(1.05);filter:brightness(.68)}
.o2-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(30,18,11,.85),transparent 60%);pointer-events:none}
.o2-tile .tx{position:absolute;z-index:2;left:18px;right:18px;bottom:16px;display:grid;gap:4px}
.o2-tile .tx b{font:italic 400 clamp(24px,2.4vw,32px)/1.05 var(--serif);font-weight:400}
.o2-tile .tx small{font-size:13px;line-height:1.4;color:var(--arena)}
.o2-tile .tx em{font:500 11px var(--sans);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--ambar);margin-top:4px}
.o2-tile .big{position:absolute;z-index:2;top:14px;left:18px;font:italic 400 clamp(56px,7vw,92px)/1 var(--serif);color:var(--cara)}
.o2-tile .big small{font-size:.3em;margin-left:6px;font-style:normal;font-family:var(--sans);color:var(--arena)}
.o2-tile.on{box-shadow:0 0 0 2px var(--cara),0 0 44px rgba(233,161,91,.5)}
@media (max-width:860px){.o2-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.o2-tiles.t3{grid-template-columns:1fr}.o2-tile.tm{aspect-ratio:auto;min-height:130px}.o2-tile.tm .big{top:auto;bottom:14px;left:auto;right:18px}}
.o2-res{margin-top:clamp(44px,6vw,72px);scroll-margin-top:90px}
.o2-rh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:22px;margin-bottom:24px}
.o2-rh h3{font:italic 400 clamp(26px,3vw,34px) var(--serif);color:var(--fg)}.o2-rh h3 span{font:400 15px var(--sans);font-style:normal;color:var(--mut)}
.o2 .o-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:980px){.o2 .o-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.o2 .o-grid{grid-template-columns:1fr}}
/* opción 3: el squad */
.o2-squad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,4vw,56px) clamp(16px,3vw,40px)}
.o2-co{display:grid;justify-items:center;gap:10px;padding:0;border:0;background:none;color:var(--fg);text-align:center;cursor:pointer}
.o2-co .mirror-f{width:min(100%,230px)}
.o2-co b{font:italic 400 clamp(26px,2.6vw,32px)/1.1 var(--serif);font-weight:400;margin-top:6px}
.o2-co span{font-size:14px;color:var(--mut)}
@media (max-width:860px){.o2-squad{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(200px,62%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-right:calc(-1*clamp(20px,5vw,64px));padding-right:clamp(20px,5vw,64px)}.o2-co{scroll-snap-align:start}}
.o2-cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
#sheet .ov h3{color:var(--choco);font-size:20px}#sheet .ov p{color:var(--moca)}
@media (max-width:480px){.o2-cgrid{grid-template-columns:1fr}}
/* planes */
.o2-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:900px}
.o2-plan{position:relative;display:grid;gap:10px;align-content:start;padding:clamp(26px,3vw,38px);border-radius:28px;background:var(--blanco);border:1px solid var(--arena);color:var(--choco)}
.o2-plan .nm{font:500 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--moca)}
.o2-plan .pr{font:400 clamp(52px,6vw,72px)/1 var(--serif);letter-spacing:-.02em}
.o2-plan .pr span{font:400 17px var(--sans);margin-left:6px;color:var(--moca)}
.o2-plan .bill{font-size:14px;color:var(--madera);margin-bottom:10px}
.o2-plan.best{background:linear-gradient(160deg,var(--choco),var(--cacao));border-color:transparent;color:var(--crema);box-shadow:0 30px 80px -30px rgba(233,161,91,.6)}
.o2-plan.best .nm,.o2-plan.best .pr span{color:var(--cara)}.o2-plan.best .bill{color:var(--arena)}
.o2-plan .badge{justify-self:start;font:500 12px var(--sans);padding:6px 12px;border-radius:999px;background:var(--ambar);color:var(--noche)}
.o2-inc{margin-top:30px;max-width:900px;border-top:1px solid var(--line);padding-top:24px;color:var(--fg)}
.o2-inc h3{font:italic 400 26px var(--serif);margin-bottom:12px}
.o2-inc ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 28px}
.o2-inc li{position:relative;padding-left:28px;font-size:15px;color:var(--mut);line-height:1.5}
.o2-inc li::before{content:"✓";position:absolute;left:0;top:0;font-weight:500;color:var(--cara)}
@media (max-width:700px){.o2-plans,.o2-inc ul{grid-template-columns:1fr}}
/* preguntas sobre fondo oscuro */
.o2 details{border-color:var(--line)!important}.o2 details p{color:var(--mut)}.o2 summary{color:var(--fg)}
.o2 .o-foot{background:var(--noche)}