/* Cruzeiros: lista (Loja/CruzeirosPage.cs) e pagina do navio (Loja/CruzeiroPage.cs, com camarote.css e atracoes.css).
   Prototipos: "docs/prototipo/Cruzeiros temáticos e navios no Carnaval 2027.html" e navio_interna.html. */
.cru-h{background:linear-gradient(160deg,#0b3a66,#0f1d33 60%)}
.cru-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-width:720px;margin-top:16px;padding:5px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.cru-tabs button{display:grid;gap:1px;text-align:left;padding:10px 14px;border:0;border-radius:12px;background:transparent;color:#fff;font:inherit;cursor:pointer}
.cru-tabs b{font-size:16px}.cru-tabs small{font-size:12.5px;color:#b9c6dc}
.cru-tabs button[aria-selected="true"]{background:var(--yellow);color:#0f1d33}
.cru-tabs button[aria-selected="true"] small{color:#24324a}
section[role="tabpanel"][hidden]{display:none}

.nfil{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:14px}
.nfil button{flex:none;display:flex;gap:8px;align-items:center;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:7px 14px;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.nfil button small{font-size:12px;color:var(--muted)}
.nfil button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.nfil button[aria-pressed="true"] small{color:inherit;opacity:.7}

.crg{display:grid;gap:12px}
@media (min-width:760px){.crg{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.crg{grid-template-columns:repeat(3,minmax(0,1fr))}}
.crc{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.crc[hidden]{display:none}
.crc.hl{border:2px solid var(--action)}
.crc-h{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}
.crc h3{font-family:var(--display);font-stretch:85%;font-size:20px;font-weight:900;line-height:1.08;margin:0}
.crc h3 a{color:var(--ink);text-decoration:none}.crc h3 a:hover{color:var(--action)}
.crc-s{margin:2px 0 0;font-size:12.5px;color:var(--muted)}
.crc-a{margin:0;font-size:14px;color:var(--ink-2)}.crc-a b{color:var(--ink)}
.crc-r{margin:0;font-size:12.5px;color:var(--ink-2);display:grid;gap:1px}
.crc-r span{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.crc .pz{margin-top:auto}
.crc .cc-acts{display:flex;gap:6px}
.crc .cc-acts .btn{flex:1;justify-content:center;text-decoration:none;display:inline-flex;align-items:center}
.cdt{display:grid;place-items:center;width:52px;height:56px;border-radius:12px;background:#0f1d33;color:#fff;line-height:1;flex:none}
.cdt b{font-family:var(--display);font-stretch:85%;font-size:24px;font-weight:900}
.cdt small{font-size:11px;font-weight:800;text-transform:uppercase;color:var(--yellow)}
.ssa{align-self:start;font-size:10.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;background:var(--yellow);color:#0f1d33;padding:3px 7px;border-radius:6px;white-space:nowrap}

.pz{display:grid;gap:6px;margin-top:10px}
.pz p{margin:0;font-size:13px;color:var(--muted)}
.pz-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pz-c{border:1px solid var(--line);border-radius:12px;padding:9px 12px;display:grid;gap:2px;line-height:1.2;background:var(--surface);min-width:0}
.pz-c small{font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pz-c b{font-family:var(--display);font-stretch:85%;font-size:21px;font-weight:900;font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.pz-c span{font-size:12px;font-weight:600;color:var(--muted)}
.pz-c span.ok{color:var(--ok);font-weight:700}
.pz-a{background:var(--chip);border-color:transparent}
.pz-c.sc b{font-size:18px}
.pz-buy{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
.pz-buy .fin{height:auto;min-height:56px;border-radius:12px;font-size:15px;justify-content:center;text-align:center;white-space:normal;line-height:1.15;color:#fff;display:flex;align-items:center;text-decoration:none}
@media (max-width:520px){.pz-buy{grid-template-columns:repeat(2,minmax(0,1fr))}.pz-buy .fin{grid-column:1/-1}.pz-c{padding:7px 9px}.pz-c b{font-size:17px}}

/* linha do tempo dos navios no Carnaval */
.gh{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}
.gantt{display:grid;grid-template-columns:130px repeat(var(--n),minmax(0,1fr));gap:4px 0;padding:12px;border-radius:16px;background:var(--surface);border:1px solid var(--line);margin-bottom:14px;min-width:0}
.gt-h,.gt-r{display:contents}
.gt-h i{font-style:normal;text-align:center;font-size:11px;font-weight:800;color:var(--muted);padding:2px 0}
.gt-h i.cv{color:#0f1d33;background:var(--yellow)}
.gt-r>span{grid-column:1;font-size:13px;font-weight:800;align-self:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:8px}
.gt-l{grid-column:calc(var(--a) + 1)/calc(var(--b) + 1);height:26px;border-radius:999px;background:#2b7ad6;display:flex;align-items:center;padding:0 10px;min-width:0}
.gt-r:nth-child(odd) .gt-l{background:#123d7a}
.gt-l.sv{background:linear-gradient(90deg,#d9602b,#e88a2f)}
.gt-l b{font-size:11.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:640px){.gantt{grid-template-columns:86px repeat(var(--n),minmax(0,1fr));padding:10px 8px}.gt-l{padding:0}.gt-l b{font-size:0}.gt-r>span{font-size:11.5px}.gt-h i{font-size:9.5px}}

.inx{display:grid;gap:10px}
@media (min-width:760px){.inx{grid-template-columns:1.4fr 1fr}.ix.ok ul{grid-template-columns:1fr 1fr}}
.ix{padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.ix>b{display:block;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}
.ix.ok>b{color:var(--ok)}.ix.no>b{color:#b42330}
.ix ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ix li{display:flex;gap:8px;font-size:14px;align-items:flex-start}
.ix.ok li::before{content:'✓';color:var(--ok);font-weight:900}
.ix.no li::before{content:'×';color:#b42330;font-weight:900;font-size:16px;line-height:1.1}

.ah-con{display:grid;gap:14px;padding:18px;border-radius:18px;background:#0f1d33;color:#fff}
.ah-con h2{color:#fff;margin:0}.ah-con p{margin:4px 0 0;color:#b9c6dc}
@media (min-width:900px){.ah-con{grid-template-columns:minmax(0,.8fr) minmax(0,2fr);align-items:center}}
.cons{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.cn{display:grid;gap:1px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#fff;text-decoration:none}
.cn b{font-size:15px}.cn small{font-size:12.5px;color:#b9c6dc}
.cn.wa{background:#1fa855;border-color:#1fa855}.cn.wa small{color:#e3f7ea}
.cn:hover{filter:brightness(1.1)}

/* pagina do navio */
.ncap{position:relative;display:block;overflow:hidden;aspect-ratio:16/9;border-radius:14px;background:linear-gradient(135deg,#2b7ad6,#0f1d33)}
.ncap.big{aspect-ratio:4/3;border-radius:18px}
.ncap img{width:100%;height:100%;object-fit:cover;display:block}
.cab{display:grid;gap:4px}
.cb-h,.cb-r{display:grid;grid-template-columns:118px repeat(var(--n),minmax(0,1fr));gap:4px;align-items:center}
.cb-h span{text-align:center;font-size:12.5px;font-weight:800;line-height:1.1}
.cb-h small{display:block;font-size:10.5px;font-weight:600;color:var(--muted)}
.cb-t{font-size:13.5px;font-weight:800;line-height:1.15}
.cb-na{text-align:center;color:var(--muted)}
.cbx{display:grid;place-items:center;height:46px;border-radius:10px;border:1px solid var(--line);background:var(--chip);font-family:var(--display);font-stretch:85%;font-size:17px;font-weight:900;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums}
.cbx:hover{border-color:var(--ink);background:var(--surface)}
@media (max-width:520px){.cb-h,.cb-r{grid-template-columns:84px repeat(var(--n),minmax(0,1fr))}.cbx{font-size:14.5px}.cb-t{font-size:12.5px}}
.atb{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.atr-c{display:grid;justify-items:center;gap:6px;text-align:center;padding:12px 8px;border-radius:14px;background:var(--surface);border:1px solid var(--line);color:var(--ink);text-decoration:none}
a.atr-c:hover{border-color:var(--action)}
.atr-c b{font-size:14px;line-height:1.2}
.atr-c small{font-size:11.5px;font-weight:800;color:var(--action);text-transform:uppercase;letter-spacing:.06em}
.atr-c.main{background:var(--yellow);border-color:transparent}.atr-c.main small{color:#0f1d33}
.wa-b{text-decoration:none;color:var(--ink);border-style:solid;border-color:#bfe0c9;background:#e8f4ec}
.wa-b svg{color:#1fa855}
.cru-o .cdt{width:44px;height:48px}.cru-o .cdt b{font-size:20px}
.cru-o small{color:var(--muted)}
.cond{margin-top:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:10px 14px}
.cond summary{cursor:pointer;font-weight:800}
.cond-t{font-size:14px;color:var(--ink-2)}
.cond-t li{margin:4px 0}
.exb .btn{justify-self:end;white-space:nowrap}

/* Selos da agencia (Top MSC, Top 1 em promocao) e "quantos ja embarcaram": ao lado do topo da lista e na pagina do navio */
.cru-hg{display:grid;gap:18px;align-items:center}
@media (min-width:900px){.cru-hg{grid-template-columns:minmax(0,1fr) 300px;gap:32px}}
.cru-selos{display:grid;gap:10px;justify-items:center;text-align:center}
.cru-selos .sl-i{display:flex;gap:14px;justify-content:center;align-items:center}
.cru-selos .sl-i img{width:104px;height:104px;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35))}
.cru-selos .sl-i a{display:inline-flex;transition:transform .15s}.cru-selos .sl-i a:hover{transform:scale(1.04)}
.cru-selos .sl-p{margin:0;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#d5deec;font-size:14px;line-height:1.35}
.cru-selos .sl-p b{display:block;font-family:var(--display);font-stretch:85%;font-size:24px;font-weight:900;color:var(--yellow)}
@media (max-width:899px){.cru-selos{grid-template-columns:auto minmax(0,1fr);justify-items:start;text-align:left;align-items:center}
  .cru-selos .sl-i{gap:6px}.cru-selos .sl-i img{width:64px;height:64px}.cru-selos .sl-p{font-size:13px}.cru-selos .sl-p b{font-size:20px}}
.cru-selos.claro{grid-template-columns:auto minmax(0,1fr);justify-items:start;text-align:left;align-items:center;margin:12px 0}
.cru-selos.claro .sl-i{gap:6px}.cru-selos.claro .sl-i img{width:62px;height:62px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.18))}
.cru-selos.claro .sl-p{background:var(--surface);border-color:var(--line);color:var(--ink-2);font-size:13px}
.cru-selos.claro .sl-p b{font-size:19px;color:var(--ink)}
