/* ==========================================================
   See The World Travel V8 - Production polish layer
   Purpose: contrast, typography, mobile containment, brand lock
   ========================================================== */

:root{
  --stw-navy:#063c5a;
  --stw-deep:#04364d;
  --stw-teal:#006b89;
  --stw-teal-2:#0a7f91;
  --stw-gold:#f3bf31;
  --stw-gold-soft:#ffe08a;
  --stw-ink:#0a405d;
  --stw-body:#294e60;
  --stw-muted:#607985;
  --stw-surface:#ffffff;
  --stw-soft:#f4f8fa;
  --stw-line:#d7e4e9;
  --stw-display:Georgia,"Times New Roman",Times,serif;
  --stw-sans:"Segoe UI",Arial,Helvetica,sans-serif;
}

html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}
body{
  color:var(--stw-body)!important;
  font-family:var(--stw-sans)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
*,*::before,*::after{box-sizing:border-box;min-width:0}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
main,.main,.page,.content,section,article,aside,footer,header{max-width:100%}
.content{width:100%!important}
h1,h2,h3,h4{
  font-family:var(--stw-display)!important;
  color:var(--stw-ink);
  text-wrap:balance;
}
p,li,label,input,select,textarea,button,a{font-family:var(--stw-sans)}
p{line-height:1.72}
button,a,.btn{touch-action:manipulation}

/* ORIGINAL logo identity, not a new redesign */
.stw-logo{
  overflow:visible!important;
  flex:0 1 330px!important;
  width:330px!important;
  min-width:240px!important;
  height:74px!important;
}
.stw-original-logo{
  width:100%!important;
  height:72px!important;
  object-fit:contain!important;
  object-position:left center!important;
  display:block!important;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.17));
}
.footer-logo-lockup{
  width:min(460px,100%);
  margin-bottom:16px;
}
.footer-logo-lockup img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
  object-position:left center;
}

/* Core readable contrast: no dark-blue headings over dark photos/teal */
.occasion-hero h1,
.atlas-hero h1,
.founder-feature h2,
.destination-card h3,
.occasion-card h3,
.feature-copy h3,
.mag-quote-copy h2,
.mag-quote-copy blockquote,
.portal-side h3,
.page[data-page="contact"] .panel[style*="background"] h2,
.page[data-page="contact"] .panel[style*="background"] h3,
.page[data-page="contact"] .panel[style*="background"] p:not(.eyebrow),
.atlas-globe b{
  color:#fff!important;
  text-shadow:0 2px 12px rgba(0,0,0,.55)!important;
}
.occasion-hero .kicker,
.atlas-hero .kicker,
.founder-feature .eyebrow,
.feature-copy small{
  color:var(--stw-gold-soft)!important;
}
.occasion-hero p,
.atlas-hero p,
.founder-feature p,
.destination-card p,
.occasion-card p,
.feature-copy p{
  color:#f5fbfd!important;
  text-shadow:0 1px 8px rgba(0,0,0,.42)!important;
}
.portal-side,
.portal-side nav button{
  color:#f7fbfc!important;
}
.portal-side p{color:#c9e1e8!important}
.portal-side .eyebrow{color:#9ee1ea!important}

/* Headings that were visibly too dark on teal panels */
.page[data-page="contact"] .panel[style*="background"] h2{
  color:#fff!important;
}
.page[data-page="contact"] .glass-card,
.page[data-page="contact"] .glass-card p{
  color:#f6fbfc!important;
}

/* Destination image overlays - stronger for readable copy */
.destination-card:before{
  background:linear-gradient(180deg,rgba(2,25,37,.05) 22%,rgba(2,29,42,.92) 100%)!important;
}
.occasion-card:after{
  background:linear-gradient(180deg,rgba(2,25,37,.12),rgba(2,29,42,.88))!important;
}
.founder-feature{
  position:relative;
  isolation:isolate;
}
.founder-feature:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(3,31,45,.18) 12%,rgba(3,31,45,.88) 88%)!important;
}
.founder-feature h2{
  font-size:clamp(42px,7vw,70px)!important;
  line-height:.98!important;
  letter-spacing:-.025em;
}
.founder-feature p{
  font-size:17px!important;
  line-height:1.72!important;
}

/* Polished editorial typography */
.mag-head h2,.page-title h1,.section h2,.story-prose h2,.card-title,
.trip-head h2,.occasion-hero h1,.atlas-hero h1{
  font-family:var(--stw-display)!important;
  letter-spacing:-.028em!important;
  font-weight:700!important;
}
.page-title h1{line-height:1.02!important}
.section-intro,.page-title p,.mag-head p{font-size:15px}

/* Buttons: consistent and readable */
.btn{
  border-radius:8px!important;
  font-weight:700!important;
  min-height:46px;
}
.btn.primary{
  background:linear-gradient(180deg,#0a91ae,#007896)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(0,91,121,.18)!important;
}
.btn.primary:hover{background:#006f8e!important}
.btn.light{background:#fff!important;color:#073e59!important}
.btn.outline{background:#fff!important;border:1px solid #afc5cd!important;color:#0a4964!important}

/* Header/menu */
.stw-public-header{
  background:linear-gradient(90deg,#005678,#006e8c)!important;
  box-shadow:0 2px 10px rgba(5,49,70,.14)!important;
}
.stw-mobile-toggle{
  color:#fff!important;
  cursor:pointer!important;
}
.stw-main-nav button{cursor:pointer!important}

/* Prevent text/cards escaping the viewport */
.grid,.grid-2,.grid-3,.grid-4,.footer-grid,.founder-layout,.portal-shell,
.weather-hero,.desk-layout,.desk-row-one,.desk-row-two,.desk-quick-row,
.mag-grid,.occasion-grid,.atlas-grid{
  min-width:0!important;
}
.grid>*,
.grid-2>*,
.grid-3>*,
.grid-4>*,
.footer-grid>*,
.founder-layout>*,
.portal-shell>*{
  min-width:0!important;
  max-width:100%!important;
}
input,select,textarea{max-width:100%!important}

/* Legal/trust cards */
.compliance-card{
  align-items:flex-start!important;
  min-height:190px;
}
.compliance-card h3{color:#0a405d!important}
.compliance-card p{color:#5a7380!important;font-size:13px!important}
.legal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* Footer */
.footer{
  overflow:hidden!important;
  background:linear-gradient(115deg,#00516e,#007a94)!important;
  margin-left:0!important;
  margin-right:0!important;
}
.footer-grid{
  width:100%;
  max-width:1440px;
  margin:0 auto;
}
.footer p,.footer a,.footer-bottom{color:#eaf5f7!important}
.footer h4{color:#ffd566!important}
.footer-legal-name{color:#d8edf1!important}

/* Focus/keyboard */
:focus-visible{
  outline:3px solid #f6c63c!important;
  outline-offset:3px!important;
}
.skip:focus{position:fixed!important;left:16px!important;top:16px!important;z-index:10000!important}

/* Mobile containment + readable layouts */
@media(max-width:980px){
  .stw-nav-inner{padding:0 16px!important;gap:10px!important}
  .stw-logo{width:min(270px,calc(100vw - 86px))!important;min-width:0!important;height:68px!important}
  .stw-original-logo{height:64px!important}
  .content{padding-left:16px!important;padding-right:16px!important}
  .page-title{padding:26px 22px!important}
  .page-title h1{font-size:clamp(35px,10vw,50px)!important}
  .occasion-hero,.atlas-hero,.founder-feature{padding:30px!important}
  .occasion-hero h1,.atlas-hero h1{font-size:clamp(42px,11vw,60px)!important}
  .founder-layout,.grid-2,.grid-3,.grid-4,.weather-hero,.portal-shell{
    grid-template-columns:1fr!important
  }
  .footer-grid{grid-template-columns:1fr!important}
  .footer{padding:32px 22px!important}
  .footer-logo-lockup{max-width:390px}
  .atlas-controls{display:flex!important;flex-wrap:wrap!important}
  .atlas-controls input{width:100%!important;flex-basis:100%!important}
  .destination-card,.occasion-card{width:100%!important}
}
@media(max-width:620px){
  .content{padding:14px!important}
  .stw-logo{width:min(245px,calc(100vw - 78px))!important}
  .stw-original-logo{height:58px!important}
  .hero,.story-band,.quote-cta,.postcard,.mag-quote{border-radius:20px!important}
  .occasion-hero,.atlas-hero,.founder-feature{border-radius:24px!important;padding:28px 24px!important}
  .founder-feature h2{font-size:clamp(40px,12vw,56px)!important}
  .destination-card h3,.occasion-card h3{font-size:31px!important}
  .portal-side{border-radius:22px!important}
  .portal-main{padding:18px!important}
  .trip-timeline{grid-template-columns:1fr 1fr!important}
  .footer-logo-lockup{max-width:100%}
  .footer a{display:block;padding:4px 0}
}
@media(max-width:380px){
  .stw-logo{width:210px!important}
  .stw-original-logo{height:54px!important}
  .content{padding:10px!important}
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

.portal-view-note{
  margin:0 0 18px;
  padding:12px 14px;
  background:#eef8fb;
  border-left:4px solid #0a91ae;
  border-radius:8px;
  color:#214f61;
  font-size:13px;
  line-height:1.55;
}
.portal-side nav button.active{
  background:rgba(255,255,255,.15)!important;
  color:#fff!important;
  font-weight:700!important;
}

.consent-field{margin-top:4px}
.consent-label{display:flex!important;gap:10px;align-items:flex-start;font-size:13px!important;line-height:1.55!important;color:#496673!important}
.consent-label input{width:18px!important;height:18px!important;flex:0 0 18px;margin-top:2px}
.consent-label a{color:#006b89!important;text-decoration:underline}

/* Approved logo treatment: exact supplied artwork, deliberately integrated on its native white field. */
.stw-logo{
  background:#fff!important;
  border-radius:0 0 14px 14px!important;
  padding:5px 12px 7px!important;
  box-shadow:0 6px 18px rgba(1,42,60,.16)!important;
  height:92px!important;
  width:305px!important;
  flex:0 0 305px!important;
  align-self:flex-start!important;
}
.stw-original-logo{
  width:100%!important;
  height:78px!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:none!important;
}
.footer-logo-lockup{
  background:#fff!important;
  border-radius:16px!important;
  padding:14px!important;
  box-shadow:0 10px 30px rgba(0,37,52,.18)!important;
  width:min(400px,100%)!important;
}
.footer-logo-lockup img{
  width:100%!important;
  display:block!important;
  border-radius:8px!important;
}
@media(max-width:980px){
  .stw-logo{
    width:min(250px,calc(100vw - 96px))!important;
    flex-basis:auto!important;
    height:82px!important;
    padding:5px 9px 7px!important;
  }
  .stw-original-logo{height:68px!important}
}
@media(max-width:420px){
  .stw-logo{
    width:min(225px,calc(100vw - 90px))!important;
    height:76px!important;
  }
  .stw-original-logo{height:63px!important}
}

.portal-auth-shell{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px}
.portal-security-card ul{padding-left:20px;color:#496673;line-height:1.8}
#clientLogout{margin-top:18px;width:100%}
.client-trip-card{padding:18px;border:1px solid #d7e4e9;border-radius:16px;margin-bottom:12px;background:#fff}
.client-trip-card button{margin-top:10px}
.portal-empty{padding:24px;border:1px dashed #b8ced6;border-radius:14px;color:#607985;background:#f8fbfc}
.portal-message-list{display:grid;gap:10px;margin-bottom:16px}
.portal-message{padding:12px 14px;border-radius:12px;background:#eef7fa;color:#294e60}
@media(max-width:820px){.portal-auth-shell{grid-template-columns:1fr}}


/* ==========================================================
   V10 — APPROVED LOGO INTEGRATION
   Uses the exact user-approved See The World Travel artwork.
   ========================================================== */
:root{
  --stw-logo-night:#011018;
  --stw-logo-ocean:#03344b;
  --stw-logo-gold:#e7b94b;
}

/* Deep-ocean brand bar sampled to visually merge with the logo artwork. */
.stw-public-header{
  background:
    radial-gradient(circle at 46% -55%,rgba(12,166,211,.34),transparent 44%),
    linear-gradient(90deg,#01131e 0%,#03384f 52%,#011019 100%) !important;
  border-bottom:1px solid rgba(231,185,75,.30) !important;
  box-shadow:0 8px 28px rgba(0,13,21,.22) !important;
}
.stw-nav-inner{
  height:94px !important;
  min-height:94px !important;
  align-items:center !important;
}

/* Remove all previous white-card/pasted-on treatments. */
.stw-logo.stw-brand-banner{
  width:360px !important;
  min-width:360px !important;
  height:88px !important;
  flex:0 0 360px !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  position:relative !important;
}
.stw-brand-image{
  width:100% !important;
  height:auto !important;
  max-height:88px !important;
  object-fit:contain !important;
  object-position:left center !important;
  display:block !important;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.26)) !important;
}
.stw-logo.stw-brand-banner::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(1,16,24,.24) 0%,
    transparent 7%,
    transparent 92%,
    rgba(1,16,24,.34) 100%);
}

/* Navigation tuned to the logo's white/gold hierarchy. */
.stw-main-nav>button,.stw-drop>button{color:#f4f8fa !important}
.stw-main-nav>button:hover,.stw-drop>button:hover,
.stw-main-nav>button.active,.stw-drop>button.active{color:#f4cf79 !important}
.stw-main-nav .client-portal-btn{
  color:#ffe18b !important;
  border-color:#dbae48 !important;
  background:rgba(0,0,0,.11) !important;
}

/* Footer identity uses the exact same logo and ocean background family. */
.footer{
  background:
    radial-gradient(circle at 18% -10%,rgba(9,150,194,.24),transparent 36%),
    linear-gradient(120deg,#011520 0%,#04384e 55%,#011019 100%) !important;
  border-top:1px solid rgba(231,185,75,.27) !important;
}
.footer-logo-lockup{
  width:min(540px,100%) !important;
  margin:0 0 20px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
  position:relative !important;
}
.footer-logo-lockup img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  border-radius:0 !important;
  filter:drop-shadow(0 7px 18px rgba(0,0,0,.25)) !important;
}
.footer-logo-lockup::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(1,18,27,.27) 0%,
    transparent 7%,
    transparent 92%,
    rgba(1,18,27,.36) 100%);
}
.footer-brand-panel>p{color:#eef8fa !important}
.footer-legal-name{color:#c8e4eb !important;border-top-color:rgba(231,185,75,.22) !important}
.footer h4{color:#f2ca64 !important}

/* Responsive brand sizing. */
@media(max-width:1350px){
  .stw-logo.stw-brand-banner{
    width:305px !important;min-width:305px !important;flex-basis:305px !important
  }
}
@media(max-width:1050px){
  .stw-public-header,.stw-nav-inner{height:82px !important;min-height:82px !important}
  .stw-logo.stw-brand-banner{
    width:min(300px,calc(100vw - 98px)) !important;
    min-width:0 !important;
    height:76px !important;
    flex:1 1 auto !important;
  }
  .stw-brand-image{max-height:76px !important}
  .stw-main-nav{top:82px !important;background:#032f45 !important}
}
@media(max-width:720px){
  .stw-nav-inner{padding:0 10px !important;gap:8px !important}
  .stw-logo.stw-brand-banner{width:min(260px,calc(100vw - 88px)) !important;height:70px !important}
  .stw-brand-image{max-height:70px !important}
}
@media(max-width:420px){
  .stw-logo.stw-brand-banner{width:min(236px,calc(100vw - 82px)) !important;height:66px !important}
  .stw-brand-image{max-height:66px !important}
}