/* ============================================================
   tour-refine-v63.css · loaded LAST on individual boat-tour pages.
   Three jobs:
     1 · TIMELINE  — light touch-up of the by-the-hour schedule
         (circular gold-ringed nodes on a drawn rail) + reveal anim.
     2 · ROUTE MAP — replaces the dot-and-line sea-chart with a
         clean framed map placeholder + a stop legend.
     3 · PRACTICAL DETAILS — one unified editorial panel.
   Palette: navy #0C2342/#16263a · gold #C19A4D/#A9843A/#E4CB94 ·
   cream #F4EBD9 · off-white #F4EFE6.
   ============================================================ */

/* ============================================================
   1 · BY-THE-HOUR TIMELINE  (.itin-v2)
   ============================================================ */
@media(min-width:641px){
  .itin-v2 .itin-list{position:relative!important;}
  .itin-v2 .itin-item{grid-template-columns:58px 1fr!important;column-gap:24px!important;padding:22px 6px!important;position:relative!important;align-items:start!important;}
  /* icon → circular cream node with a gold keyline */
  .itin-v2 .itin-item .itin-ic{width:58px!important;height:58px!important;display:flex!important;align-items:center;justify-content:center;border-radius:50%!important;background:#F4EBD9!important;color:#16263a!important;box-shadow:inset 0 0 0 1.5px rgba(193,154,77,.55),0 10px 20px -14px rgba(22,38,58,.55)!important;position:relative;z-index:1;align-self:start!important;}
  .itin-v2 .itin-item .itin-ic svg{width:27px!important;height:27px!important;stroke-width:1.75!important;}
  /* rail: a segment per item that reaches exactly to the next node */
  .itin-v2 .itin-item:not(:last-child)::after{content:""!important;display:block!important;position:absolute;left:35px;top:51px;width:2px;height:100%;transform:translateX(-1px);background:linear-gradient(180deg,rgba(193,154,77,.7),rgba(193,154,77,.32));z-index:0;}
  .itin-v2 .itin-item .t{margin-top:1px!important;}
  .itin-v2 .itin-item h4{transition:color .25s ease;}
  .itin-v2 .itin-item:hover h4{color:#0C2342!important;}
  .itin-v2 .itin-item:hover .itin-ic{box-shadow:inset 0 0 0 1.5px rgba(193,154,77,.9),0 14px 26px -14px rgba(22,38,58,.6)!important;}
}

/* reveal (both breakpoints; guarded by html.tt-anim so no-JS stays visible) */
html.tt-anim .itin-v2 .itin-item{opacity:0;transform:translateY(14px);}
html.tt-anim .itin-v2 .itin-list.tt-run .itin-item{opacity:1;transform:none;transition:opacity .55s ease,transform .6s cubic-bezier(.2,.8,.3,1);transition-delay:calc(var(--i,0)*80ms);}
@media(min-width:641px){
  html.tt-anim .itin-v2 .itin-item:not(:last-child)::after{transform:translateX(-1px) scaleY(0);transform-origin:top center;}
  html.tt-anim .itin-v2 .itin-list.tt-run .itin-item:not(:last-child)::after{transform:translateX(-1px) scaleY(1);transition:transform .6s ease;transition-delay:calc(var(--i,0)*80ms + 40ms);}
}
@media(prefers-reduced-motion:reduce){
  html.tt-anim .itin-v2 .itin-item{opacity:1!important;transform:none!important;}
  html.tt-anim .itin-v2 .itin-item::after{transform:translateX(-1px) scaleY(1)!important;}
}

/* ============================================================
   2 · ROUTE MAP → framed placeholder + stop legend
   ============================================================ */
.tour-map{margin-top:clamp(26px,3.2vw,44px);}
.tour-map-frame{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:100/47;min-height:230px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#eef2f6,#e0e7ee);box-shadow:0 42px 82px -54px rgba(10,22,44,.55),inset 0 0 0 1px rgba(22,38,58,.09);}
/* faint chart grid, faded at the edges */
.tour-map-frame::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(22,38,58,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(22,38,58,.055) 1px,transparent 1px);background-size:40px 40px;-webkit-mask:radial-gradient(125% 105% at 50% 42%,#000 45%,transparent 80%);mask:radial-gradient(125% 105% at 50% 42%,#000 45%,transparent 80%);}
/* a soft "landmass" wash so the empty state reads as a map */
.tour-map-frame::after{content:"";position:absolute;width:52%;height:74%;right:8%;bottom:-14%;border-radius:46% 54% 60% 40%/50% 42% 58% 50%;background:radial-gradient(120% 120% at 40% 30%,rgba(193,154,77,.16),rgba(193,154,77,.05) 60%,transparent 72%);}
.tour-map-badge{position:absolute;left:16px;top:16px;z-index:3;display:inline-flex;align-items:center;gap:8px;background:#0C2342;color:#E4CB94;font:800 11px/1 var(--f-body,'Manrope',sans-serif);letter-spacing:.16em;text-transform:uppercase;padding:9px 14px;border-radius:999px;box-shadow:0 10px 22px -12px rgba(10,22,44,.6);}
.tour-map-badge svg{width:13px;height:13px;}
.tour-map-empty{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:9px;padding:24px;}
.tour-map-empty .pin{width:44px;height:44px;color:#A9843A;filter:drop-shadow(0 8px 14px rgba(169,132,58,.28));}
.tour-map-empty b{font:800 12px/1 var(--f-body,'Manrope',sans-serif);letter-spacing:.2em;text-transform:uppercase;color:#16263a;}
.tour-map-empty span{font-size:13px;line-height:1.5;color:#5c6674;max-width:36ch;}
.tour-map-legend{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:16px 0 0;padding:0;}
.tour-map-legend li{display:inline-flex;align-items:center;gap:7px;font:600 13px/1 var(--f-body,'Manrope',sans-serif);color:#39485a;background:#fff;border:1px solid rgba(22,38,58,.12);border-radius:999px;padding:9px 14px;box-shadow:0 8px 18px -14px rgba(22,38,58,.5);}
.tour-map-legend li .dot{width:9px;height:9px;border-radius:50%;background:rgba(193,154,77,.4);box-shadow:0 0 0 3px rgba(193,154,77,.13);flex:0 0 auto;}
.tour-map-legend li:first-child .dot,.tour-map-legend li:last-child .dot{background:#C19A4D;box-shadow:0 0 0 3px rgba(193,154,77,.22);}
.tour-map-cap{margin:14px 0 0;font-size:13.5px;line-height:1.55;color:#6a7686;max-width:60ch;}

html.tt-anim .tour-map{opacity:0;transform:translateY(18px);}
html.tt-anim .tour-map.tt-run{opacity:1;transform:none;transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.3,1);}
@media(prefers-reduced-motion:reduce){html.tt-anim .tour-map{opacity:1!important;transform:none!important;}}

@media(max-width:600px){
  .tour-map-frame{aspect-ratio:auto;height:280px;min-height:0;}
  .tour-map-empty .pin{width:38px;height:38px;}
}

/* ============================================================
   3 · PRACTICAL DETAILS → one unified editorial panel
   (was: three separate floating cards with big numerals)
   ============================================================ */
.p43-gtk{background:#F4EFE6!important;padding:clamp(56px,7vw,92px) 0!important;}
.p43-gtk .p43-gtk-cols{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:0!important;margin-top:clamp(28px,3.2vw,44px)!important;background:#fff!important;border:1px solid rgba(22,38,58,.08)!important;border-radius:20px!important;overflow:hidden;box-shadow:0 34px 66px -44px rgba(22,38,58,.42)!important;position:relative;}
.p43-gtk .p43-gtk-cols::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#C19A4D,#E4CB94 60%,#C19A4D);z-index:2;}
.p43-gtk .p43-gtk-cols > div{display:block!important;background:transparent!important;border:none!important;border-left:1px solid rgba(22,38,58,.1)!important;border-radius:0!important;box-shadow:none!important;padding:clamp(30px,2.7vw,42px) clamp(26px,2.3vw,36px)!important;transform:none!important;transition:background .3s ease!important;}
.p43-gtk .p43-gtk-cols > div:first-child{border-left:none!important;}
.p43-gtk .p43-gtk-cols > div:hover{transform:none!important;box-shadow:none!important;background:rgba(193,154,77,.055)!important;}
.p43-gtk .gtk-n{display:inline-block!important;margin:0 0 15px!important;padding:0 0 9px!important;font:800 12px/1 var(--f-body,'Manrope',sans-serif)!important;letter-spacing:.18em!important;color:#A9843A!important;border-bottom:2px solid rgba(193,154,77,.38)!important;}
.p43-gtk .p43-gtk-cols h3{grid-column:auto!important;grid-row:auto!important;margin:0 0 10px!important;font-family:var(--f-display,'Archivo',sans-serif)!important;font-size:18.5px!important;font-weight:700!important;letter-spacing:-.01em!important;color:#16263a!important;text-transform:none!important;}
.p43-gtk .p43-gtk-cols p{grid-column:auto!important;grid-row:auto!important;margin:0!important;padding:0!important;border:none!important;font-size:14.5px!important;line-height:1.62!important;color:#4a5562!important;}
@media(max-width:760px){
  .p43-gtk .p43-gtk-cols{grid-template-columns:1fr!important;}
  .p43-gtk .p43-gtk-cols > div{border-left:none!important;border-top:1px solid rgba(22,38,58,.1)!important;}
  .p43-gtk .p43-gtk-cols > div:first-child{border-top:none!important;}
}