*{box-sizing:border-box}:root{--navy:#062b62;--blue:#0b72bd;--green:#2d8f2f;--light:#f2f7fb;--muted:#5e728a}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;color:var(--navy)}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:#fff;border-bottom:1px solid #e5edf4}.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:#0b72bd40;border-left-color:#2d8f2f40;border-radius:50%;animation:orbit 4.8s linear infinite}.nav{display:flex;gap:18px;margin-left:auto;font-size:.69rem;font-weight:700;text-transform:uppercase}.nav a{padding:35px 0 12px;border-bottom:3px solid transparent;white-space:nowrap}.nav a.active,.nav a:hover{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}.menu-btn span{display:block;width:32px;height:3px;background:var(--navy);margin:6px}.hero{position:relative;min-height:590px;overflow:hidden}.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#fffffff5,#ffffffd8 42%,#ffffff22 72%,#04275222)}.hero-copy{position:relative;z-index:2;min-height:590px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.eyebrow{color:#1f7323;font-weight:900;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem}.hero h1{max-width:780px;margin:14px 0 20px;font-size:clamp(3rem,5.2vw,5.7rem);line-height:.97;text-transform:uppercase;letter-spacing:-.045em}.hero p{max-width:610px;font-size:1.18rem;line-height:1.65;font-weight:700;color:#294b70}.curve{position:absolute;left:-5%;right:-5%;bottom:-55px;height:110px;border-radius:50% 50% 0 0;background:#fff;z-index:3}.button{padding:15px 22px;font-size:.8rem}.green{background:linear-gradient(#3ba239,#257b29);color:#fff}.white{background:#fff;color:#1f7323}.section{padding:92px 0}.quick{padding-top:75px;padding-bottom:60px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.quick article{padding:25px 20px;text-align:center;border:1px solid #dfe8f0;border-radius:20px;box-shadow:0 12px 30px #04275214}.quick b{font-size:2.2rem}.quick h3{text-transform:uppercase;font-size:.92rem}.quick p{font-size:.9rem;line-height:1.5;color:var(--muted)}.faq{background:var(--light)}.faq-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:58px;align-items:start}.intro{position:sticky;top:130px}.intro h2,.copy h2,.cta h2{font-size:clamp(2rem,3.4vw,3.7rem);line-height:1.06;margin:10px 0 20px}.intro>p,.copy p{font-size:1.05rem;line-height:1.72;color:var(--muted)}.help{display:block;margin-top:28px;padding:22px;border-radius:18px;background:var(--navy);color:#fff}.help strong,.help span,.help em{display:block}.help span{margin:8px 0 14px;color:#d8e7f6}.help em{color:#9bdf78;font-style:normal;font-weight:900}.accordion{display:grid;gap:14px}.item{background:#fff;border:1px solid #dae6ef;border-radius:16px;overflow:hidden;box-shadow:0 8px 24px #0427520f}.item button{width:100%;border:0;background:#fff;padding:21px 22px;display:flex;justify-content:space-between;align-items:center;text-align:left;font:inherit;font-weight:900;color:var(--navy);cursor:pointer}.item button b{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#edf5eb;color:#1f7323;font-size:1.3rem;transition:.25s}.item.open button b{transform:rotate(45deg);background:var(--green);color:#fff}.answer{max-height:0;overflow:hidden;transition:max-height .35s ease}.answer p{margin:0;padding:0 22px 22px;color:var(--muted);line-height:1.65}.split,.mascot-grid,.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.photo{border-radius:28px;overflow:hidden;box-shadow:0 20px 46px #04275221}.photo img{width:100%;height:500px;object-fit:cover}.copy ul{list-style:none;padding:0}.copy li{position:relative;padding:10px 0 10px 34px;font-weight:700}.copy li:before{content:"✓";position:absolute;left:0;top:8px;width:23px;height:23px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center}.mascot{background:linear-gradient(#f9fcff,#eef7ff)}.mascot-wrap{height:390px;position:relative;display:flex;align-items:flex-end;justify-content:center}.mascot-wrap img{max-height:360px;transform-origin:55% 88%}.bubble{position:absolute;right:5%;top:5%;max-width:190px;padding:13px 16px;border-radius:16px 16px 5px 16px;background:#fff;box-shadow:0 14px 30px #04275221;opacity:0;transform:translateY(8px) scale(.96);transition:.28s;font-weight:800;font-size:.84rem}.bubble.show{opacity:1;transform:none}#choco.answer{animation:answer .85s ease-in-out}#choco.wave{animation:wave .9s ease-in-out}.cta{background:linear-gradient(90deg,#27872d,#47a23d);color:#fff;padding:48px 0}.cta-grid{grid-template-columns:1fr auto;gap:30px}.cta span{text-transform:uppercase;font-weight:900;letter-spacing:.12em}.cta h2{color:#fff;font-size:2.5rem;margin:6px 0}.footer{background:#052d62;color:#fff;padding:54px 0}.footer-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:34px}.footer 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(24px);transition:.7s}.reveal.visible{opacity:1;transform:none}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes answer{35%{transform:rotate(-1.8deg) translateY(-2px)}70%{transform:rotate(.8deg)}}@keyframes wave{35%{transform:rotate(-1.5deg) scale(1.01)}70%{transform:rotate(.8deg)}}@media(max-width:1080px){.nav{gap:12px;font-size:.62rem}.whatsapp{display:none}}@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%}.nav.open{display:flex}.quick-grid{grid-template-columns:repeat(2,1fr)}.faq-layout,.split,.mascot-grid,.cta-grid{grid-template-columns:1fr}.intro{position:static}.footer-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.logo{width:155px;flex-basis:155px}.logo img{height:74px}.logo:after{width:50px;height:50px;left:52px;top:7px}.nav-wrap{min-height:80px}.nav{top:80px}.hero,.hero-copy{min-height:540px}.hero h1{font-size:2.65rem}.section{padding:68px 0}.quick-grid{grid-template-columns:1fr}.photo img{height:350px}.footer-grid{grid-template-columns:1fr}}

/* ===== FAQ v6 — exact requested image changes + real accents ===== */

/* Show the complete hero image without cutting off Chocolito's head. */
.hero > img{
  object-position:center center !important;
}

/* Make the second Chocolito image fit naturally in the existing bottom frame. */
.support .photo img{
  object-position:center center !important;
}

/* Real, translucent Nicaragua accents from the supplied images. */
.quick,
.faq,
.support,
.mascot{
  position:relative;
  overflow:hidden;
}

.quick::after{
  content:"";
  position:absolute;
  right:-8px;
  top:8%;
  width:270px;
  height:220px;
  background:url("../assets/faq/faq-accent-flowers.jpg") center / cover no-repeat;
  opacity:.15;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(to left,#000 42%,rgba(0,0,0,.72) 67%,transparent 100%);
  mask-image:linear-gradient(to left,#000 42%,rgba(0,0,0,.72) 67%,transparent 100%);
}

.faq::before{
  content:"";
  position:absolute;
  left:-10px;
  bottom:0;
  width:370px;
  height:250px;
  background:url("../assets/faq/faq-accent-volcano-palm.jpg") center / cover no-repeat;
  opacity:.17;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(to right,#000 42%,rgba(0,0,0,.72) 67%,transparent 100%);
  mask-image:linear-gradient(to right,#000 42%,rgba(0,0,0,.72) 67%,transparent 100%);
}

.support::after{
  content:"";
  position:absolute;
  right:-12px;
  bottom:0;
  width:300px;
  height:225px;
  background:url("../assets/faq/faq-accent-lake.jpg") center / cover no-repeat;
  opacity:.12;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(to left,#000 40%,rgba(0,0,0,.68) 66%,transparent 100%);
  mask-image:linear-gradient(to left,#000 40%,rgba(0,0,0,.68) 66%,transparent 100%);
}

.mascot::before{
  content:"";
  position:absolute;
  left:-10px;
  bottom:0;
  width:315px;
  height:215px;
  background:url("../assets/faq/faq-accent-volcano-palm.jpg") center / cover no-repeat;
  opacity:.11;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(to right,#000 40%,rgba(0,0,0,.66) 66%,transparent 100%);
  mask-image:linear-gradient(to right,#000 40%,rgba(0,0,0,.66) 66%,transparent 100%);
}

.quick .container,
.faq .container,
.support .container,
.mascot .container{
  position:relative;
  z-index:1;
}

@media(max-width:700px){
  .quick::after,
  .faq::before,
  .support::after,
  .mascot::before{
    width:170px;
    height:120px;
    opacity:.08;
  }
}


/* ===== FAQ v7 — mango and dragonfruit accents only ===== */
/* Existing page structure, images, FAQ layout, typography, spacing,
   accordion, navigation, footer, and Chocolito behavior remain unchanged. */

/* Remove the previous non-fruit accent layers from this preview */
.quick::after,
.faq::before,
.support::after,
.mascot::before{
  display:none !important;
  content:none !important;
}

/* Mangoes fading in from the upper-right of the FAQ area */
.faq{
  position:relative;
  overflow:hidden;
}
.faq::after{
  content:"";
  position:absolute;
  right:-20px;
  top:70px;
  width:300px;
  height:235px;
  background:url("../assets/faq/faq-mangoes.png") center / cover no-repeat;
  opacity:.11;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:
    linear-gradient(to left,#000 40%,rgba(0,0,0,.72) 68%,transparent 100%),
    linear-gradient(to bottom,#000 72%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to left,#000 40%,rgba(0,0,0,.72) 68%,transparent 100%),
    linear-gradient(to bottom,#000 72%,transparent 100%);
  mask-composite:intersect;
}
.faq .container{
  position:relative;
  z-index:1;
}

/* Dragonfruit fading in from the lower-left of the same FAQ area */
.faq .container::before{
  content:"";
  position:absolute;
  left:-120px;
  bottom:-70px;
  width:320px;
  height:245px;
  background:url("../assets/faq/faq-dragonfruit.png") center / cover no-repeat;
  opacity:.10;
  pointer-events:none;
  z-index:-1;
  -webkit-mask-image:
    linear-gradient(to right,#000 42%,rgba(0,0,0,.70) 68%,transparent 100%),
    linear-gradient(to top,#000 70%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to right,#000 42%,rgba(0,0,0,.70) 68%,transparent 100%),
    linear-gradient(to top,#000 70%,transparent 100%);
  mask-composite:intersect;
}

/* Smaller fruit accents near the bottom content */
.support{
  position:relative;
  overflow:hidden;
}
.support::before{
  content:"";
  position:absolute;
  right:-18px;
  bottom:-20px;
  width:220px;
  height:165px;
  background:url("../assets/faq/faq-mangoes.png") center / cover no-repeat;
  opacity:.07;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(to left,#000 38%,rgba(0,0,0,.62) 66%,transparent 100%);
  mask-image:linear-gradient(to left,#000 38%,rgba(0,0,0,.62) 66%,transparent 100%);
}
.support .container{
  position:relative;
  z-index:1;
}

.mascot{
  position:relative;
  overflow:hidden;
}
.mascot::after{
  content:"";
  position:absolute;
  left:-15px;
  bottom:-25px;
  width:210px;
  height:165px;
  background:url("../assets/faq/faq-dragonfruit.png") center / cover no-repeat;
  opacity:.07;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(to right,#000 38%,rgba(0,0,0,.62) 66%,transparent 100%);
  mask-image:linear-gradient(to right,#000 38%,rgba(0,0,0,.62) 66%,transparent 100%);
}
.mascot .container{
  position:relative;
  z-index:1;
}

@media(max-width:700px){
  .faq::after{
    width:165px;
    height:130px;
    opacity:.075;
  }
  .faq .container::before{
    left:-70px;
    width:175px;
    height:135px;
    opacity:.07;
  }
  .support::before,
  .mascot::after{
    width:130px;
    height:100px;
    opacity:.05;
  }
}