/* Privileged Nautic · capa compartida de las páginas internas (oct 2026)
   Mismo lenguaje que la portada: blanco + azul marino #071F35, cinta de ocasiones,
   fotos en un solo formato, filas deslizables en celular y menús desplegables propios. */
:root{--pn-navy:#071F35;--pn-navy-2:#0D2B47;--pn-ease:cubic-bezier(.22,1,.36,1)}

/* línea de avance de lectura bajo la barra */
.sprog{position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none;z-index:2}
.sprog i{display:block;height:100%;background:var(--pn-navy);transform:scaleX(0);transform-origin:0 50%}

/* cinta de ocasiones (igual que la portada) */
.ticker{background:var(--pn-navy);color:#fff;overflow:hidden;padding:20px 0;position:relative}
.tk-track{display:flex;width:max-content;will-change:transform}
.tk-set{display:flex;align-items:center;flex:none}
.tk-set span{font-family:var(--font-head),sans-serif;font-weight:500;font-size:clamp(1.25rem,2.4vw,2.1rem);line-height:1;
  letter-spacing:-.01em;white-space:nowrap;padding:0 clamp(18px,2.4vw,34px)}
.tk-set i{display:block;width:8px;height:8px;background:#fff;transform:rotate(45deg);flex:none;opacity:.7}

/* encabezados de página: un respiro más y el texto entra por partes */
.pagehead{position:relative;overflow:hidden}
.pagehead h1,.yd h1,.eq-head h1{text-wrap:balance}

/* botones: pulsación física */
.btn,.yd-btn{transition:background-color .2s,color .2s,border-color .2s,scale .16s var(--pn-ease)}
.btn:active,.yd-btn:active{scale:.97}

/* ---------- FICHA DE CADA YATE ---------- */
.yd-hero{background:#fff}
.yd-hero-img{border-radius:0;box-shadow:none;aspect-ratio:4/3}
.yd-hero-img img{transition:none}
.yd-count{border-radius:0;background:rgba(7,31,53,.88)}
.yd-stats li{border-radius:0;border-color:rgba(7,31,53,.14)}
.yd-stats b{font-variant-numeric:tabular-nums}

/* galería: todas las fotos del mismo formato y tamaño */
.yg{columns:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.yg-item{margin:0;border-radius:0;aspect-ratio:3/4;background:rgba(7,31,53,.06)}
.yg-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--pn-ease),filter .3s}
@media(hover:hover) and (pointer:fine){.yg-item:hover img{transform:scale(1.05);filter:brightness(.9)}}
.yg-play{background:#fff}
.yg-play:after{border-left-color:var(--pn-navy)}

.yd-card,.yd-note{border-radius:0}
.yd-card li:before{border-color:var(--pn-navy)}

/* otros yates: mismo formato y orden de la flota */
.yo-card{border-radius:0}
.yo-card img{aspect-ratio:4/3;object-fit:cover;transition:transform .7s var(--pn-ease)}
.yo-card{overflow:hidden}
@media(hover:hover) and (pointer:fine){.yo-card:hover{transform:translateY(-4px)}.yo-card:hover img{transform:scale(1.05)}}
.yo-card:hover{box-shadow:0 18px 36px -22px rgba(7,31,53,.5)}

.ylb{background:rgba(7,31,53,.96)}

/* ---------- GALERÍA ---------- */
.gal{grid-template-columns:repeat(2,minmax(0,1fr))}
.card.big,.card.md,.card.sm{grid-column:span 1;aspect-ratio:4/3}
.card img{transition:opacity 1s ease,transform 1.2s var(--pn-ease)}
@media(hover:hover) and (pointer:fine){.galink:hover .card img.on{transform:scale(1.04)}}

/* ---------- MENÚ DESPLEGABLE PROPIO (formularios) ---------- */
.dd{position:relative}
.dd-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0;pointer-events:none;overflow:hidden}
.dd-btn{width:100%;min-height:48px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#fff;border:1px solid var(--line,rgba(7,31,53,.14));color:var(--pn-navy);font:inherit;font-size:.93rem;text-align:left;cursor:pointer;
  transition:border-color .2s,scale .16s var(--pn-ease)}
.dd-btn>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.dd-btn.is-ph{color:rgba(7,31,53,.55)}
@media(hover:hover) and (pointer:fine){.dd-btn:hover{border-color:var(--pn-navy)}}
.dd-btn:active{scale:.98}
.dd-btn .chev{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;flex:none;transition:transform .25s var(--pn-ease)}
.dd.open .dd-btn{border-color:var(--pn-navy)}
.dd.open .chev{transform:rotate(180deg)}
.dd-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;background:#fff;color:var(--pn-navy);padding:6px 0;margin:0;list-style:none;
  border:1px solid rgba(7,31,53,.12);box-shadow:0 22px 40px -18px rgba(7,31,53,.45); /* taste-skill-ignore: menú desplegable real */
  max-height:320px;overflow:auto;opacity:0;visibility:hidden;transform:translateY(-6px) scale(.98);transform-origin:50% 0;
  transition:opacity .16s ease-out,transform .16s ease-out,visibility 0s linear .16s}
.dd.open .dd-list{opacity:1;visibility:visible;transform:none;transition:opacity .2s cubic-bezier(.23,1,.32,1),transform .2s cubic-bezier(.23,1,.32,1),visibility 0s}
.dd.up .dd-list{top:auto;bottom:calc(100% + 6px);transform-origin:50% 100%;transform:translateY(6px) scale(.98)}
.dd.up.open .dd-list{transform:none}
.dd-list{min-width:100%;width:max-content;max-width:min(340px,90vw)}
.dd-list li{white-space:nowrap;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;padding:0 14px;cursor:pointer;font-size:.93rem;transition:background-color .12s}
.dd-list li.act{background:rgba(7,31,53,.07)}
.dd-list li[aria-selected="true"]{font-weight:600}
.dd-list .ck{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;opacity:0}
.dd-list li[aria-selected="true"] .ck{opacity:1}
.dd.bad .dd-btn{border-color:#a32323}

/* ---------- FILAS DESLIZABLES EN CELULAR (sin botones) ---------- */
.row-wrap{position:relative}
.swipe{display:none}
@media(max-width:900px){
  :root{--g:26px}
  .yo{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:46vw;gap:12px;
    overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--g));padding:0 var(--g) 6px;scroll-padding:0 var(--g)}
  .yg{grid-template-columns:none;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:34vw;gap:10px;
    overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--g));padding:0 var(--g) 6px;scroll-padding:0 var(--g)}
  .yo::-webkit-scrollbar,.yg::-webkit-scrollbar{display:none}
  .yo>*,.yg>*{scroll-snap-align:start}
  .swipe{display:flex;align-items:center;gap:10px;position:absolute;z-index:3;right:12px;top:42%;
    padding:10px 16px 10px 12px;background:var(--pn-navy);color:#fff;font-size:.8rem;font-weight:600;pointer-events:none;
    box-shadow:0 10px 24px -10px rgba(7,31,53,.6); /* taste-skill-ignore: aviso flotante */
    transition:opacity .35s ease-out,transform .35s ease-out}
  .swipe.gone{opacity:0;transform:translateX(12px)}
  .sw-track{position:relative;width:34px;height:14px}
  .sw-track::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:rgba(255,255,255,.3)}
  .sw-dot{position:absolute;top:50%;left:22px;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:#fff;animation:swipeDot 1.6s cubic-bezier(.77,0,.175,1) infinite}
}
@media(max-width:560px){
  .yg{grid-auto-columns:42vw}
  .yo{grid-auto-columns:68vw}
  .gal{grid-template-columns:1fr}
}
@media(max-width:768px){:root{--g:20px}}
@media(max-width:400px){:root{--g:16px}}
@keyframes swipeDot{0%,15%{transform:translateX(0);opacity:1}60%{transform:translateX(-22px);opacity:1}80%,100%{transform:translateX(-22px);opacity:0}}
@media(prefers-reduced-motion:reduce){.sw-dot{animation:none;left:4px}}