/* AMAX Vacations brand layer — see DESIGN.md. Loaded after styles.css (and destination.css).
   One blue family: indigo (logo wordmark) for text and dark bands, royal for accents,
   the royal → azure → aqua gradient only for the logo, primary buttons and small decorative marks. */
:root{
  --indigo:#0d2159;--indigo-deep:#0a1a47;--royal:#0255bb;--azure:#09aafb;--aqua:#03cacd;--mist:#e7f1fb;
  --sand:#faf0e4;--sand-deep:#f1e1cb;--shell:#fffaf3;
  --text:#1d2a4d;--muted:#5a6685;--line:#e6dccd;
  --brand-gradient:linear-gradient(100deg,var(--royal) 0%,var(--azure) 55%,var(--aqua) 100%);
  /* map base tokens onto the brand */
  --teal:var(--indigo);--deep:var(--indigo-deep);--pink:var(--royal);--pink-dark:var(--royal);--gold:var(--aqua);
  --cream:var(--sand);--paper:var(--shell);--ink:var(--text);
  --radius:18px;--shadow:0 22px 50px rgba(13,33,89,.1);--max:1320px;
  --sans:"Montserrat",sans-serif;--serif:"Cormorant Garamond",serif;
}
body{font-family:var(--sans);background:var(--shell);color:var(--text)}
body::selection{background:var(--royal);color:#fff}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--azure);outline-offset:4px}

/* ---------- Type ---------- */
.hero h1,.section-heading h2,.about h2,.reassurance h2,.credibility h2,.final-cta h2,.contact-panel h3,.detail-hero h1,.detail-copy h2,.detail-inclusions h2,.detail-inquiry h2,.detail-flights h2{font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.04em;line-height:1.02}
.section-heading h2,.about h2,.reassurance h2,.final-cta h2,.contact-panel h3,.detail-copy h2,.detail-inclusions h2,.detail-flights h2{color:var(--indigo);font-size:clamp(2.1rem,3.8vw,3.4rem)}
.section-heading h2::after,.about h2::after,.reassurance h2::after,.detail-copy h2::after,.detail-inclusions h2::after,.detail-flights h2::after{content:"";display:block;width:64px;height:2px;margin-top:22px;background:var(--brand-gradient)}
.package-body h3,.search-empty h3,.benefit-grid h3,.reassurance li strong,.style-grid h3{font-family:var(--serif);font-weight:600;letter-spacing:.01em;color:var(--indigo)}
.section-heading.light h2,.credibility .trust-panel h2,.benefit-grid h3,.detail-inquiry h2{color:#fff}
.section-heading p,.about p,.reassurance p{color:var(--muted)}
.eyebrow,.kicker{margin:0 0 14px;font:600 .72rem/1.4 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--royal)}
.trust-panel .eyebrow{color:var(--aqua)}
.gradient-text{background:var(--brand-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Utility bar + header ---------- */
.announcement{background:var(--indigo);font:600 .68rem/1.4 var(--sans);letter-spacing:.24em}
.announcement a{color:var(--aqua);text-decoration:none}
.site-header{position:sticky;top:0;min-height:108px;background:rgba(255,250,243,.95);color:var(--text);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.brand .brand-logo{width:auto;height:82px}
.site-nav a{color:var(--indigo);font:600 .76rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.site-nav a:hover{color:var(--royal)}
.menu-button span:not(.sr-only){background:var(--indigo)}
html{scroll-padding-top:120px}

/* ---------- Buttons ---------- */
.button{border-radius:999px;text-transform:uppercase;letter-spacing:.14em;font:700 .74rem/1.2 var(--sans);padding:16px 30px}
.button-primary{background:var(--brand-gradient);color:#fff;box-shadow:0 12px 26px rgba(2,85,187,.25)}
.button-primary:hover{background:var(--brand-gradient);filter:brightness(1.06)}
.text-link{border-bottom-color:var(--azure)}
.text-link.dark{color:var(--indigo)}

/* ---------- Hero ---------- */
.hero{min-height:680px}
.hero-image{animation:none}
.hero-shade{background:linear-gradient(90deg,rgba(13,33,89,.88) 0%,rgba(13,33,89,.55) 45%,rgba(13,33,89,.05) 80%),linear-gradient(0deg,rgba(13,33,89,.35),transparent 45%)}
.hero h1{font-size:clamp(2.8rem,5.6vw,5.2rem);max-width:820px;text-transform:none;letter-spacing:.005em}
.hero h1 .gradient-text{font-style:italic;padding-right:.08em;background-image:linear-gradient(100deg,#2bb8ff,var(--aqua))}
.hero .kicker{margin:0 0 22px;color:rgba(255,255,255,.86)}
.hero-content{padding:96px 0 170px}
.wave{position:absolute;left:0;right:0;bottom:-1px;z-index:3;width:100%;height:clamp(60px,8vw,120px);display:block;pointer-events:none}
.wave-fill{fill:var(--shell)}

/* ---------- Package catalogue: large two-up cards, featured package full width ---------- */
.packages{padding-top:64px}
.departure-pill{border-radius:999px;border-color:var(--sand-deep);background:#fff}
.departure-pill strong{color:var(--royal)}
.destination-search>label{font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.7rem;color:var(--indigo)}
.search-control input{border-radius:999px;border-color:var(--sand-deep);box-shadow:0 10px 28px rgba(13,33,89,.05)}
.search-control input:focus{border-color:var(--royal);box-shadow:0 0 0 3px rgba(2,85,187,.16)}
.search-control>svg{stroke:var(--royal)}
.package-grid{grid-template-columns:repeat(2,1fr);gap:30px;margin-top:44px}
.package-card{border-radius:var(--radius);box-shadow:0 14px 36px rgba(13,33,89,.08);background:#fff}
.package-card:hover{box-shadow:0 26px 56px rgba(13,33,89,.15)}
.package-media{aspect-ratio:16/10}
.package-body{padding:28px 30px 30px}
.package-tag{margin:0 0 8px;font:600 .68rem/1.4 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--royal)}
.package-body h3{margin:0 0 10px;font-size:2.2rem;line-height:1.05}
.package-blurb{margin:0 0 22px;color:var(--muted);font-size:.95rem;max-width:48ch}
.price-row span{color:var(--muted);font-size:.72rem;letter-spacing:.04em;line-height:1.45}
.price-row strong{color:var(--indigo);font:700 1.8rem/1 var(--sans)}
.price-row .price-soon,.summary-price .price-soon{font:500 italic 1.5rem/1 var(--serif);letter-spacing:.02em;color:var(--royal)}
.details-link,.text-button,.search-clear{color:var(--royal);border-bottom-color:var(--azure)}
.package-badge{position:absolute;top:18px;left:18px;padding:9px 16px;border-radius:999px;background:var(--brand-gradient);color:#fff;font:700 .64rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.package-card.is-featured{grid-column:1/-1}
.package-card.is-featured>a{display:grid;grid-template-columns:1.35fr 1fr}
.package-card.is-featured .package-media{aspect-ratio:auto;min-height:440px}
.package-card.is-featured .package-body{padding:48px;display:flex;flex-direction:column;justify-content:center}
.package-card.is-featured .details-link{align-self:flex-start}
.package-card.is-featured h3{font-size:clamp(2.6rem,4vw,3.6rem)}
.package-card.is-featured .price-row strong{font-size:2.4rem}

/* ---------- Vacation styles (live-site grid, poster icons) ---------- */
.styles{background:var(--sand);padding:clamp(82px,9vw,120px) max(24px,calc((100vw - var(--max))/2))}
.styles-inner{width:100%}
.style-grid{margin:50px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.style-grid li{padding:32px 30px;background:rgba(255,255,255,.6);border:1px solid var(--sand-deep);border-radius:var(--radius)}
.style-icon{width:68px;height:68px;margin-bottom:20px;display:grid;place-items:center;border-radius:50%;background:#fff;border:1px solid var(--sand-deep)}
.style-icon svg{width:30px;height:30px;fill:none;stroke:var(--indigo);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.style-grid h3{margin:0 0 8px;font-size:1.6rem}
.style-grid p{margin:0;color:var(--muted);font-size:.92rem}

/* ---------- About, bands, steps, FAQ ---------- */
.about-photo{position:relative;border-radius:var(--radius)}
.about-photo img{position:absolute;inset:0}
.why{background:radial-gradient(circle at 85% 0%,rgba(9,170,251,.25),transparent 45%),var(--indigo)}
.benefit-grid{background:rgba(255,255,255,.12)}
.benefit-grid article{background:var(--indigo)}
.benefit-icon{background:var(--brand-gradient)}
.reassurance li::before{color:var(--royal);font:700 .95rem/1 var(--sans)}
.faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,8vw,100px);align-items:start;border-top:1px solid var(--line)}
.faq .section-heading a{color:var(--royal);font-weight:600}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list details:first-child{border-top:1px solid var(--line)}
.faq-list summary{min-height:44px;padding:22px 44px 22px 0;position:relative;cursor:pointer;list-style:none;font:600 1.45rem/1.25 var(--serif);color:var(--indigo)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font:400 1.6rem/1 var(--sans);color:var(--royal);transition:transform .2s var(--ease)}
.faq-list details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq-list details p{margin:0 0 24px;max-width:62ch;color:var(--muted)}
.credibility{border-radius:var(--radius)}
.trust-panel{background:radial-gradient(circle at 0% 100%,rgba(3,202,205,.2),transparent 50%),var(--indigo)}
.trust-badge{background:rgba(255,255,255,.05);border-radius:14px}
.trust-badge span{font-family:var(--sans)}
.trust-badge strong{color:var(--aqua)}
.contact-panel{background:var(--sand)}
.contact-panel .eyebrow{color:var(--royal)}
.final-cta{background:var(--brand-gradient);color:#fff;box-shadow:0 24px 50px rgba(2,85,187,.25)}
.final-cta h2{color:#fff}
.final-cta p{color:rgba(255,255,255,.9)}
.final-cta .button-primary{background:#fff;color:var(--royal);box-shadow:none}

/* ---------- Footer ---------- */
.site-footer{background:var(--indigo);padding-top:64px}
.site-footer .brand-logo{height:96px}
.footer-links a{color:var(--aqua)}

/* ---------- Destination detail pages ---------- */
.detail-body{background:var(--shell)}
.detail-body .site-header{position:sticky;top:0;background:rgba(255,250,243,.95)}
.detail-body .site-nav a{color:var(--indigo)}
.detail-hero{min-height:560px}
.detail-hero::after{background:linear-gradient(0deg,rgba(13,33,89,.92) 0%,rgba(13,33,89,.3) 60%,rgba(13,33,89,.15))}
.detail-hero-content{padding:120px 0 90px}
.detail-hero h1{font-size:clamp(3rem,7vw,6rem)}
.back-link{border-bottom-color:var(--aqua);letter-spacing:.12em;text-transform:uppercase;font-size:.7rem}
.detail-summary{background:#fff;border:1px solid var(--line)}
.summary-item small,.summary-price small{color:var(--royal);font-weight:600;letter-spacing:.2em}
.summary-price strong{color:var(--indigo);font:700 1.9rem/1 var(--sans)}
.summary-price span{display:block;margin-top:6px}
.detail-copy p{color:var(--muted)}
.detail-facts dd{color:var(--indigo)}
.detail-inclusions li::before{background:var(--brand-gradient)}
.detail-inquiry{background:radial-gradient(circle at 100% 0%,rgba(9,170,251,.28),transparent 50%),var(--indigo)}
.gallery figure{border-radius:14px}
.detail-nav a{color:var(--indigo);border-color:var(--sand-deep)}
.detail-nav a:hover{border-color:var(--royal);color:var(--royal)}
.detail-itinerary h2,.detail-hotels h2{margin:0 0 18px;font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.04em;line-height:1.02;color:var(--indigo);font-size:clamp(2.1rem,3.8vw,3.4rem)}
.detail-itinerary h2::after,.detail-hotels h2::after{content:"";display:block;width:64px;height:2px;margin-top:22px;background:var(--brand-gradient)}
.detail-itinerary,.detail-hotels{padding-top:20px}
.itinerary-list{margin:35px 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.itinerary-list li{display:grid;grid-template-columns:110px 1fr;gap:24px;padding:26px 0;border-bottom:1px solid var(--line)}
.day-number{font:700 .72rem/1.6 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--royal)}
.itinerary-list h3{margin:0 0 8px;font:600 1.6rem/1.15 var(--serif);color:var(--indigo)}
.day-summary{margin:0 0 10px;max-width:70ch;color:var(--muted)}
.day-meta{margin:0;display:flex;flex-wrap:wrap;gap:6px 26px;font-size:.82rem;color:var(--text)}
.day-meta b{margin-right:6px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.66rem;color:var(--royal)}
.hotel-list{margin:35px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hotel-list li{padding:24px;display:flex;flex-direction:column;gap:6px;background:var(--sand);border:1px solid var(--sand-deep);border-radius:var(--radius)}
.hotel-list small{font:600 .66rem/1.4 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--royal)}
.hotel-list strong{font:600 1.45rem/1.15 var(--serif);color:var(--indigo)}
.hotel-list span{font-size:.85rem;color:var(--muted)}
.detail-exclusions{margin-top:34px}
.detail-exclusions h3{margin:0 0 12px;font:600 .72rem/1.4 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.detail-exclusions ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.detail-inclusions .detail-exclusions ul{margin:0;border-top:0;display:flex}
.detail-inclusions .detail-exclusions li{padding:9px 16px;border:1px solid var(--line);border-radius:999px;font-size:.82rem;font-weight:500;color:var(--muted)}
.detail-inclusions .detail-exclusions li::before{display:none}
@media(max-width:1060px){.hotel-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.itinerary-list li{grid-template-columns:1fr;gap:6px}.hotel-list{grid-template-columns:1fr}}

/* ---------- Responsive ---------- */
@media(max-width:1060px){
  .package-card.is-featured>a{grid-template-columns:1fr}
  .package-card.is-featured .package-media{min-height:0;aspect-ratio:16/10}
  .package-card.is-featured .package-body{padding:30px}
  .style-grid{grid-template-columns:repeat(2,1fr)}
  .faq{grid-template-columns:1fr}
}
@media(max-width:760px){
  html{scroll-padding-top:90px}
  .site-header{min-height:84px}
  .brand .brand-logo{height:62px}
  .site-nav a{border-top-color:var(--line)}
  .detail-body .site-nav{background:transparent}
  .hero{min-height:640px}
  .hero-content{padding:82px 22px 150px}
  .package-grid{grid-template-columns:1fr;gap:22px}
  .package-body{padding:24px}
  .package-body h3{font-size:1.9rem}
  .style-grid{grid-template-columns:1fr}
  .faq-list summary{font-size:1.25rem}
  .site-footer .brand-logo{height:80px}
  .detail-hero{min-height:520px}
  .detail-hero-content{padding:110px 0 70px}
}
