
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');

:root{
  --ink:#1c2520;--muted:#606862;--olive:#65755a;--forest:#153b33;
  --cream:#f7f4ed;--paper:#fbfaf6;--line:#d9d6ce;--white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif;line-height:1.55}
a{text-decoration:none;color:inherit}
img{width:100%;display:block;object-fit:cover}
.wrap{width:min(1180px,calc(100% - 42px));margin:auto}
h1,h2,h3{font-family:"Playfair Display",serif;font-weight:500;line-height:1.02;margin:0}
h1{font-size:clamp(3.5rem,6vw,6.6rem);max-width:860px}
h2{font-size:clamp(2.45rem,4.5vw,4.5rem)}
h3{font-size:1.65rem}
.eyebrow{font-size:.73rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600}
.section{padding:78px 0}
.nav{position:absolute;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px max(28px,calc((100vw - 1180px)/2));color:#15211d}
.logo{font-family:"Playfair Display",serif;font-size:1.42rem;letter-spacing:.18em;text-transform:uppercase}
.logo small{display:block;text-align:center;font-family:"DM Sans";font-size:.43rem;letter-spacing:.42em;margin-top:1px}
.links{display:flex;gap:26px;align-items:center;font-size:.82rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:12px 19px;border-radius:999px;border:1px solid currentColor;font-weight:600;font-size:.86rem}
.btn.fill{background:var(--olive);border-color:var(--olive);color:#fff}
.nav .btn{background:var(--olive);border-color:var(--olive);color:white;padding:10px 17px}
.hero{
  min-height:45vw;max-height:690px;min-height:560px;display:flex;align-items:flex-end;
  position:relative;color:#fff;
  background:linear-gradient(90deg,rgba(4,28,31,.68),rgba(4,28,31,.09) 70%),url('assets/hero-macaws.webp') center/cover;
}
.hero-copy{padding:160px 0 52px}
.hero p{max-width:700px;font-size:1.04rem;margin:10px 0}
.hero .eyebrow{margin-bottom:10px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero .ghost{color:#fff}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px}
.section-head h2{margin-top:7px}
.textlink{font-size:.82rem;font-weight:600}
.experience-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:8px}
.card{position:relative;overflow:hidden;min-height:305px}
.card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(0,0,0,.72))}
.card img{height:100%;transition:.5s}
.card:hover img{transform:scale(1.025)}
.card .copy{position:absolute;z-index:2;left:16px;right:16px;bottom:14px;color:white}
.card .copy h3{font-size:1.48rem}
.card .copy p{margin:5px 0 0;font-size:.63rem;text-transform:uppercase;letter-spacing:.075em}
.top{grid-column:span 4;height:308px}
.bottom{grid-column:span 3;height:250px}
.story{display:grid;grid-template-columns:1fr 1.06fr;gap:48px;align-items:center;padding:62px 0}
.story-photo{height:500px}
.story h2{margin:8px 0 20px}
.story p{color:var(--muted);font-size:1.02rem}
.guides{background:var(--paper)}
.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.guide img{height:190px}
.guide h3{font-size:1.3rem;margin:11px 0 4px}
.guide p{margin:0;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.faq-section{background:var(--cream)}
.faq-intro{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
.faq-intro p{color:var(--muted)}
.faq details{border-top:1px solid var(--line);padding:19px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{font-family:"Playfair Display",serif;font-size:1.35rem;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";float:right;font-family:"DM Sans";font-size:1.1rem}
.faq details[open] summary:after{content:"–"}
.faq details p{margin:12px 40px 0 0;color:var(--muted);max-width:760px}
.plan{min-height:430px;color:white;display:flex;align-items:flex-end;background:linear-gradient(90deg,rgba(8,24,27,.72),rgba(8,24,27,.12)),url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=2200&q=90') center/cover}
.plan .inner{padding:58px 0}
.plan h2{max-width:760px;margin:7px 0 12px}
.plan p{max-width:650px}
.footer{background:#112e29;color:white;padding:46px 0}
.foot{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:35px}
.footer p,.footer a{color:rgba(255,255,255,.68);font-size:.82rem}
.footer a{display:block;margin:6px 0}
.pagehero{padding:150px 0 70px;background:var(--forest);color:#fff}
.pagehero p{max-width:690px;color:rgba(255,255,255,.74)}
.editorial{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.editorial article img{height:340px}
.editorial h3{margin:12px 0 5px}
.editorial p{color:var(--muted)}
@media(max-width:850px){
  .links a:not(.btn){display:none}
  .experience-grid{grid-template-columns:1fr 1fr}
  .top,.bottom{grid-column:auto;height:270px}
  .story,.faq-intro{grid-template-columns:1fr}
  .story-photo{height:430px}
  .guide-grid{grid-template-columns:1fr 1fr}
  .foot,.editorial{grid-template-columns:1fr}
}
@media(max-width:560px){
  .wrap{width:calc(100% - 26px)}
  .section{padding:58px 0}
  .section-head{align-items:start;flex-direction:column}
  .experience-grid,.guide-grid{grid-template-columns:1fr}
  .top,.bottom{height:300px}
  .hero{min-height:650px}
  .hero-copy{padding-bottom:40px}
  .story-photo{height:390px}
}

.card:nth-child(4) img{object-position:center 28%}
.card:nth-child(1) img{object-position:center 48%}
.guide img{object-position:center}

.hero{background-position:center 43%;background-size:cover}
.card img{object-fit:cover}
@media(max-width:700px){.hero{background-position:61% center}}

/* Corrected hero: authentic macaws */
.hero{position:relative;background-position:center 43%;background-size:cover}
.hero:before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(7,25,20,.62) 0%,rgba(7,25,20,.34) 40%,rgba(7,25,20,.03) 72%);
  pointer-events:none;
}
.hero-copy,.nav{position:relative;z-index:2}
@media(max-width:700px){
  .hero{background-position:61% center}
  .hero:before{background:linear-gradient(90deg,rgba(7,25,20,.70),rgba(7,25,20,.14))}
}


/* =========================
   V8 — requested hero/header corrections only
   ========================= */

/* Fixed translucent navigation, like Anna Holala */
.nav{
  position:fixed !important;
  top:0; left:0; right:0;
  z-index:1000 !important;
  padding:18px max(28px,calc((100vw - 1180px)/2));
  color:#fff !important;
  background:rgba(8,31,28,.70);
  border-bottom:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.nav .logo,
.nav .links a{color:#fff !important}

/* Macaw hero: keep birds unobstructed on the right, copy on the left */
.hero{
  min-height:690px;
  max-height:none;
  display:flex;
  align-items:center;
  background-position:center 43% !important;
}
.hero:before{
  background:linear-gradient(
    90deg,
    rgba(7,25,20,.72) 0%,
    rgba(7,25,20,.56) 31%,
    rgba(7,25,20,.24) 53%,
    rgba(7,25,20,.03) 70%
  ) !important;
}
.hero-copy{
  position:relative;
  z-index:2;
  margin:0 auto;
  padding:135px 0 55px;
  max-width:none;
}
.hero-copy > *{
  max-width:650px;
}
.hero h1{
  font-size:clamp(3.4rem,5.6vw,6rem);
  max-width:650px;
}
.hero p{max-width:630px}

/* Avoid the text drifting toward the macaws */
.hero .actions{max-width:650px}

/* Transfer card crop */
.experience-grid .card:last-child img{
  object-position:center 42%;
}

@media(max-width:850px){
  .nav{padding:15px 18px}
  .hero{
    min-height:700px;
    background-position:64% center !important;
    align-items:flex-end;
  }
  .hero:before{
    background:linear-gradient(
      90deg,
      rgba(7,25,20,.78) 0%,
      rgba(7,25,20,.56) 52%,
      rgba(7,25,20,.18) 100%
    ) !important;
  }
  .hero-copy{
    padding:145px 0 48px;
  }
}

/* V9 — real partner photo for Private Charters */
.experience-grid .card:first-child img{
  object-position:center 48%;
}

/* V10 — authentic partner imagery */
.experience-grid .card:first-child img{
  filter:saturate(1.16) contrast(1.06) brightness(1.04);
}
.experience-grid .card:nth-last-child(2) img{
  object-position:center 52%;
  filter:saturate(1.06) contrast(1.03);
}


/* =========================
   V11 — brighter macaw hero + restored Plan Your Stay form
   ========================= */

/* Restore more of the original brightness of the macaw photograph */
.hero{
  background-image:
    linear-gradient(90deg,rgba(7,25,20,.38) 0%,rgba(7,25,20,.18) 35%,rgba(7,25,20,.02) 63%),
    url('assets/hero-macaws.webp') !important;
}
.hero:before{
  background:linear-gradient(
    90deg,
    rgba(7,25,20,.30) 0%,
    rgba(7,25,20,.16) 34%,
    rgba(7,25,20,.00) 61%
  ) !important;
}

/* Final destination image + visible planning form */
.plan{
  min-height:680px;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(7,26,24,.65) 0%,rgba(7,26,24,.36) 45%,rgba(7,26,24,.20) 100%),
    url('assets/plan-your-stay.webp') center 46%/cover !important;
}
.plan-grid{
  width:min(1180px,calc(100% - 42px));
  margin:auto;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:70px;
  align-items:center;
  padding:80px 0;
}
.plan-copy h2{margin:7px 0 14px}
.plan-copy p{max-width:520px;font-size:1.02rem}
.stay-form{
  background:rgba(13,38,34,.76);
  border:1px solid rgba(255,255,255,.22);
  border-radius:24px;
  padding:25px;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.stay-form input,
.stay-form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.28);
  border-radius:11px;
  background:rgba(255,255,255,.10);
  color:#fff;
  padding:13px 14px;
  font:inherit;
}
.stay-form input::placeholder,
.stay-form textarea::placeholder{color:rgba(255,255,255,.75)}
.stay-form textarea{min-height:112px;resize:vertical}
.form-grid .full{grid-column:1/-1}
.stay-form .btn.fill{
  border:0;
  cursor:pointer;
  width:100%;
}

@media(max-width:850px){
  .plan-grid{grid-template-columns:1fr;gap:28px;padding:65px 0}
}
@media(max-width:560px){
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .stay-form{padding:18px}
  .plan{min-height:760px}
}

/* V12 — Discover Guanacaste selected imagery */
.guide:nth-child(1) img{object-position:center 53%}
.guide:nth-child(2) img{object-position:center 56%}
.guide:nth-child(3) img{object-position:66% 48%}
.guide:nth-child(4) img{object-position:center 45%}

/* V13 — approved Papagayo guide image */
.guide:nth-child(2) img{object-position:center 50%}

/* =========================
   V14 — Private Charters category
   ========================= */
.charter-page{background:#f6f3ec}
.charter-hero{height:min(82vh,780px);min-height:620px;position:relative;color:#fff;display:flex;align-items:flex-end;overflow:hidden}
.charter-hero>img{position:absolute;inset:0;height:100%;object-position:center 52%;filter:saturate(1.08) contrast(1.03)}
.charter-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,28,25,.74) 0%,rgba(7,28,25,.38) 45%,rgba(7,28,25,.06) 75%),linear-gradient(0deg,rgba(7,28,25,.45),transparent 52%)}
.charter-hero-copy{position:relative;z-index:2;padding-bottom:68px}
.charter-hero h1{max-width:850px;font-size:clamp(3.4rem,6vw,6.5rem)}
.charter-hero p{max-width:690px;font-size:1.08rem;margin:18px 0 27px;color:rgba(255,255,255,.9)}
.charter-intro{background:#f6f3ec}
.charter-intro-grid,.charter-help-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}
.charter-intro-grid h2,.charter-help-grid h2{margin-top:8px}
.charter-intro-grid p,.charter-help-grid p{font-size:1.02rem;color:var(--muted);max-width:680px;margin-top:0}
.small-note{font-size:.82rem!important;border-top:1px solid var(--line);padding-top:16px;margin-top:22px!important}
.boat-block{padding:92px 0 105px;border-top:1px solid rgba(28,37,32,.12);background:#fbfaf6}
.boat-block.alt{background:#eceae3}
.boat-kicker{display:flex;justify-content:space-between;gap:20px;text-transform:uppercase;letter-spacing:.15em;font-size:.68rem;font-weight:600;color:#6e756f;margin-bottom:22px}
.boat-title-row{display:flex;justify-content:space-between;gap:35px;align-items:flex-end;margin-bottom:26px}
.boat-title-row h2{font-size:clamp(2.6rem,5vw,5rem)}
.boat-tagline{margin:9px 0 0;color:var(--muted);font-size:1rem}
.boat-spec{text-align:right;font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;border:1px solid #b9bbb5;border-radius:999px;padding:9px 14px;white-space:nowrap}
.boat-gallery{display:grid;gap:8px;margin-top:28px}
.boat-gallery button{padding:0;border:0;background:none;cursor:zoom-in;overflow:hidden;position:relative}
.boat-gallery img{height:100%;transition:transform .45s ease;object-fit:cover}
.boat-gallery button:hover img{transform:scale(1.018)}
.compact-gallery{grid-template-columns:2.2fr 1fr;grid-template-rows:520px}
.compact-gallery .gallery-main img{object-position:center 50%}
.compact-gallery .gallery-thumb img{object-position:center 45%}
.single-gallery{grid-template-columns:1fr;grid-template-rows:620px}
.single-gallery img{object-position:center 49%}
.elba-gallery{grid-template-columns:2fr 1fr 1fr;grid-template-rows:310px 210px}
.elba-gallery .gallery-main{grid-row:1/3}
.elba-gallery .gallery-main img{object-position:center 48%}
.elba-gallery .gallery-thumb:nth-child(n+6){display:none}
.elba-gallery .gallery-thumb.overnight{display:block}
.elba-gallery .overnight span{position:absolute;z-index:2;left:11px;bottom:10px;background:rgba(14,42,37,.82);color:#fff;padding:6px 9px;border-radius:999px;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase}
.boat-details{display:grid;grid-template-columns:1fr 1.15fr auto;gap:50px;align-items:start;padding-top:31px}
.boat-lead{font-family:"Playfair Display",serif;font-size:1.35rem;line-height:1.35;margin:0}
.boat-facts{margin:0;display:grid;gap:9px}
.boat-facts div{display:grid;grid-template-columns:115px 1fr;gap:18px;padding-bottom:9px;border-bottom:1px solid rgba(28,37,32,.13)}
.boat-facts dt{text-transform:uppercase;letter-spacing:.11em;font-size:.64rem;font-weight:600;color:#666f69}
.boat-facts dd{margin:0;font-size:.88rem}
.charter-help{background:#173a33;color:white}
.charter-help p{color:rgba(255,255,255,.75)}
.charter-help .btn{margin-top:10px;background:#f1eee6;color:#173a33;border-color:#f1eee6}
.lightbox{position:fixed;z-index:2200;inset:0;background:rgba(5,14,12,.96);display:none;align-items:center;justify-content:center;padding:55px 80px}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:86vh;width:auto;height:auto;object-fit:contain}
.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:0;background:rgba(255,255,255,.08);color:#fff;cursor:pointer;z-index:2}
.lightbox-close{top:18px;right:23px;width:44px;height:44px;border-radius:50%;font-size:2rem}
.lightbox-prev,.lightbox-next{top:50%;transform:translateY(-50%);width:48px;height:70px;border-radius:8px;font-size:3rem;line-height:1}
.lightbox-prev{left:20px}.lightbox-next{right:20px}
.lightbox-count{position:absolute;bottom:18px;color:#fff;font-size:.78rem;letter-spacing:.12em}
.modal-open{overflow:hidden}
.quote-modal{position:fixed;z-index:2100;inset:0;display:none;align-items:center;justify-content:center;padding:24px}
.quote-modal.open{display:flex}
.quote-backdrop{position:absolute;inset:0;background:rgba(7,23,20,.72);backdrop-filter:blur(6px)}
.quote-panel{position:relative;z-index:2;width:min(760px,100%);max-height:92vh;overflow:auto;background:#fbfaf6;border-radius:22px;padding:34px}
.quote-panel h2{font-size:clamp(2.3rem,5vw,4.4rem);margin:7px 0 11px}
.quote-panel>p{color:var(--muted)}
.quote-close{position:absolute;right:17px;top:13px;border:0;background:none;font-size:2rem;cursor:pointer}
.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:24px 0 18px}
.quote-grid label{font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;font-weight:600}
.quote-grid label.wide{grid-column:1/-1}
.quote-grid input,.quote-grid textarea{display:block;width:100%;margin-top:6px;border:1px solid #cbc9c1;background:#fff;border-radius:10px;padding:12px 13px;font:inherit;color:var(--ink)}
.quote-grid textarea{min-height:95px;resize:vertical}
.form-note{font-size:.68rem;color:var(--muted);margin-bottom:0}
@media(max-width:900px){
  .charter-intro-grid,.charter-help-grid{grid-template-columns:1fr;gap:25px}
  .boat-title-row{align-items:flex-start;flex-direction:column}
  .boat-spec{text-align:left}
  .boat-details{grid-template-columns:1fr 1fr}.boat-details>.btn{grid-column:1/-1;width:max-content}
  .compact-gallery{grid-template-rows:430px}.single-gallery{grid-template-rows:480px}
  .elba-gallery{grid-template-columns:1.5fr 1fr;grid-template-rows:250px 200px}.elba-gallery .gallery-main{grid-row:1/3}.elba-gallery .gallery-thumb:nth-child(4),.elba-gallery .gallery-thumb:nth-child(5){display:none}
}
@media(max-width:620px){
  .charter-hero{min-height:690px}.charter-hero>img{object-position:58% center}.charter-hero-copy{padding-bottom:48px}
  .boat-block{padding:66px 0 74px}
  .boat-spec{white-space:normal}
  .compact-gallery{grid-template-columns:1fr;grid-template-rows:360px 220px}.single-gallery{grid-template-rows:380px}
  .elba-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:7px}.elba-gallery button{flex:0 0 88%;height:360px;scroll-snap-align:start}.elba-gallery .gallery-thumb:nth-child(n){display:block}
  .boat-details{grid-template-columns:1fr;gap:26px}.boat-details>.btn{grid-column:auto;width:100%}
  .boat-facts div{grid-template-columns:90px 1fr}
  .quote-grid{grid-template-columns:1fr}.quote-grid label.wide{grid-column:auto}.quote-panel{padding:26px 18px}
  .lightbox{padding:55px 12px}.lightbox-prev,.lightbox-next{width:40px;height:56px;background:rgba(0,0,0,.28)}.lightbox-prev{left:4px}.lightbox-next{right:4px}
}

/* V14 — complete private charter galleries */
.portfolio-gallery{
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:300px 220px;
}
.portfolio-gallery .gallery-main{grid-row:1/3}
.portfolio-gallery .gallery-main img{object-position:center center}
.portfolio-gallery .gallery-thumb:nth-child(n+6){display:none}
.portfolio-gallery .gallery-thumb:nth-child(6){display:block}
.portfolio-gallery .more-photos{
  position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;
  background:rgba(8,28,24,.48);color:#fff;text-transform:uppercase;letter-spacing:.12em;
  font-size:.72rem;font-weight:650;backdrop-filter:blur(1px)
}
.portfolio-gallery .gallery-thumb:nth-child(6) img{filter:brightness(.78)}
@media(max-width:900px){
  .portfolio-gallery{grid-template-columns:1.5fr 1fr;grid-template-rows:250px 200px}
  .portfolio-gallery .gallery-main{grid-row:1/3}
  .portfolio-gallery .gallery-thumb:nth-child(4),
  .portfolio-gallery .gallery-thumb:nth-child(5){display:none}
  .portfolio-gallery .gallery-thumb:nth-child(6){display:block}
}
@media(max-width:620px){
  .portfolio-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:7px;padding-bottom:4px}
  .portfolio-gallery button{flex:0 0 88%;height:340px;scroll-snap-align:start}
  .portfolio-gallery .gallery-thumb:nth-child(n){display:block}
  .portfolio-gallery .more-photos{display:none}
  .portfolio-gallery .gallery-thumb:nth-child(6) img{filter:none}
}

.cta-compare{font-size:.82rem;opacity:.65;margin:.55rem 0 0}.boat-checks{display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1rem;margin:1rem 0 1.25rem}.boat-checks label{display:flex;gap:.5rem;align-items:center;font-size:.9rem}.quote-form select{width:100%;padding:.9rem;border:1px solid rgba(0,0,0,.16);border-radius:4px;background:#fff;font:inherit}.phone-row{display:grid;grid-template-columns:120px 1fr;gap:.5rem}.quote-form small{display:block;margin-top:.35rem;opacity:.62;font-size:.76rem}@media(max-width:650px){.boat-checks{grid-template-columns:1fr}.phone-row{grid-template-columns:105px 1fr}}


/* Michelle's original Papagayo Collective signature logo */
.nav a.logo, .site-nav a.logo, nav a.logo {
 display:flex!important; align-items:center!important; justify-content:flex-start!important;
 width:184px!important; min-width:184px!important; max-width:184px!important;
 height:53px!important; padding:0!important; font-size:0!important;
 line-height:0!important; letter-spacing:0!important; overflow:visible!important;
 text-indent:0!important; white-space:normal!important;
}
.nav a.logo img, .site-nav a.logo img, nav a.logo img {
 display:block!important; width:100%!important; height:100%!important;
 object-fit:contain!important; object-position:left center!important;
 filter:brightness(0) invert(1)!important;
}
@media(max-width:700px){
 .nav a.logo,.site-nav a.logo,nav a.logo{width:145px!important;min-width:145px!important;max-width:145px!important;height:46px!important}
}
