/* ============================================================
   home-r7.css · Round 7 homepage redesigns
   Loaded LAST on index.html (after bundle-home.css + interludes.css)
   1. Fleet category cards  (.fleet-cats .cat-card)
   2. Featured tours hover-reveal  (.featured .ftx16-card)
   3. Crew "every cove" editorial collage  (.crewx)
   4. Transfers sea/land switcher  (.txsw)
   ============================================================ */

/* ---------- shared tokens ---------- */
.fleet-cats, .featured, .crewx, .transfers {
  --r7-navy:#0f2747; --r7-ink:#16202d; --r7-ink3:#5b6472;
  --r7-warm:#c97a3f; --r7-teal:#1f6f8b; --r7-green:#2f8f6b;
  --r7-line:rgba(15,39,71,.12);
  --r7-f-disp:var(--f-display,"Archivo","Hanken Grotesk",system-ui,sans-serif);
  --r7-f-body:var(--f-body,"Manrope","Hanken Grotesk",system-ui,sans-serif);
}

/* ============================================================
   1 · FLEET CATEGORY CARDS — image-forward, accent per type,
   circular up-right arrow (matches boat-card style)
   ============================================================ */
.fleet-cats .cats-grid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:clamp(18px,2vw,26px) !important;
}
.fleet-cats .cat-card{
  --acc:var(--r7-teal);
  display:flex !important; flex-direction:column !important;
  background:#fff !important; border:1px solid var(--r7-line) !important;
  border-radius:22px !important; overflow:hidden !important;
  text-decoration:none !important;
  box-shadow:0 18px 40px -30px rgba(15,39,71,.4) !important;
  transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease, border-color .3s ease !important;
}
.fleet-cats .cat-card:nth-child(1){ --acc:var(--r7-teal); }
.fleet-cats .cat-card:nth-child(2){ --acc:var(--r7-warm); }
.fleet-cats .cat-card:nth-child(3){ --acc:var(--r7-green); }
.fleet-cats .cat-card:hover{
  transform:translateY(-6px) !important;
  box-shadow:0 30px 60px -30px rgba(15,39,71,.5) !important;
  border-color:color-mix(in srgb, var(--acc) 40%, transparent) !important;
}
.fleet-cats .cat-img{
  position:relative !important; aspect-ratio:4/3 !important;
  overflow:hidden !important; margin:0 !important;
}
.fleet-cats .cat-img img{
  width:100% !important; height:100% !important; object-fit:cover !important;
  transition:transform .8s cubic-bezier(.2,.7,.2,1) !important;
}
.fleet-cats .cat-card:hover .cat-img img{ transform:scale(1.06) !important; }
.fleet-cats .cat-count{
  position:absolute !important; left:14px !important; top:14px !important; right:auto !important; bottom:auto !important;
  background:rgba(15,39,71,.72) !important; backdrop-filter:blur(6px);
  color:#fff !important; font:600 12px/1 var(--r7-f-body) !important;
  letter-spacing:.02em !important; padding:8px 12px !important; border-radius:999px !important;
}
.fleet-cats .cat-body{
  position:relative !important;
  padding:22px 22px 20px !important; display:flex !important; flex-direction:column !important;
  gap:16px !important; flex:1 1 auto !important;
  border-top:3px solid var(--acc) !important;
}
.fleet-cats .cat-body h3{
  display:flex !important; align-items:center !important; gap:11px !important;
  margin:0 !important; font-family:var(--r7-f-disp) !important;
  font-size:clamp(20px,1.7vw,24px) !important; font-weight:600 !important;
  letter-spacing:-.02em !important; color:var(--r7-ink) !important;
}
.fleet-cats .cat-body h3 .cat-tic{ width:26px !important; height:26px !important; color:var(--acc) !important; flex:0 0 auto; }
.fleet-cats .cat-specs{
  list-style:none !important; margin:0 !important; padding:16px 0 0 !important;
  border-top:1px solid var(--r7-line) !important;
  display:flex !important; flex-wrap:nowrap !important; gap:0 !important;
}
.fleet-cats .cat-specs li{
  flex:1 1 0 !important; min-width:0 !important;
  display:flex !important; flex-direction:column !important; gap:4px !important; align-items:flex-start !important;
  background:none !important; border:0 !important; border-left:1px solid var(--r7-line) !important;
  border-radius:0 !important; padding:0 14px !important;
}
.fleet-cats .cat-specs li:first-child{ padding-left:0 !important; border-left:0 !important; }
.fleet-cats .cat-specs li .cat-dic{ display:none !important; }
.fleet-cats .cat-specs li span{ display:inline !important; font:500 10px/1.1 var(--r7-f-body) !important; letter-spacing:.09em !important; text-transform:uppercase !important; color:var(--r7-ink3) !important; }
.fleet-cats .cat-specs li strong{ font:600 14px/1.25 var(--r7-f-disp) !important; color:var(--r7-ink) !important; }
/* clean inline text link — no button box, no circular arrow crowding the label */
.fleet-cats .cat-link{
  margin-top:auto !important; display:inline-flex !important; align-items:center !important;
  justify-content:flex-start !important; align-self:flex-start !important; gap:9px !important;
  font:600 14.5px/1 var(--r7-f-body) !important; color:var(--acc) !important;
  background:none !important; border:0 !important; border-radius:0 !important; padding:6px 0 0 !important;
}
.fleet-cats .cat-link svg{
  width:20px !important; height:12px !important; flex:0 0 auto !important;
  padding:0 !important; border-radius:0 !important; background:none !important;
  color:var(--acc) !important; box-sizing:content-box !important;
  transform:none !important;
  transition:transform .25s ease !important;
}
.fleet-cats .cat-card:hover .cat-link svg{
  background:none !important; color:var(--acc) !important;
  transform:translateX(5px) !important;
}
@media(max-width:820px){
  .fleet-cats .cats-grid{ grid-template-columns:1fr !important; }
}

/* ============================================================
   2 · FEATURED TOURS — hover pushes copy up + reveals a brief
   ============================================================ */
.featured .ftx16-card{ position:relative; overflow:hidden; display:flex !important; flex-direction:column !important; justify-content:flex-end !important; }
.featured .ftx16-body{ margin-top:auto !important; width:100%; }
.featured .ftx16-body{ transition:transform .38s cubic-bezier(.2,.7,.2,1); }
.featured .ftx16-desc{
  margin:0; overflow:hidden;
  max-height:0; opacity:0;
  transform:translateY(6px);
  color:rgba(255,255,255,.9);
  font:400 14px/1.5 var(--r7-f-body);
  transition:max-height .4s ease, opacity .32s ease, margin .4s ease, transform .4s ease;
}
.featured .ftx16-card:hover .ftx16-desc,
.featured .ftx16-card:focus-within .ftx16-desc{
  max-height:120px; opacity:1; margin:10px 0 2px; transform:translateY(0);
}
/* strengthen the scrim on hover so the brief stays readable */
.featured .ftx16-scrim{ transition:opacity .35s ease, background .35s ease; }
.featured .ftx16-card:hover .ftx16-scrim{
  background:linear-gradient(to top, rgba(9,20,38,.92) 0%, rgba(9,20,38,.66) 42%, rgba(9,20,38,.12) 100%) !important;
  opacity:1 !important;
}
@media(hover:none){
  .featured .ftx16-desc{ max-height:120px; opacity:1; margin:10px 0 2px; transform:none; }
}

/* ============================================================
   3 · CREW — editorial collage (white story panel overlapping
   a 3-photo media cluster). Distinct from cove-life / old 2-col.
   ============================================================ */
.crewx{
  position:relative; isolation:isolate; overflow:hidden;
  background:#0e2340 !important;
  padding:clamp(56px,6.5vw,104px) 0 !important;
}
.crewx .wrap{ position:relative; z-index:2; }
.crewx .crewx-collage{
  position:relative;
  min-height:clamp(480px,48vw,600px);
}
/* full-bleed photo montage behind everything */
.crewx .crewx-media{
  position:absolute; inset:0; z-index:0;
  display:grid; grid-template-columns:1.25fr 1fr; grid-template-rows:1fr 1fr;
  gap:10px; height:100%;
}
.crewx .crewx-media figure{ margin:0; overflow:hidden; border-radius:16px; background:#102C54; box-shadow:none; }
.crewx .crewx-media figure img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s ease; }
.crewx .crewx-media figure:hover img{ transform:scale(1.05); }
.crewx .crewx-media .m1{ grid-column:1; grid-row:1 / 3; }
.crewx .crewx-media .m2{ grid-column:2; grid-row:1; }
.crewx .crewx-media .m3{ grid-column:2; grid-row:2; }
.crewx .crewx-collage::after{
  content:""; position:absolute; inset:0; z-index:1; border-radius:16px;
  background:linear-gradient(90deg, rgba(9,22,42,.36) 0%, rgba(9,22,42,.10) 44%, rgba(9,22,42,.52) 100%);
}
/* seal / stamp badge — bigger, tilted, top-left */
.crewx .crewx-badge2{
  position:absolute; left:clamp(14px,2.4vw,32px); top:clamp(14px,2.4vw,32px);
  width:clamp(110px,11vw,140px); height:clamp(110px,11vw,140px);
  border-radius:999px; z-index:4;
  background:var(--r7-warm); color:#fff;
  border:2px solid rgba(255,255,255,.92);
  box-shadow:0 22px 46px -16px rgba(0,0,0,.55);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  transform:rotate(-14deg);
}
.crewx .crewx-badge2::before{ content:""; position:absolute; inset:7px; border:1.5px dashed rgba(255,255,255,.6); border-radius:999px; }
.crewx .crewx-badge2 b{ font:700 clamp(34px,3.6vw,46px)/1 var(--r7-f-disp); }
.crewx .crewx-badge2 span{ font:600 10.5px/1.1 var(--r7-f-body); letter-spacing:.18em; text-transform:uppercase; margin-top:4px; opacity:.95; }
/* floating white story panel, top-right */
.crewx .crewx-panel{
  position:relative; z-index:3;
  width:min(500px,100%); margin-left:auto;
  margin-top:clamp(84px,10vw,140px);
  background:#fff; border-radius:22px;
  padding:clamp(28px,3vw,42px);
  box-shadow:0 40px 80px -34px rgba(0,0,0,.6);
}
.crewx .crewx-panel h2{
  margin:0; font-family:var(--r7-f-disp);
  font-size:clamp(28px,3vw,44px); line-height:1.02; letter-spacing:-.032em;
  font-weight:600; color:var(--r7-ink);
}
.crewx .crewx-panel h2 em{ font-style:italic; font-weight:300; color:var(--r7-warm); }
.crewx .crewx-panel p{ margin:16px 0 0; font:400 16px/1.6 var(--r7-f-body); color:var(--r7-ink3); max-width:44ch; }
.crewx{
  position:relative; isolation:isolate; overflow:hidden;
  background:#0e2340 !important;
  padding:clamp(56px,6.5vw,104px) 0 !important;
}
.crewx .wrap{ position:relative; z-index:2; }
.crewx .crewx-collage{ position:relative; }
/* photo montage background — more images */
.crewx .crewx-media{
  display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:1fr 1fr;
  gap:10px; height:clamp(480px,48vw,600px);
}
.crewx .crewx-media figure{ margin:0; overflow:hidden; border-radius:16px; background:#102C54; box-shadow:none; }
.crewx .crewx-media figure img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s ease; }
.crewx .crewx-media figure:hover img{ transform:scale(1.05); }
.crewx .crewx-media .m1{ grid-column:1; grid-row:1 / 3; }
.crewx .crewx-media .m2{ grid-column:2; grid-row:1; }
.crewx .crewx-media .m3{ grid-column:3; grid-row:1; }
.crewx .crewx-media .m4{ grid-column:2; grid-row:2; }
.crewx .crewx-media .m5{ grid-column:3; grid-row:2; }
/* seal / stamp badge — tilted, top-left */
.crewx .crewx-badge2{
  position:absolute; left:clamp(14px,2.4vw,30px); top:clamp(14px,2.4vw,30px);
  width:clamp(104px,10.5vw,132px); height:clamp(104px,10.5vw,132px);
  border-radius:999px; z-index:4;
  background:var(--r7-warm); color:#fff;
  border:2px solid rgba(255,255,255,.92);
  box-shadow:0 22px 46px -16px rgba(0,0,0,.55);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  transform:rotate(-14deg);
}
.crewx .crewx-badge2::before{ content:""; position:absolute; inset:7px; border:1.5px dashed rgba(255,255,255,.6); border-radius:999px; }
.crewx .crewx-badge2 b{ font:700 clamp(32px,3.4vw,44px)/1 var(--r7-f-disp); }
.crewx .crewx-badge2 span{ font:600 10px/1.1 var(--r7-f-body); letter-spacing:.18em; text-transform:uppercase; margin-top:4px; opacity:.95; }
/* contained story card overlapping the montage, strong shadow (as before) */
.crewx .crewx-panel{
  position:absolute; left:0; bottom:clamp(22px,3.5vw,46px); z-index:3;
  width:min(440px,88%);
  background:#fff; border-radius:22px;
  padding:clamp(26px,2.6vw,38px);
  box-shadow:0 54px 104px -30px rgba(0,0,0,.72);
}
.crewx .crewx-panel h2{
  margin:0; font-family:var(--r7-f-disp);
  font-size:clamp(26px,2.7vw,38px); line-height:1.04; letter-spacing:-.03em;
  font-weight:600; color:var(--r7-ink);
}
.crewx .crewx-panel h2 em{ font-style:italic; font-weight:300; color:var(--r7-warm); }
.crewx .crewx-panel p{ margin:14px 0 0; font:400 15.5px/1.6 var(--r7-f-body); color:var(--r7-ink3); }
.crewx .crewx-panel .stats{ display:flex; gap:24px; margin:20px 0 0; padding:18px 0 0; border-top:1px solid var(--r7-line); }
.crewx .crewx-panel .stats div{ display:flex; flex-direction:column; gap:3px; }
.crewx .crewx-panel .stats b{ font:600 24px/1 var(--r7-f-disp); color:var(--r7-navy); }
.crewx .crewx-panel .stats span{ font:500 12px/1 var(--r7-f-body); color:var(--r7-ink3); letter-spacing:.02em; }
.crewx .crewx-panel .sign{ margin-top:20px; font:600 15px/1.35 var(--r7-f-disp); color:var(--r7-ink); }
@media(max-width:900px){
  .crewx .crewx-media{ height:auto; grid-template-columns:1fr 1fr; grid-template-rows:none; grid-auto-rows:150px; }
  .crewx .crewx-media figure{ grid-column:auto; grid-row:auto; }
  .crewx .crewx-media .m1{ grid-column:1 / -1; }
  .crewx .crewx-panel{ position:relative; left:auto; bottom:auto; width:auto; margin-top:16px; }
}
@media(max-width:520px){
  .crewx .crewx-media{ grid-auto-rows:130px; }
  .crewx .crewx-badge2{ width:88px; height:88px; }
  .crewx .crewx-badge2 b{ font-size:28px; }
}
.crewx .crewx-panel .stats div{ display:flex; flex-direction:column; gap:3px; }
.crewx .crewx-panel .stats b{ font:600 26px/1 var(--r7-f-disp); color:var(--r7-navy); }
.crewx .crewx-panel .stats span{ font:500 12.5px/1 var(--r7-f-body); color:var(--r7-ink3); letter-spacing:.02em; }
.crewx .crewx-panel .sign{ margin-top:22px; font:600 15px/1.35 var(--r7-f-disp); color:var(--r7-ink); }
@media(max-width:900px){
  .crewx .crewx-collage{ min-height:0; }
  .crewx .crewx-media{ position:relative; height:auto; grid-template-rows:170px 170px; }
  .crewx .crewx-collage::after{ display:none; }
  .crewx .crewx-panel{ width:auto; margin:16px 0 0; }
}
@media(max-width:520px){
  .crewx .crewx-media{ grid-template-columns:1fr 1fr; grid-template-rows:130px 130px; }
  .crewx .crewx-badge2{ width:92px; height:92px; }
  .crewx .crewx-badge2 b{ font-size:30px; }
}

/* ============================================================
   4 · TRANSFERS — connected segmented switcher (centered),
   custom sea/land icons, white split card w/ real route cards.
   ============================================================ */
.transfers{ background:#eef2f6 !important; color:var(--r7-ink); }
.transfers .tx16-head{ text-align:center; max-width:760px; margin-left:auto; margin-right:auto; }
.transfers .tx16-head .tx16-eyebrow{ display:none !important; }
.transfers .tx16-head h2{ color:var(--r7-ink) !important; }
.transfers .tx16-head .tx16-lead{ color:var(--r7-ink3) !important; margin-left:auto; margin-right:auto; }
.transfers .txsw{ margin-top:clamp(24px,3vw,40px); }
.transfers .txsw > input{ position:absolute; opacity:0; pointer-events:none; }
.transfers .txsw-grid{ display:flex; flex-direction:column; align-items:center; }

/* connected segmented control (one joined pill) */
.transfers .txsw-tabs{
  display:inline-flex; margin:0 auto clamp(22px,2.6vw,36px);
  background:#fff; border:1.5px solid var(--r7-line); border-radius:16px;
  padding:5px; box-shadow:0 16px 36px -28px rgba(15,39,71,.55);
}
/* copy left, switcher right, one row */
.transfers .txsw{ margin-top:0; }
.transfers .txsw-toprow{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:28px; flex-wrap:wrap; width:100%;
  margin-bottom:clamp(26px,3vw,44px);
}
.transfers .txsw-toprow .tx16-head{
  text-align:left; max-width:none; margin:0 !important; flex:1 1 480px;
}
.transfers .txsw-toprow .tx16-lead{ margin:14px 0 0; max-width:54ch; }
.transfers .txsw-toprow .txsw-tabs{ margin:0 0 6px; flex:0 0 auto; }
@media(max-width:800px){
  .transfers .txsw-toprow{ align-items:flex-start; }
  .transfers .txsw-toprow .txsw-tabs{ margin:4px 0 0; }
}
.transfers .txsw-tab{
  display:inline-flex; align-items:center; justify-content:center; gap:10px; cursor:pointer;
  background:none; border:0; border-radius:12px; padding:12px 28px; margin:0;
  color:var(--r7-ink3); font:600 15px/1 var(--r7-f-disp); letter-spacing:-.01em;
  transition:color .2s ease, background .25s ease, box-shadow .25s ease;
}
.transfers .txsw-tab .tibox{ width:26px; height:26px; display:grid; place-items:center; color:currentColor; background:none; border:0; }
.transfers .txsw-tab .tibox svg{ width:24px; height:24px; }
.transfers .txsw-tab .titx{ display:contents; }
.transfers .txsw-tab .titx b, .transfers .txsw-tab b{ font-weight:inherit; color:inherit; font-size:inherit; letter-spacing:inherit; }
.transfers .txsw-tab .titx span{ display:none; }
.transfers .txsw-tab .tichev{ display:none; }
.transfers .txsw-tab:hover{ color:var(--r7-ink); }
#txsw-sea:checked ~ .txsw-grid .txsw-tab--sea,
#txsw-land:checked ~ .txsw-grid .txsw-tab--land{
  background:var(--r7-navy); color:#fff; box-shadow:0 12px 24px -14px rgba(15,39,71,.6);
}

/* white split card — photo slims down, routes take the room */
.transfers .txsw-stage{ position:relative; width:100%; }
.transfers .txsw-panel{
  display:none; grid-template-columns:.72fr 1.28fr; background:#fff;
  border:1px solid var(--r7-line); border-radius:22px; overflow:hidden;
  box-shadow:0 40px 82px -48px rgba(15,39,71,.5); text-align:left;
}
#txsw-sea:checked ~ .txsw-grid .txsw-panel--sea,
#txsw-land:checked ~ .txsw-grid .txsw-panel--land{ display:grid; }
.transfers .txp-photo{ position:relative; min-height:400px; }
.transfers .txp-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.transfers .txp-body{ padding:clamp(28px,3vw,44px); display:flex; flex-direction:column; }
.transfers .txp-body h3{ margin:0; font:600 clamp(23px,2.3vw,32px)/1.08 var(--r7-f-disp); letter-spacing:-.02em; color:var(--r7-ink); }
.transfers .txp-body > p{ margin:12px 0 0; font:400 15px/1.6 var(--r7-f-body); color:var(--r7-ink3); max-width:46ch; }

/* individual-transfer route rows — full width, easy to scan */
.transfers .txp-routes-h{ margin:24px 0 12px; font:600 11px/1 var(--r7-f-body); letter-spacing:.14em; text-transform:uppercase; color:var(--r7-warm); }
.transfers .txp-routes{ display:grid; grid-template-columns:1fr; gap:9px; }
.transfers .txp-route{
  display:flex; flex-direction:row; align-items:center; gap:14px; padding:14px 18px;
  border:1px solid var(--r7-line); border-radius:12px; background:#fff; text-decoration:none;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.transfers .txp-route:hover{ border-color:color-mix(in srgb,var(--r7-navy) 42%,transparent); box-shadow:0 16px 30px -22px rgba(15,39,71,.5); transform:translateY(-2px); }
.transfers .txp-route .rt{ display:flex; align-items:center; gap:10px; flex:1 1 auto; min-width:0; font:600 15.5px/1.2 var(--r7-f-disp); color:var(--r7-ink); letter-spacing:-.01em; }
.transfers .txp-route .rt svg{ width:17px; height:17px; color:var(--r7-navy); flex:0 0 auto; }
.transfers .txp-route .dur{ flex:0 0 auto; font:500 13px/1 var(--r7-f-body); color:var(--r7-ink3); letter-spacing:.02em; }
.transfers .txp-cta{
  margin-top:22px; align-self:flex-start; display:inline-flex; align-items:center; gap:10px;
  background:var(--r7-navy); color:#fff; padding:13px 22px; border-radius:12px;
  font:600 14.5px/1 var(--r7-f-body); text-decoration:none; transition:background .2s ease, gap .2s ease;
}
.transfers .txp-cta:hover{ background:var(--r7-warm); gap:14px; }
.transfers .txp-cta svg{ width:20px; height:14px; }
@media(max-width:860px){
  .transfers .txsw-tabs{ display:flex; width:100%; }
  .transfers .txsw-tab{ flex:1 1 auto; padding:12px 14px; }
  .transfers .txsw-panel{ grid-template-columns:1fr; }
  #txsw-sea:checked ~ .txsw-grid .txsw-panel--sea,
  #txsw-land:checked ~ .txsw-grid .txsw-panel--land{ display:block; }
  .transfers .txp-photo{ min-height:0; height:220px; }
}


/* R8 — fleet category cards: circular up-right arrow on the photo
   (matches boat/yacht cards), static CTAs, no gold hover */
.fleet-cats .cat-img::after{
  content:""; position:absolute; top:14px; right:14px; z-index:3;
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.94) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102C54' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 17L17 7M9 7h8v8'/></svg>") center/18px no-repeat;
  box-shadow:0 12px 26px -12px rgba(15,39,71,.55);
}
.fleet-cats .cat-card:hover{ border-color:rgba(15,39,71,.22) !important; }
.fleet-cats .cat-link,
.fleet-cats .cat-card:hover .cat-link{
  color:var(--r7-navy) !important; background:none !important; gap:9px !important;
}
.fleet-cats .cat-link::after{ display:none !important; }
.fleet-cats .cat-link svg,
.fleet-cats .cat-card:hover .cat-link svg,
a:hover .fleet-cats .cat-link svg{
  transform:none !important; color:var(--r7-navy) !important; transition:none !important;
}

/* R8 — hide eyebrow labels + larger section headings on homepage */
.h-eyebrow{ display:none !important; }
.section-head h2{ font-size:clamp(30px,3.6vw,52px) !important; line-height:1.03 !important; }
