/* Shared vector controls. Their colour follows the surrounding link or button. */
.ui-icon{display:inline-block;width:1.15em;height:1.15em;flex:none;vertical-align:-.18em;color:inherit}
.button .ui-icon,.underlined .ui-icon,.partner-visit .ui-icon{width:18px;height:18px}
.circle-arrow .ui-icon,.escape-arrow .ui-icon{width:20px;height:20px}
.reference-header .menu .ui-icon{width:28px;height:28px;display:block}
.language-chevron .ui-icon{width:16px;height:16px;display:block}
.hero-video-toggle,.rental-video-toggle,.sunset-video-toggle,[data-salpa-pause]{touch-action:manipulation}
.hero-video-toggle .ui-icon,.rental-video-toggle .ui-icon,.sunset-video-toggle .ui-icon,[data-salpa-pause] .ui-icon{width:20px;height:20px;display:block}
.hero-video-toggle{width:48px;height:48px;background:rgba(16,52,62,.78);border:1px solid rgba(255,255,255,.8);box-shadow:0 6px 20px #08222b55;backdrop-filter:blur(8px)}
.rental-video-toggle,.sunset-video-toggle{width:46px;height:46px;background:rgba(16,52,62,.78);border:1px solid rgba(255,255,255,.8);box-shadow:0 6px 20px #08222b55;backdrop-filter:blur(8px)}
.language-dropdown:not([open]) .language-options{display:none}
.language-dropdown[open] .language-options{display:block}
.journey-stop-grid article:not(:last-child):after{content:'';width:18px;height:18px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16m-7-7 7 7-7 7' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}

@media(max-width:900px){
  .reference-header{height:116px;min-height:116px;padding:0 6%;align-items:flex-start;justify-content:flex-end}
  .reference-header .header-logo{left:6%;bottom:7px;width:135px;height:auto;transform:none}
  .reference-header .header-logo img{width:135px;height:auto}
  .reference-header .menu{display:grid;place-items:center;position:absolute;right:6%;top:16px;width:48px;height:48px;padding:0;border:1px solid #ffffff55;border-radius:2px;background:#ffffff08;z-index:102}
  .reference-header nav,body[data-page="index.html"] .reference-header nav{top:100%;left:0;right:0;width:100%;max-height:calc(100dvh - 96px);overflow-y:auto;overscroll-behavior:contain;padding:20px 6% 30px;gap:8px;font-size:17px;box-shadow:0 18px 28px #061f2e55}
  .reference-header nav>a,.reference-header .tour-nav-link{min-height:44px;display:flex;align-items:center;white-space:normal;padding:8px 0}
  .reference-header .nav-dropdown{min-height:44px;align-items:center}
  .reference-header .tours-toggle{width:44px;height:44px;display:grid;place-items:center;padding:0}
  .reference-header .tours-submenu a{min-height:42px;display:flex;align-items:center}
  .language-picker.language-dropdown,body[data-page="index.html"] .reference-header .language-dropdown{position:absolute;left:6%;right:auto;top:16px;bottom:auto;transform:none;align-self:auto;z-index:103}
  .language-dropdown summary{min-height:48px;min-width:145px;display:flex;align-items:center;padding:8px 10px;gap:8px}
  .language-dropdown .language-options{left:0;right:auto;max-width:calc(100vw - 12vw)}
  .language-dropdown .language-link{min-height:44px}
  body[data-page="index.html"]>.reference-header{height:96px;min-height:96px;padding:0 6%}
}

@media(max-width:720px){
  .cup-onboard{grid-template-columns:minmax(0,1fr)}
  .cup-boat-visual{width:100%;min-width:0;min-height:0;height:clamp(250px,75vw,330px);aspect-ratio:auto}
  .collection-opening-copy{width:100%;min-width:0;max-width:100%}
  .collection-opening h1{font-size:clamp(35px,11.4vw,46px);hyphens:auto;overflow-wrap:break-word}
  body[data-page="index.html"] .hero{min-height:700px;height:max(700px,100svh);max-height:none}
  body[data-page="index.html"] .hero-content{width:100%;padding:150px 7% 95px;min-width:0}
  body[data-page="index.html"] .hero-content h1{font-size:clamp(37px,10.2vw,48px);line-height:1.08;letter-spacing:-.035em;max-width:100%;text-wrap:balance}
  body[data-page="index.html"] .hero-content h1 em{max-width:100%}
  body[data-page="index.html"] .hero-buttons{width:100%}
  body[data-page="index.html"] .hero-buttons .button{width:min(100%,330px);min-height:58px;gap:16px;min-width:0}
  .hero-video-toggle{width:48px;height:48px;right:7%;bottom:76px}
  .rental-video-toggle,.sunset-video-toggle{width:48px;height:48px}
  main,.section,.journey-page,.vessel-page,.tour-collection{min-width:0}
  .section-heading,.hero-content,.config-story-copy,.config-panel,.vessel-intro,.detail-story,.detail-booking,.journey-details-card{min-width:0}
  .section img,.section video,.journey-page img,.journey-page video,.vessel-page img,.vessel-page video{max-width:100%}
  input,select,textarea{font-size:16px}
  body[data-page="contact.html"] .floating-contact{display:none}
  dialog{width:calc(100% - 32px);max-width:650px;padding:32px 22px;max-height:calc(100dvh - 30px)}
  dialog h2{font-size:clamp(30px,9vw,42px)}
  .floating-contact{width:52px;height:52px;right:18px;bottom:max(18px,env(safe-area-inset-bottom) + 12px)}
}

@media(max-width:600px){
  #booking-form .form-grid{grid-template-columns:minmax(0,1fr)}
  .config-activities,.config-modes{grid-template-columns:minmax(0,1fr)}
  .config-activity{min-height:82px;gap:14px;padding:11px 14px}
  .config-activity img{width:62px;height:60px;flex:none;object-fit:cover}
  .config-activity strong{font-size:15px;line-height:1.35;overflow-wrap:normal}
  .config-activity .ui-icon{width:19px;height:19px;margin-left:auto}
  .config-mode{min-height:80px;padding:16px 42px 16px 18px}
  .config-mode strong{font-size:16px}
}

@media(max-width:360px){
  body[data-page="index.html"] .hero-content h1{font-size:clamp(35px,10.2vw,38px)}
  body[data-page="index.html"] .hero-content{padding-left:6%;padding-right:6%}
  .reference-header .menu{right:5%}
  .language-picker.language-dropdown,body[data-page="index.html"] .reference-header .language-dropdown{left:5%}
}

/* Compact, softly rounded booking CTA in the homepage hero only. */
body[data-page="index.html"] #home .hero-buttons .button.cream{
  width:fit-content;
  max-width:100%;
  min-width:0;
  min-height:48px;
  padding:12px 18px;
  gap:16px;
  border-radius:14px;
  font-size:14px;
  line-height:1.4;
  font-weight:500;
  white-space:normal;
  box-shadow:0 3px 12px rgba(8,34,43,.08);
}
body[data-page="index.html"] #home .hero-buttons .button.cream .ui-icon{
  width:16px;
  height:16px;
  flex:none;
}
@media(hover:hover){
  body[data-page="index.html"] #home .hero-buttons .button.cream:hover{background:#f1e8d8;border-color:#f1e8d8}
}

/* A restrained light response for the homepage booking CTA. */
body[data-page="index.html"] #home .hero-buttons .button.cream{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease;
  -webkit-tap-highlight-color:transparent;
}
body[data-page="index.html"] #home .hero-buttons .button.cream::before{
  content:"";
  position:absolute;
  inset:-40% -60%;
  pointer-events:none;
  z-index:-1;
  background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.48) 50%,transparent 60%);
  transform:translateX(-65%);
  opacity:0;
}
body[data-page="index.html"] #home .hero-buttons .button.cream .ui-icon{
  transition:transform .25s ease;
}
body[data-page="index.html"] #home .hero-buttons .button.cream:focus-visible{
  outline:2px solid #b69d6b;
  outline-offset:4px;
  box-shadow:0 5px 18px rgba(8,34,43,.16);
}
@media(hover:hover) and (pointer:fine){
  body[data-page="index.html"] #home .hero-buttons .button.cream:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 22px rgba(8,34,43,.17);
  }
  body[data-page="index.html"] #home .hero-buttons .button.cream:hover::before{
    animation:home-cta-light .75s ease-out both;
  }
  body[data-page="index.html"] #home .hero-buttons .button.cream:hover .ui-icon{
    transform:translate(2px,-2px);
  }
}
body[data-page="index.html"] #home .hero-buttons .button.cream:active{
  transform:scale(.98);
  background:#dfd1b8;
  box-shadow:0 2px 6px rgba(8,34,43,.1);
}
@keyframes home-cta-light{
  0%{transform:translateX(-65%);opacity:0}
  20%{opacity:1}
  100%{transform:translateX(65%);opacity:0}
}
@media(prefers-reduced-motion:reduce){
  body[data-page="index.html"] #home .hero-buttons .button.cream,
  body[data-page="index.html"] #home .hero-buttons .button.cream .ui-icon{transition:none;transform:none}
  body[data-page="index.html"] #home .hero-buttons .button.cream::before{display:none;animation:none}
}
@media(prefers-reduced-motion:reduce){
  body[data-page="index.html"] #home .hero-buttons .button.cream:hover,
  body[data-page="index.html"] #home .hero-buttons .button.cream:active,
  body[data-page="index.html"] #home .hero-buttons .button.cream:hover .ui-icon{transform:none}
}

/* Shared gold frame for navigation and actionable controls, without layout shifts. */
@media(hover:hover) and (pointer:fine){
  :is(header nav a,header button,header summary,.language-link,button:not(:disabled),a.button,a.td-button,a.td-whatsapp,a.underlined,a.fleet-more,a.boat-more-information,.fleet-catalog-options>a,.home-orientation-options>a,[role="button"],details>summary):hover{
    outline:1px solid #b69d6b!important;
    outline-offset:3px!important;
    box-shadow:0 0 0 3px rgba(182,157,107,.09),0 3px 14px rgba(182,157,107,.14);
  }
}
:is(header nav a,header button,header summary,.language-link,button:not(:disabled),a.button,a.td-button,a.td-whatsapp,a.underlined,a.fleet-more,a.boat-more-information,.fleet-catalog-options>a,.home-orientation-options>a,[role="button"],details>summary):focus-visible{
  outline:2px solid #b69d6b;
  outline-offset:3px!important;
}