:root{
  --bg:#02080d;
  --panel:#07121c;
  --panel2:#0b1722;
  --gold:#d89b16;
  --gold2:#f3b52c;
  --white:#f7f5ef;
  --muted:#b8c1c9;
  --line:#283847;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--white);
  font-family:Arial,Helvetica,sans-serif;line-height:1.55
}
a{color:inherit}
a:focus-visible{
  outline:3px solid var(--gold2);outline-offset:3px
}
.visually-hidden{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0
}

/* Exact approved visual master */
.approved-wrap{
  position:relative;
  width:100%;
  max-width:1920px;
  margin:0 auto;
  background:#000;
}
.approved-wrap img{
  display:block;
  width:100%;
  height:auto;
}
.approved-wrap picture,
.mobile-hero picture{display:block}
.mobile-home{display:none}
.hotspot{
  position:absolute;
  display:block;
  z-index:50;
  border-radius:4px;
  outline:0;
  cursor:pointer;
  pointer-events:auto;
  background:transparent;
}
.hotspot:focus-visible{
  box-shadow:0 0 0 3px var(--gold2);
  background:rgba(243,181,44,.10)
}

/* Header/nav hotspots */
.hs-home{left:53.5%;top:1.7%;width:4.2%;height:4.4%}
.hs-about{left:59.0%;top:1.7%;width:4.8%;height:4.4%}
.hs-episodes{left:64.7%;top:1.7%;width:6.1%;height:4.4%}
.hs-dest{left:71.4%;top:1.7%;width:8.6%;height:4.4%}
.hs-gallery{left:81.3%;top:1.7%;width:6.2%;height:4.4%}
.hs-contact{left:89.0%;top:1.7%;width:7.1%;height:4.4%}

/* CTA hotspots */
.hs-watch{left:2.5%;top:53.5%;width:22%;height:9%}
.hs-about-cta{left:13.5%;top:91.5%;width:18%;height:7%}
.hs-italy-cta{left:49.5%;top:90.5%;width:19%;height:8%}

/* Fallback / lower content pages */
.sub-header{
  position:sticky;top:0;z-index:10;
  background:rgba(2,8,13,.94);border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(20px,5vw,70px);backdrop-filter:blur(10px)
}
.wordmark{
  font-weight:900;letter-spacing:.08em;font-size:28px;text-decoration:none
}
.wordmark span{color:var(--gold2)}
.sub-nav{display:flex;gap:26px;flex-wrap:wrap}
.sub-nav a{text-decoration:none;text-transform:uppercase;font-size:13px;font-weight:800}
.sub-nav a:hover{color:var(--gold2)}
.page{
  max-width:1100px;margin:0 auto;padding:70px 28px 100px
}
.eyebrow{color:var(--gold2);text-transform:uppercase;letter-spacing:.12em;font-weight:800}
h1{font-size:clamp(44px,7vw,86px);line-height:.95;margin:.15em 0 .35em}
h2{font-size:clamp(28px,4vw,48px)}
.lead{font-size:clamp(19px,2.2vw,27px);color:var(--muted);max-width:850px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}
.card{
  border:1px solid var(--line);background:linear-gradient(145deg,#0b1e2e,#061019);
  padding:28px;min-height:180px;border-radius:8px
}
.card h3,
.card h2{font-size:1.17em;margin-top:0;margin-bottom:1em;color:var(--gold2)}
.button,
.status-label{
  display:inline-block;margin-top:18px;padding:13px 20px;
  border:1px solid var(--gold2);text-decoration:none;font-weight:800;text-transform:uppercase
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .desktop-home-nav a{transition:none}
}
.button.primary{background:var(--gold2);color:#111}
.footer{
  border-top:1px solid var(--line);padding:30px;text-align:center;color:#8d99a3
}
.footer a{color:inherit;text-decoration:underline;text-underline-offset:.18em}

@media(max-width:850px){
  .sub-header{align-items:flex-start;gap:15px;flex-direction:column}
  .sub-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
  .sub-nav a{
    min-height:48px;display:flex;align-items:center;justify-content:center;
    border:1px solid var(--line);border-radius:4px;padding:0 10px
  }
  .sub-nav a[aria-current="page"]{color:var(--gold2);border-color:var(--gold2)}
  .cards{grid-template-columns:1fr}

  /* Mobile homepage: a readable HTML layout separate from the approved desktop artwork. */
  .approved-wrap{display:none}
  .mobile-home{display:block;background:#02080d;overflow:hidden}
  .mobile-home-header{
    padding:20px 18px 18px;border-bottom:1px solid var(--line);background:#02080d
  }
  .mobile-brand{
    display:inline-flex;flex-direction:column;text-decoration:none;margin-bottom:18px
  }
  .mobile-brand-name{
    color:var(--white);font-size:clamp(30px,10vw,42px);font-weight:900;line-height:1;
    letter-spacing:.035em
  }
  .mobile-brand-name strong{color:var(--gold2)}
  .mobile-brand-tagline{
    color:var(--gold2);font-size:12px;font-weight:800;letter-spacing:.28em;margin-top:7px
  }
  .mobile-home-nav{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px
  }
  .mobile-home-nav a{
    min-height:48px;display:flex;align-items:center;justify-content:center;
    border:1px solid var(--line);border-radius:4px;text-decoration:none;
    font-size:13px;font-weight:800;letter-spacing:.035em
  }
  .mobile-home-nav a[aria-current="page"]{
    color:var(--gold2);border-color:var(--gold2)
  }
  .mobile-hero{
    display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    background:#000;border-bottom:1px solid var(--line);min-height:430px
  }
  .mobile-hero-copy{
    grid-column:1;grid-row:1;padding:30px 12px 28px 20px;
    position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center
  }
  .mobile-hero picture{grid-column:2;grid-row:1;height:100%}
  .mobile-hero h1{
    font-size:clamp(43px,12vw,68px);line-height:.86;letter-spacing:-.045em;
    margin:0;color:#fff
  }
  .mobile-script{
    color:var(--gold2);font-family:Georgia,"Times New Roman",serif;font-style:italic;
    font-size:clamp(27px,7.5vw,42px);line-height:1;margin:14px 0 20px
  }
  .mobile-hero-summary{
    font-size:clamp(10px,2.8vw,13px);font-weight:800;line-height:1.5;margin:0 0 20px
  }
  .mobile-hero-actions{display:flex;flex-direction:column;align-items:stretch;gap:14px}
  .mobile-hero .mobile-cta{width:100%;padding-left:8px;padding-right:8px;font-size:12px}
  .mobile-get-out{
    color:var(--gold2);font-family:Georgia,"Times New Roman",serif;font-style:italic;
    font-size:clamp(22px,6.5vw,32px)
  }
  .mobile-hero img{
    display:block;width:100%;height:100%;min-height:430px;
    object-fit:cover;object-position:52% 24%
  }
  .mobile-cta{
    min-height:48px;display:inline-flex;align-items:center;justify-content:center;
    padding:12px 20px;border:1px solid var(--gold2);border-radius:4px;
    text-decoration:none;font-size:14px;font-weight:900;text-align:center
  }
  .mobile-cta.primary{background:var(--gold2);color:#111}
  .mobile-cta.secondary{color:var(--white)}
  .mobile-pillars{
    display:grid;grid-template-columns:1fr;gap:0;background:#03080c;
    border-bottom:1px solid var(--line);padding:8px 20px
  }
  .mobile-pillars div{
    min-height:66px;display:flex;flex-direction:column;justify-content:center;
    border-bottom:1px solid var(--line);padding:10px 0
  }
  .mobile-pillars div:last-child{border-bottom:0}
  .mobile-pillars strong{color:var(--gold2);font-size:14px}
  .mobile-pillars span{color:var(--muted);font-size:14px}
  .mobile-story,
  .mobile-expedition{padding:42px 20px 48px}
  .mobile-story{background:linear-gradient(145deg,#07121c,#02080d)}
  .mobile-expedition{
    background:linear-gradient(145deg,#111923,#050a0f);border-top:1px solid var(--line)
  }
  .mobile-eyebrow{
    color:var(--gold2);font-size:13px;font-weight:900;letter-spacing:.1em;margin:0 0 8px
  }
  .mobile-story h2,
  .mobile-expedition h2{
    color:#fff;font-size:clamp(38px,12vw,54px);line-height:.95;margin:0 0 20px
  }
  .mobile-story p:not(.mobile-eyebrow),
  .mobile-expedition p:not(.mobile-eyebrow){color:var(--muted);font-size:16px}
  .mobile-story strong{color:var(--gold2)}
  .mobile-story .mobile-cta,
  .mobile-expedition .mobile-cta{margin-top:14px;width:100%}
  .mobile-expedition h3{color:var(--gold2);font-size:16px;margin:0 0 18px}
}






/* Pixel-aligned desktop homepage navigation.
   The approved artwork supplies the normal menu; exact gold overlays supply hover states. */
.desktop-home-nav{
  display:none;
}

@media (min-width:851px){
  /* Disable the invisible homepage menu hotspots on desktop only. */
  .mobile-home-hotspot{
    display:none !important;
  }

  .desktop-home-nav{
    position:absolute;
    z-index:80;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:block;
    pointer-events:none;
    background:transparent;
  }

  .desktop-home-nav a{
    position:absolute;
    display:block;
    pointer-events:auto;
    overflow:hidden;
    color:transparent;
    text-decoration:none;
    white-space:nowrap;
    text-indent:-9999px;
    background:transparent;
  }

  .desktop-home-nav a:nth-child(1){left:54.006515%;top:2.343750%;width:4.429967%;height:2.832031%}
  .desktop-home-nav a:nth-child(2){left:59.674267%;top:2.343750%;width:4.039088%;height:2.832031%}
  .desktop-home-nav a:nth-child(3){left:65.667752%;top:2.343750%;width:6.123779%;height:2.832031%}
  .desktop-home-nav a:nth-child(4){left:73.550489%;top:2.343750%;width:8.794788%;height:2.832031%}
  .desktop-home-nav a:nth-child(5){left:84.104235%;top:2.343750%;width:5.472313%;height:2.832031%}
  .desktop-home-nav a:nth-child(6){left:91.661238%;top:2.343750%;width:5.798046%;height:2.832031%}

  .desktop-home-nav a:focus-visible{
    outline:2px solid rgba(243,181,44,.9);
    outline-offset:2px;
    box-shadow:none;
  }
}

@media (min-width:851px) and (hover:hover) and (pointer:fine){
  .desktop-home-nav a:nth-child(2):hover{
    background:url("assets/nav-about-gold.png") left top/100% 100% no-repeat;
  }
  .desktop-home-nav a:nth-child(3):hover{
    background:url("assets/nav-episodes-gold.png") left top/100% 100% no-repeat;
  }
  .desktop-home-nav a:nth-child(4):hover{
    background:url("assets/nav-destinations-gold.png") left top/100% 100% no-repeat;
  }
  .desktop-home-nav a:nth-child(5):hover{
    background:url("assets/nav-gallery-gold.png") left top/100% 100% no-repeat;
  }
  .desktop-home-nav a:nth-child(6):hover{
    background:url("assets/nav-contact-gold.png") left top/100% 100% no-repeat;
  }
  .desktop-home-nav a:nth-child(1):hover{
    background:transparent;
    box-shadow:none;
  }
}