:root{
  --blue:#17324D; --blue2:#0F2438; --gold:#B87333; --gold2:#D9A35F;
  --sand:#F4EBDD; --cream:#FDFBF8; --ink:#3B2314; --muted:#756B64; --line:#E7DCCF; --white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Montserrat,Arial,sans-serif;line-height:1.6}
a{color:inherit}
.site-nav{position:sticky;top:0;z-index:50;background:rgba(253,251,248,.97);border-bottom:1px solid var(--line);padding:12px 4%;display:flex;align-items:center;gap:24px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap}
.logo img{width:42px;height:42px;object-fit:contain}
.logo b{font-size:11px;letter-spacing:1.8px}
.nav-links{display:flex;align-items:center;gap:17px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.nav-links a{font-size:10px;letter-spacing:1px;text-transform:uppercase;text-decoration:none;font-weight:600}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}
.story-btn{background:var(--blue);color:white!important;padding:10px 15px;border-radius:22px}
.banner{background:var(--blue);color:var(--sand);text-align:center;padding:9px 15px;font-size:10px;letter-spacing:2px}
.container{max-width:1160px;margin:auto;padding:70px 5%}
.hero{min-height:72vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:90px 5%;background:radial-gradient(circle at 50% 25%,#FFF0DD 0,#FDFBF8 60%)}
.hero h1,.section-title{font-family:"Cormorant Garamond",Georgia,serif;font-weight:300;line-height:1.08}
.hero h1{font-size:clamp(3rem,7vw,5.7rem);margin:10px 0}
.hero h1 span,.accent{color:var(--gold)}
.hero p{max-width:690px;margin:20px auto;color:var(--muted);font-size:15px}
.kicker{text-transform:uppercase;letter-spacing:3px;font-size:10px;color:var(--gold);font-weight:600}
.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-block;padding:13px 21px;border-radius:28px;text-decoration:none;text-transform:uppercase;letter-spacing:1.2px;font-size:10px;font-weight:700}
.btn.primary{background:var(--blue);color:white}
.btn.secondary{border:1px solid var(--blue);color:var(--blue)}
.btn.gold{background:var(--gold);color:white}
.intro{text-align:center;max-width:760px;margin:0 auto 35px}
.intro h1{font-size:clamp(2.5rem,5vw,4.2rem);margin:0 0 14px}
.intro p{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.card{background:white;border:1px solid var(--line);border-radius:15px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:.2s}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(23,50,77,.09)}
.card img{width:100%;height:220px;object-fit:cover}
.card-body{padding:20px}
.card h2,.card h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;margin:0 0 7px;font-size:1.7rem}
.card p{color:var(--muted);font-size:13px;margin:0 0 15px}
.card .read{color:var(--gold);font-size:10px;letter-spacing:1.2px;font-weight:700;text-transform:uppercase}
.route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.route{padding:28px;background:var(--blue);color:white;border-radius:14px;text-decoration:none}
.route:nth-child(2){background:var(--sand);color:var(--ink)}
.route:nth-child(3){background:var(--gold);color:white}
.route strong{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-size:1.8rem;font-weight:500;margin-bottom:7px}
.route span{font-size:11px;opacity:.82}
.feature{display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center}
.feature img{width:100%;height:390px;object-fit:cover;border-radius:16px}
.feature h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:3rem;font-weight:300;line-height:1.05;margin:8px 0 15px}
.feature p{color:var(--muted)}
.callout{background:var(--sand);border-radius:18px;padding:42px;text-align:center}
.callout h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:2.6rem;font-weight:300;margin:0 0 10px}
.story{max-width:820px;margin:auto}
.story h1{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(2.8rem,6vw,5rem);font-weight:300;line-height:1.05}
.story .meta{color:var(--gold);font-size:10px;text-transform:uppercase;letter-spacing:2px}
.story p{font-family:Georgia,serif;font-size:18px;line-height:1.85}
.story img{width:100%;max-height:560px;object-fit:cover;border-radius:15px;margin:25px 0}
.form{max-width:760px;margin:30px auto 0;background:white;border:1px solid var(--line);border-radius:16px;padding:30px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
label{font-size:11px;letter-spacing:.8px;text-transform:uppercase;font-weight:600}
input,select,textarea{font:inherit;border:1px solid var(--line);border-radius:8px;padding:12px;background:#fff}
textarea{min-height:150px;resize:vertical}
.check{font-size:11px;color:var(--muted);display:flex;gap:8px;align-items:flex-start}
.check input{margin-top:3px}
.footer{background:var(--blue2);color:var(--sand);padding:50px 5%;text-align:center}
.footer h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;margin:0 0 10px;font-size:1.7rem}
.footer p{font-size:11px;opacity:.75}
.footer-links{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin:20px 0}
.footer-links a{font-size:10px;text-decoration:none;text-transform:uppercase;letter-spacing:1px}
.small-note{font-size:11px;color:var(--muted);margin-top:15px}
@media(max-width:900px){
 .site-nav{align-items:flex-start}.nav-links{gap:10px}
 .grid,.route-grid{grid-template-columns:1fr 1fr}.feature{grid-template-columns:1fr}
}
@media(max-width:620px){
 .site-nav{position:relative;flex-direction:column}.nav-links{margin-left:0;justify-content:flex-start}
 .grid,.grid.two,.route-grid,.form-grid{grid-template-columns:1fr}
 .hero{min-height:65vh}.feature img{height:280px}.container{padding:50px 5%}
 .form{padding:20px}
}

.more-menu{position:relative;display:inline-flex;align-items:center}
.more-menu>a{cursor:pointer}
.more-menu .dropdown{display:none;position:absolute;top:100%;right:0;min-width:180px;background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:8px;box-shadow:0 12px 30px rgba(23,50,77,.12);z-index:70}
.more-menu:hover .dropdown,.more-menu:focus-within .dropdown{display:block}
.more-menu .dropdown a{display:block;padding:9px 10px;border-radius:7px;white-space:nowrap}
.more-menu .dropdown a:hover{background:var(--sand)}
.profile-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.profile{background:white;border:1px solid var(--line);border-radius:14px;padding:24px}
.profile h3{font-family:"Cormorant Garamond",Georgia,serif;font-size:1.8rem;font-weight:500;margin:0 0 6px}
.profile .role{color:var(--gold);font-size:10px;letter-spacing:1px;text-transform:uppercase;font-weight:700}
.profile p{font-size:13px;color:var(--muted)}
@media(max-width:620px){.profile-grid{grid-template-columns:1fr}.more-menu .dropdown{right:auto;left:0}}

.social-links{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  margin-top:20px;
}

.social-links a{
  color:#D4AF37;
  font-size:30px;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:color .3s ease, transform .3s ease;
}

.social-links a:hover{
  color:#ffffff;
  transform:translateY(-2px);
}
.community-callout{margin:3rem 0;padding:2rem;border:1px solid rgba(0,0,0,.12);border-radius:18px}
.community-callout .button{display:inline-block;margin-top:.5rem}

/* October 8 homepage: mountain-and-sea hero image replaces the old cloud banner. */
.homepage-banner{width:100%;background:var(--cream);line-height:0}
.homepage-banner img{display:block;width:100%;height:auto;object-fit:contain}
.homepage-intro{text-align:center;padding:28px 5% 46px;max-width:920px;margin:0 auto}
.homepage-intro p{font-size:15px;color:var(--muted);line-height:1.7;max-width:700px;margin:0 auto}
@media(max-width:620px){.homepage-intro{padding:24px 5% 36px}}
/* Cellar Collection: photo beside video */
.cellar-feature {
  display: grid;
  grid-template-columns: 0.75fr 1.5fr;
  gap: 24px;
  align-items: center;
  margin: 30px 0 24px;
}

.cellar-photo {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 4 / 5;
  background: #0F2438;
}

.cellar-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.cellar-photo:hover img {
  transform: scale(1.04);
}

.cellar-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 2px solid #C9A86A;
  border-radius: 50%;
  background: rgba(15, 36, 56, 0.85);
  color: white;
  font-size: 23px;
}

.cellar-video {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 12px;
  background: #0F2438;
}

.cellar-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.cellar-description {
  margin: 24px 0 50px;
}

/* Stack photo and video on mobile */
@media (max-width: 700px) {
  .cellar-feature {
    grid-template-columns: 1fr;
  }

  .cellar-photo {
    aspect-ratio: 16 / 9;
  }
}

/* MENTORS: profile cards */

.profile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.profile {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
}

.profile-photo {
  display: block;
  width: 100%;
  height: 320px;
  object-fit: contain;
  object-position: center top;
  border-radius: 8px;
  margin-bottom: 18px;
  background: #F4EBDD;
}

.profile .role {
  font-size: 11px;
  line-height: 1.7;
  color: var(--gold);
  margin-bottom: 10px;
}

.profile h3 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 26px;
  color: var(--blue);
  margin: 0 0 12px;
}

.profile p {
  font-size: 13px;
  line-height: 1.8;
}

.profile-linkedin {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  color: var(--gold);
  text-decoration: none;
  font-size: 12px;
  font-weight: 600;
  transition: color 0.3s ease;
}

.profile-linkedin i {
  font-size: 22px;
}

.profile-linkedin:hover {
  color: var(--blue);
}

@media (max-width: 900px) {
  .profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .profile-grid {
    grid-template-columns: 1fr;
  }
}
/* Collections dropdown */
.collections-menu {
  position: relative;
  display: inline-block;
}

.collections-menu summary {
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}

.collections-menu summary::-webkit-details-marker {
  display: none;
}

.collections-menu summary {
font-family: inherit;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: inherit;
line-height: inherit;
color: inherit;
padding: 0;
cursor: pointer;
list-style: none;
}

.collections-menu summary::-webkit-details-marker {
display: none;
}

.collections-menu[open] .dropdown {
  display: flex;
  flex-direction: column;
}

.collections-menu .dropdown a {
  display: block;
  padding: 10px 16px;
  color: var(--white);
  text-decoration: none;
  white-space: nowrap;
}

.collections-menu .dropdown a:hover {
  background: var(--gold);
  color: var(--white);
}
/* Make Collections match the other navigation links */
.collections-menu summary {
font-family: inherit;
font-size: inherit;
  font-size: 10px;
  
font-weight: inherit;
line-height: inherit;
color: inherit;
padding: 0;
}

.site-nav a {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}
.mentor-card img {
  width: 100%;
  max-width: 260px;
  height: 300px;
  object-fit: cover;
  object-position: center top;
  border-radius: 8px;
}

.video-wrapper {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 14px;
}

.video-wrapper iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Dreamcatcher destination video */
.video-wrapper {
  width: 100%;
  max-width: 680px;
  margin: 20px auto 30px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 12px;
}

.video-wrapper iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* FIX: Dreamcatcher Collections navigation dropdown */
.site-nav {
  position: sticky;
  top: 0;
  z-index: 1000;
  overflow: visible;
}

.nav-links {
  overflow: visible;
}

.collections-menu {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
}

.collections-menu summary {
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--blue);
  padding: 0;
}

.collections-menu summary::-webkit-details-marker {
  display: none;
}

.collections-menu .dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  right: auto;
  min-width: 220px;
  padding: 8px;
  background: var(--blue2);
  border: 1px solid var(--gold);
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
  z-index: 1100;
}

.collections-menu[open] .dropdown {
  display: flex;
  flex-direction: column;
}

.collections-menu .dropdown a {
  display: block;
  padding: 11px 13px;
  color: var(--sand);
  font-size: 10px;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 6px;
}

.collections-menu .dropdown a:hover {
  background: var(--gold);
  color: var(--white);
}

/* Keep the dropdown usable on small screens */
@media (max-width: 620px) {
  .site-nav {
    overflow: visible;
  }

  .nav-links {
    overflow: visible;
    width: 100%;
  }

  .collections-menu .dropdown {
    left: 0;
    right: auto;
  }
}
/* Magazine archive: show complete covers */
body:has(a.card[href*="fliphtml5.com"]) .grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

a.card[href*="fliphtml5.com"] > img {
  display: block;
  width: 100%;
  height: 340px;
  object-fit: contain;
  object-position: center;
  background: #f5f1e9;
}

a.card[href*="fliphtml5.com"] .card-body {
  height: auto;
}

@media (max-width: 600px) {
  a.card[href*="fliphtml5.com"] > img {
    height: 290px;
  }
}

.grid .card img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: cover;
}

/* About Us — smaller team profile photos */
.profile-photo {
  display: block;
  width: 150px;
  height: 180px;
  max-width: 100%;
  object-fit: cover;
  object-position: center top;
  border-radius: 4px;
  margin: 0 auto 20px;
}

.profile {
  min-width: 0;
}

.profile p {
  line-height: 1.8;
}


/* About Us — wide, horizontal team profiles */
.profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  align-items: stretch;
}

.profile {
  display: grid;
  grid-template-columns: 125px minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  column-gap: 20px;
  align-content: start;
  min-width: 0;
  padding: 24px;
  background: #FDFBF8;
  border: 1px solid rgba(184, 115, 51, 0.22);
  border-radius: 6px;
  box-sizing: border-box;
}

.profile .profile-photo {
  grid-column: 1;
  grid-row: 1 / span 3;
  width: 125px;
  height: 155px;
  object-fit: cover;
  object-position: center top;
  margin: 0;
}

.profile h3 {
  grid-column: 2;
  margin: 0 0 6px;
}

.profile .role {
  grid-column: 2;
  margin-bottom: 12px;
}

.profile p {
  grid-column: 2;
  margin: 0;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

/* Stack the profiles on smaller screens */
@media (max-width: 850px) {
  .profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .profile {
    grid-template-columns: 95px minmax(0, 1fr);
    column-gap: 14px;
    padding: 16px;
  }

  .profile .profile-photo {
    width: 95px;
    height: 120px;
  }
}

/* About Us — wide, horizontal team profiles */
.profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  align-items: stretch;
}

.profile {
  display: grid;
  grid-template-columns: 125px minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  column-gap: 20px;
  align-content: start;
  min-width: 0;
  padding: 24px;
  background: #FDFBF8;
  border: 1px solid rgba(184, 115, 51, 0.22);
  border-radius: 6px;
  box-sizing: border-box;
}

.profile .profile-photo {
  grid-column: 1;
  grid-row: 1 / span 3;
  width: 125px;
  height: 155px;
  object-fit: cover;
  object-position: center top;
  margin: 0;
}

.profile h3 {
  grid-column: 2;
  margin: 0 0 6px;
}

.profile .role {
  grid-column: 2;
  margin-bottom: 12px;
}

.profile p {
  grid-column: 2;
  margin: 0;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

/* Stack the profiles on smaller screens */
@media (max-width: 850px) {
  .profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .profile {
    grid-template-columns: 95px minmax(0, 1fr);
    column-gap: 14px;
    padding: 16px;
  }

  .profile .profile-photo {
    width: 95px;
    height: 120px;
  }
}