*{box-sizing:border-box}
:root{
  --navy:#062b62;
  --blue:#0b72bd;
  --green:#2d8f2f;
  --green-dark:#1f7323;
  --paper:#f7f1e6;
  --paper-deep:#efe5d4;
  --ink:#18314f;
  --muted:#6c7280;
}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
.container{width:min(1180px,92%);margin:auto}

.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid #e4ecf4}
.nav-wrap{min-height:92px;display:flex;align-items:center;gap:24px}
.logo{width:190px;flex:0 0 190px;position:relative}
.logo img{width:100%;height:84px;object-fit:contain}
.logo::after{
  content:"";position:absolute;width:58px;height:58px;left:64px;top:7px;
  border:3px solid transparent;border-top-color:var(--blue);border-right-color:var(--green);
  border-bottom-color:rgba(11,114,189,.25);border-left-color:rgba(45,143,47,.25);
  border-radius:50%;animation:orbit 4.8s linear infinite;pointer-events:none
}
.nav{display:flex;gap:18px;margin-left:auto;align-items:center;font-weight:700;text-transform:uppercase;font-size:.69rem}
.nav a{padding:35px 0 12px;border-bottom:3px solid transparent;white-space:nowrap}
.nav a:hover,.nav a.active{color:var(--green);border-color:var(--green)}
.whatsapp,.button{display:inline-flex;align-items:center;justify-content:center;border-radius:9px;font-weight:800;text-transform:uppercase}
.whatsapp{background:var(--green);color:#fff;padding:13px 17px;font-size:.78rem}
.menu-btn{display:none;margin-left:auto;background:none;border:0;width:40px}
.menu-btn span{display:block;height:3px;background:var(--navy);margin:6px 0;border-radius:4px}

.letter-page{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)),
    radial-gradient(circle at 20% 15%,rgba(255,255,255,.45),transparent 30%),
    var(--paper);
  padding:52px 0 72px;
}
.letter-page::before{
  content:"";
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(90,65,35,.025) 1px,transparent 1px);
  background-size:100% 28px;
  pointer-events:none;
}
.letter-grid{
  position:relative;z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);
  gap:58px;
  align-items:start;
}
.portrait-panel{
  position:sticky;
  top:122px;
  height:calc(100vh - 150px);
  min-height:680px;
  border-radius:30px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(56,45,31,.20);
}
.portrait-panel img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 18%;
}
.letter-content{
  padding:26px 12px 18px;
  min-height:1250px;
}
.script-intro,.script-thanks,.signature{
  font-family:"Brush Script MT","Segoe Script","Lucida Handwriting",cursive;
}
.script-intro{
  margin:0;
  font-size:2.25rem;
  color:#9d4d44;
  transform:rotate(-2deg);
}
.letter-content h1{
  margin:2px 0 24px;
  color:var(--navy);
  font-size:clamp(3.4rem,6vw,6.4rem);
  line-height:.92;
  letter-spacing:-.055em;
}
.lead{
  font-size:1.18rem;
  line-height:1.8;
  color:#4e5967;
  margin:0 0 34px;
}
.story-points{display:grid;gap:22px}
.story-point{
  display:grid;
  grid-template-columns:36px 1fr;
  gap:14px;
  align-items:start;
}
.story-point .icon{
  width:32px;height:32px;border-radius:50%;
  display:grid;place-items:center;
  background:#e8f2e3;color:var(--green-dark);
  font-weight:900;
}
.story-point p{margin:0;line-height:1.75;color:#505b68}
.thanks-block{
  margin:46px 0 34px;
  padding:28px 28px 26px;
  border-radius:20px;
  background:rgba(255,255,255,.56);
  border:1px solid rgba(120,90,55,.13);
}
.script-thanks{
  margin:0 0 6px;
  font-size:2.55rem;
  color:#a34f44;
}
.thanks-block p{margin:0;line-height:1.75;color:#515a65}
.closing{
  border-top:1px solid rgba(70,55,35,.16);
  padding-top:30px;
  text-align:center;
}
.closing>p{margin:0 0 8px;color:#7b6b5c;font-style:italic}
.closing h2{
  margin:0 0 26px;
  color:var(--navy);
  font-size:clamp(2.4rem,4vw,4.3rem);
  line-height:1.05;
}
.signature{
  font-size:3.4rem;
  color:#1f3e64;
  transform:rotate(-4deg);
  display:inline-block;
}
.signature-title{
  display:block;
  margin-top:2px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.72rem;
  color:#7b8088;
}
.flower-accent{
  position:absolute;
  pointer-events:none;
  z-index:1;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
}
.flower-left{
  left:-48px;
  bottom:3%;
  width:350px;
  height:310px;
  background-image:url("../assets/fundadora/flowers-hibiscus.png");
  opacity:.13;
  -webkit-mask-image:linear-gradient(to right,#000 42%,rgba(0,0,0,.7) 68%,transparent 100%);
  mask-image:linear-gradient(to right,#000 42%,rgba(0,0,0,.7) 68%,transparent 100%);
}
.flower-right{
  right:-48px;
  top:10%;
  width:330px;
  height:300px;
  background-image:url("../assets/fundadora/flowers-green.png");
  opacity:.11;
  -webkit-mask-image:linear-gradient(to left,#000 42%,rgba(0,0,0,.7) 68%,transparent 100%);
  mask-image:linear-gradient(to left,#000 42%,rgba(0,0,0,.7) 68%,transparent 100%);
}

.cta{background:linear-gradient(90deg,#27872d,#47a23d);color:#fff;padding:48px 0}
.cta-grid{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}
.cta span{text-transform:uppercase;font-weight:900;letter-spacing:.12em}
.cta h2{color:#fff;font-size:2.5rem;margin:6px 0}
.button{padding:15px 22px;font-size:.8rem;border:2px solid transparent;transition:.25s}
.button.white{background:#fff;color:var(--green-dark)}

.footer{background:#052d62;color:#fff;padding:54px 0}
.footer-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:34px}
.footer-brand img{width:190px;background:#fff;border-radius:8px;padding:6px}
.footer h3{text-transform:uppercase;font-size:.9rem}
.footer a,.footer span{display:block;margin:9px 0;color:#d6e3f1;font-size:.9rem}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:none}
@keyframes orbit{to{transform:rotate(360deg)}}

@media(max-width:980px){
  .letter-grid{grid-template-columns:1fr;gap:36px}
  .portrait-panel{
    position:relative;
    top:auto;
    height:78vh;
    min-height:620px;
  }
  .letter-content{min-height:auto;padding:10px 0 0}
}
@media(max-width:850px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:92px;left:0;right:0;background:#fff;flex-direction:column;padding:22px 5%;box-shadow:0 16px 32px rgba(0,0,0,.15)}
  .nav.open{display:flex}
  .cta-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
  .whatsapp{display:none}
}
@media(max-width:560px){
  .logo{width:155px;flex-basis:155px}
  .logo img{height:74px}
  .logo::after{width:50px;height:50px;left:52px;top:7px;border-width:2.5px}
  .nav-wrap{min-height:80px}
  .nav{top:80px}
  .letter-page{padding:34px 0 52px}
  .portrait-panel{height:68vh;min-height:500px;border-radius:22px}
  .letter-content h1{font-size:3.4rem}
  .lead{font-size:1.04rem}
  .flower-left,.flower-right{width:210px;height:190px;opacity:.08}
  .footer-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}


/* ===== Nuestra Fundadora v2 refinements ===== */
/* Keep Blanca bright while blending the portrait softly into the letter page. */
.portrait-panel{
  background:var(--paper);
}

.portrait-panel img{
  opacity:.95;
  filter:brightness(1.04) saturate(1.02) contrast(.99);
}

.portrait-panel::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(90deg,
      rgba(247,241,230,.10) 0%,
      rgba(247,241,230,0) 16%,
      rgba(247,241,230,0) 84%,
      rgba(247,241,230,.12) 100%),
    linear-gradient(180deg,
      rgba(247,241,230,.08) 0%,
      rgba(247,241,230,0) 16%,
      rgba(247,241,230,0) 86%,
      rgba(247,241,230,.10) 100%);
}

.portrait-panel::after{
  z-index:3;
}


/* ===== v3: blend Blanca portrait ~20% more while keeping brightness ===== */
.portrait-panel img{
  opacity:.88 !important;
  filter:brightness(1.06) saturate(1.02) contrast(.98) !important;
}

.portrait-panel::before{
  background:
    linear-gradient(90deg,
      rgba(247,241,230,.18) 0%,
      rgba(247,241,230,.04) 18%,
      rgba(247,241,230,.04) 82%,
      rgba(247,241,230,.18) 100%),
    linear-gradient(180deg,
      rgba(247,241,230,.16) 0%,
      rgba(247,241,230,.03) 18%,
      rgba(247,241,230,.03) 82%,
      rgba(247,241,230,.16) 100%) !important;
}


/* v4: larger feathered portrait and personal letter moments */
.letter-grid{
  grid-template-columns:minmax(0,1.32fr) minmax(390px,.68fr)!important;
  gap:42px!important;
}
.portrait-panel{
  height:calc(100vh - 118px)!important;
  min-height:760px!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}
.portrait-panel img{
  width:108%!important;
  height:108%!important;
  max-width:none!important;
  margin-left:-4%!important;
  margin-top:-3%!important;
  object-fit:cover!important;
  object-position:center 16%!important;
  opacity:.96!important;
  filter:brightness(1.07) saturate(1.02) contrast(.99)!important;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.62) 5%,#000 13%,#000 82%,rgba(0,0,0,.70) 92%,transparent 100%),linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.72) 5%,#000 12%,#000 88%,rgba(0,0,0,.68) 95%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.62) 5%,#000 13%,#000 82%,rgba(0,0,0,.70) 92%,transparent 100%),linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.72) 5%,#000 12%,#000 88%,rgba(0,0,0,.68) 95%,transparent 100%);
  mask-composite:intersect;
}
.portrait-panel::after{display:none!important}
.letter-content{padding-top:10px!important}
.letter-moments{margin:36px 0 12px}
.letter-moment{display:grid;grid-template-columns:54px 1fr;gap:16px;align-items:start;padding:8px 0 6px}
.moment-mark{
  width:46px;height:46px;border:1.5px solid rgba(157,77,68,.34);border-radius:50%;
  display:grid;place-items:center;font-family:"Brush Script MT","Segoe Script","Lucida Handwriting",cursive;
  font-size:1.55rem;color:#9d4d44;background:rgba(255,255,255,.32);transform:rotate(-4deg)
}
.letter-moment h3{
  margin:2px 0 8px;font-family:"Brush Script MT","Segoe Script","Lucida Handwriting",cursive;
  font-size:1.75rem;font-weight:400;color:#8e4a3f
}
.letter-moment p{margin:0;line-height:1.78;color:#505b68}
.heart-divider{display:flex;align-items:center;gap:12px;margin:15px 0 13px;color:#aa6a5c}
.heart-divider::before,.heart-divider::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(142,74,63,.35))}
.heart-divider::after{background:linear-gradient(90deg,rgba(142,74,63,.35),transparent)}
.heart-divider span{font-family:"Brush Script MT","Segoe Script","Lucida Handwriting",cursive;font-size:1.2rem}
@media(max-width:980px){
  .letter-grid{grid-template-columns:1fr!important}
  .portrait-panel{height:82vh!important;min-height:660px!important}
}
@media(max-width:560px){
  .portrait-panel{height:70vh!important;min-height:520px!important}
  .portrait-panel img{width:112%!important;height:112%!important;margin-left:-6%!important}
  .letter-moment{grid-template-columns:44px 1fr}
  .moment-mark{width:38px;height:38px;font-size:1.25rem}
  .letter-moment h3{font-size:1.45rem}
}




/* ===== v1.2 review: airport image behind the closing message ===== */
.closing{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:620px;
  margin-top:34px;
  padding:72px 38px 54px;
  border-top:0;
  border-radius:26px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:rgba(247,241,230,.74);
  box-shadow:0 20px 46px rgba(56,45,31,.13);
}
.closing::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:url("../assets/fundadora/blanca-airport-nicaragua.png") center 42%/cover no-repeat;
  opacity:.40;
}
.closing::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(to bottom,rgba(247,241,230,.32) 0%,rgba(247,241,230,.46) 46%,rgba(247,241,230,.93) 82%,var(--paper) 100%),
    linear-gradient(to right,rgba(247,241,230,.24),rgba(247,241,230,.10),rgba(247,241,230,.24));
}
.closing>p,.closing h2,.closing .signature,.closing .signature-title{
  position:relative;
  z-index:1;
  text-shadow:0 1px 0 rgba(255,255,255,.76);
}
.closing h2{max-width:620px;margin-left:auto;margin-right:auto}

@media(max-width:560px){
  .closing{
    min-height:520px;
    padding:52px 22px 40px;
    border-radius:20px;
  }
  .closing::before{background-position:55% 38%}
}

/* ===== v1.3 fixed: wider airport background only; no layout/content changes ===== */
/* Gracias and all text/layout remain unchanged. Only the existing airport image is resized/repositioned. */
.closing{
  position:relative;
  z-index:1;
  overflow:visible;
}

.closing::before{
  left:50% !important;
  right:auto !important;
  width:calc(100vw - 24px) !important;
  max-width:none !important;
  transform:translateX(-50%) !important;
  top:-260px !important;
  bottom:-42px !important;
  height:auto !important;
  background-size:100% auto !important;
  background-position:center top !important;
  background-repeat:no-repeat !important;
  opacity:.40 !important;
}

.closing > *{
  position:relative;
  z-index:1;
}

@media(max-width:850px){
  .closing::before{
    width:100vw !important;
    top:-220px !important;
    background-size:auto 100% !important;
    background-position:center top !important;
  }
}

@media(max-width:560px){
  .closing::before{
    top:-180px !important;
    bottom:-24px !important;
    background-size:auto 100% !important;
    background-position:56% top !important;
  }
}


/* v1.3.4 review - shift only Blanca in airport background */
.closing::before{
    background-position:35% top !important;
}
@media(max-width:560px){
    .closing::before{
        background-position:42% top !important;
    }
}


/* ===== v1.3.6 REVIEW =====
   Move only the "No enviamos cajas. Enviamos amor." closing box to the right.
   No other content or layout changes.
*/
.closing{
    width:min(560px, 46%);
    margin-left:auto !important;
    margin-right:clamp(22px, 4vw, 70px) !important;
    text-align:center;
}

@media (max-width:900px){
    .closing{
        width:min(520px, 58%);
        margin-right:24px !important;
    }
}

@media (max-width:640px){
    .closing{
        width:auto;
        margin-left:18px !important;
        margin-right:18px !important;
    }
}


/* ===== v1.3.7 REVIEW =====
   Replace the airport CSS background with a real image layer.
   This lets the image stretch fully left-to-right without cutting Blanca off.
*/
.closing::before{
    content:none !important;
    display:none !important;
}

.airport-closing-wrap{
    position:relative;
    width:100%;
    min-height:520px;
    overflow:hidden;
}

.airport-photo-layer{
    position:absolute;
    top:0;
    left:-12%;
    width:124%;
    height:100%;
    object-fit:fill;
    object-position:left top;
    opacity:.40;
    z-index:0;
    pointer-events:none;
}

.airport-closing-wrap .closing{
    position:relative;
    z-index:1;
}

@media (max-width:900px){
    .airport-closing-wrap{
        min-height:470px;
    }

    .airport-photo-layer{
        left:-18%;
        width:136%;
    }
}

@media (max-width:640px){
    .airport-closing-wrap{
        min-height:420px;
    }

    .airport-photo-layer{
        left:-24%;
        width:148%;
    }
}


/* ==== v1.4 REVIEW full-width airport section ==== */
.airport-fullbleed{
 position:relative;
 width:100vw;
 margin-left:calc(50% - 50vw);
 margin-right:calc(50% - 50vw);
 overflow:hidden;
}
.airport-inner{
 max-width:1200px;
 margin:0 auto;
 position:relative;
}
.airport-closing-wrap{
 width:100vw !important;
 margin-left:calc(50% - 50vw) !important;
 min-height:560px;
}
.airport-photo-layer{
 left:0 !important;
 width:100% !important;
 height:100% !important;
 object-fit:cover !important;
 object-position:center top !important;
}
.airport-closing-wrap .closing{
 max-width:520px;
 margin-left:auto;
 margin-right:6%;
}