*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(100deg,#dff8fb 0%,#fff8ef 50%,#dff8fb 100%)}
body{font-family:Arial,sans-serif;color:#082f63;overflow-x:hidden}
.desktop-page{display:block}
.approved-canvas{position:relative;width:min(100vw,1400px);aspect-ratio:1134/795;margin:0 auto;overflow:hidden;background:#e5fafc;box-shadow:0 0 24px rgba(8,47,99,.08)}
.approved-canvas>img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.hot{position:absolute;display:block;z-index:5}

/* exact approved header */
.nav-home{left:35%;top:2.6%;width:4.3%;height:6.7%}
.nav-dest{left:39%;top:2.6%;width:8.1%;height:6.7%}
.nav-cruises{left:47.2%;top:2.6%;width:5.5%;height:6.7%}
.nav-honeymoons{left:53%;top:2.6%;width:14.4%;height:6.7%}
.nav-about{left:67.5%;top:2.6%;width:5%;height:6.7%}
.nav-contact{left:72.5%;top:2.6%;width:5.7%;height:6.7%}
.nav-instagram{left:78.9%;top:2.6%;width:2.7%;height:6.7%}
.nav-facebook{left:81.7%;top:2.6%;width:2.7%;height:6.7%}
.nav-plan{left:84.5%;top:2.6%;width:12.7%;height:6.7%}

/* visual CTA button positions */
.explore{height:4.9%}
.e1{left:20.0%;top:49.3%;width:10.5%}
.e2{left:52.0%;top:49.3%;width:10.5%}
.e3{left:84.2%;top:49.3%;width:10.5%}
.e4{left:20.0%;top:67.0%;width:10.5%}
.e5{left:52.0%;top:67.0%;width:10.5%}
.e6{left:84.2%;top:67.0%;width:10.5%}
.body-plan{left:75.2%;top:77.4%;width:13.2%;height:5.6%}

/* footer contact hotspots */
#contact{position:absolute;left:0;top:84%;width:100%;height:1px}
.phone{left:15.5%;top:90.4%;width:10%;height:7%}
.email{left:35.3%;top:90.4%;width:14%;height:7%}
.ig{left:56.8%;top:90.4%;width:12%;height:7%}
.fb{left:78.0%;top:90.4%;width:10%;height:7%}

.hot:focus{outline:3px solid #ff1680;outline-offset:-2px}

/* Mobile Honeymoons: exact approved desktop artwork, rearranged for phones */
.mobile-honeymoons{display:none}

@media(max-width:700px){
  html,body{
    background:#eaf9fb;
  }

  .desktop-page{
    display:none !important;
  }

  .mobile-honeymoons{
    display:block;
    width:100%;
    max-width:520px;
    margin:0 auto;
    background:linear-gradient(180deg,#ffffff 0%,#e9fbfd 42%,#fff8ef 100%);
    color:#082f63;
    box-shadow:0 0 20px rgba(8,47,99,.08);
  }

  .mobile-honeymoons-header{
    background:linear-gradient(180deg,#ffffff 0%,#edfafe 100%);
    padding:8px 10px 13px;
    border-bottom:3px solid #ff1680;
    text-align:center;
  }

  .mobile-logo-link{
    display:block;
    width:min(94%,400px);
    margin:0 auto 7px;
  }

  .mobile-logo-link img{
    width:100%;
    height:auto;
    display:block;
  }

  .mobile-nav{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:5px 11px;
    padding:4px 3px 10px;
  }

  .mobile-nav a{
    color:#082f63;
    text-decoration:none;
    text-transform:uppercase;
    font-family:Arial,sans-serif;
    font-size:10px;
    line-height:1.35;
    font-weight:800;
  }

  .mobile-nav a.active{
    color:#ff1680;
    text-decoration:underline;
    text-underline-offset:3px;
  }

  .mobile-plan-top{
    display:inline-block;
    padding:11px 22px;
    border-radius:999px;
    background:#ff1680;
    color:#fff;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    text-decoration:none;
    box-shadow:0 6px 15px rgba(255,22,128,.18);
  }

  .mobile-honeymoon-hero{
    background:#e9fbfd;
  }

  .hero-title-art,
  .hero-scene-art{
    display:block;
    width:100%;
    height:auto;
  }

  .hero-title-art{
    border-bottom:3px solid #fff;
  }

  .hero-scene-art{
    min-height:155px;
    object-fit:cover;
    object-position:center;
  }

  .mobile-section-heading{
    text-align:center;
    padding:24px 18px 16px;
    background:linear-gradient(100deg,#dff8fb,#fff8ef,#dff8fb);
  }

  .mobile-section-heading span{
    display:block;
    font-size:11px;
    font-weight:900;
    letter-spacing:.14em;
  }

  .mobile-section-heading h1{
    margin:2px 0 0;
    font-family:"Brush Script MT","Segoe Print",cursive;
    font-size:38px;
    line-height:1;
    font-weight:400;
    color:#082f63;
  }

  .mobile-romance-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:6px;
    padding:6px;
    background:#fff;
  }

  .mobile-romance-grid a{
    display:block;
    overflow:hidden;
    border-radius:4px;
    box-shadow:0 5px 14px rgba(8,47,99,.10);
  }

  .mobile-romance-grid img{
    display:block;
    width:100%;
    height:auto;
  }


  .mobile-seo-copy{
    padding:24px 22px 26px;
    text-align:center;
    background:linear-gradient(100deg,#e8fbfd,#fff8ef,#e8fbfd);
    border-top:1px solid #d5ecef;
    border-bottom:1px solid #d5ecef;
  }

  .mobile-seo-copy h2{
    margin:0 0 10px;
    font-family:"Brush Script MT","Segoe Print",cursive;
    font-size:34px;
    line-height:1.05;
    font-weight:400;
    color:#082f63;
  }

  .mobile-seo-copy p{
    max-width:450px;
    margin:0 auto 10px;
    color:#345774;
    font-size:13px;
    line-height:1.52;
  }

  .mobile-seo-copy a{
    display:inline-block;
    margin-top:4px;
    color:#ff1680;
    font-size:12px;
    font-weight:900;
    text-decoration:underline;
    text-underline-offset:3px;
  }

  .mobile-planning-strip{
    padding:12px 14px 17px;
    text-align:center;
    background:linear-gradient(100deg,#fff8ef,#e6fafc);
  }

  .planning-copy-art{
    display:block;
    width:100%;
    height:auto;
    margin:0 auto 9px;
  }

  .mobile-planning-strip a{
    display:inline-block;
    width:min(55%,230px);
  }

  .planning-button-art{
    display:block;
    width:100%;
    height:auto;
    border-radius:999px;
  }

  .mobile-contact{
    padding:10px 14px 22px;
    background:linear-gradient(100deg,#e5fafc,#fff8ef);
  }

  .footer-title-art{
    display:block;
    width:min(92%,400px);
    height:auto;
    margin:0 auto 10px;
  }

  .mobile-contact-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:9px;
  }

  .mobile-contact-grid a{
    display:flex;
    min-height:96px;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:10px 6px;
    border-radius:12px;
    background:rgba(255,255,255,.72);
    color:#082f63;
    text-decoration:none;
    border:1px solid #d4ecef;
  }

  .contact-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    margin-bottom:5px;
    border-radius:50%;
    background:#ff1680;
    color:#fff;
    font-size:18px;
    font-weight:900;
  }

  .mobile-contact-grid small{
    font-size:10px;
    line-height:1.25;
  }

  .mobile-contact-grid strong{
    margin-top:2px;
    font-size:11px;
    line-height:1.25;
    overflow-wrap:anywhere;
  }

  .mobile-utility-links{
    display:flex;
    justify-content:center;
    gap:18px;
    padding-top:15px;
  }

  .mobile-utility-links a{
    color:#082f63;
    font-size:11px;
    font-weight:800;
    text-decoration:underline;
    text-decoration-color:#ff1680;
    text-underline-offset:3px;
  }

  .mobile-page{
    display:none !important;
  }
}
