:root{
  --cream:#F2EDE4;
  --charcoal:#3E332A;
  --taupe:#6B5847;
  --sea:#3E332A;
  --sand:#c7a77b;
  --sand-mist:#E5DCCE;
  --warm-ivory:#F7F3EA;
  --line:#DCD2C4;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --max:1180px;
}

html{scroll-padding-top:86px}
body{
  background:var(--cream);
  color:var(--charcoal);
  font-family:var(--sans);
  font-size:17px;
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.step .num,.quote p,.lede{
  font-family:var(--serif);
  color:var(--charcoal);
  font-weight:500;
  letter-spacing:-.028em;
}
h1{font-size:clamp(3rem,5.7vw,5.25rem);line-height:.96}
h2{font-size:clamp(2.35rem,4vw,3.7rem);line-height:1}
h3{font-size:1.55rem;line-height:1.08}
p{color:#554839}
a{color:var(--sea)}
.wrap{max-width:var(--max)}
.label,.eyebrow{
  color:var(--taupe);
  font-family:var(--sans);
  font-size:11px;
  font-weight:500;
  letter-spacing:.18em;
}
.btn,.btn-light,.card-link,.nav-links{
  font-family:var(--sans)!important;
}
.btn{
  background:var(--sea);
  border-color:var(--sea);
  color:var(--warm-ivory);
  border-radius:0;
}
.btn.ghost{background:transparent;color:var(--sea)}
.btn.ghost:hover{background:var(--sand-mist)}

header{
  background:rgba(247,243,236,.94);
  border-color:var(--line);
  backdrop-filter:blur(8px);
}
.nav{max-width:var(--max);padding-top:17px;padding-bottom:17px}
.brand-wordmark{
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  color:var(--charcoal);
  text-decoration:none;
  line-height:1;
  flex:0 0 auto;
}
.brand-wordmark:hover{text-decoration:none}
.brand-wordmark span{
  font-family:"Allura","Snell Roundhand","Segoe Script","Apple Chancery",cursive;
  font-size:36px;
  font-weight:400;
  letter-spacing:0;
}
.brand-wordmark small{
  margin-top:2px;
  padding-left:3px;
  color:var(--taupe);
  font-family:var(--sans);
  font-size:8px;
  font-weight:500;
  letter-spacing:.27em;
  text-transform:uppercase;
}
.nav-links{font-size:11px;letter-spacing:.15em}
.nav-links a{color:var(--charcoal)}
.nav-links .btn{color:var(--warm-ivory)}

section{padding-top:76px;padding-bottom:76px}
.section-head{margin-bottom:42px}
.section-head p{color:var(--taupe)}
.section-head .label:after{background:var(--line);width:54px}

.card,.panel,.quote,.form-shell,.pay-note{
  border-radius:0;
}
.card{background:var(--sand-mist)}
.card p,.step p,.straight p,.credit,.sub,.fine,.alt{color:var(--taupe)}
.card-link,.about .role{color:var(--sea)}
.deals{background:var(--sea);color:var(--warm-ivory)}
.deals h2{color:var(--warm-ivory)}
.deals .btn-light{background:var(--warm-ivory);color:var(--sea);border-radius:0}
.pay-note{border-top:1px solid var(--line);background:var(--warm-ivory)}
.about{background:var(--sand-mist)}

footer{background:var(--charcoal);color:var(--cream)}
.footer-wordmark{align-items:center;color:var(--cream);width:max-content;margin:0 auto}
.footer-wordmark span{font-size:38px}
.footer-wordmark small{color:#bdb4aa}
footer .id{font-family:var(--sans)!important}
footer .foot-links{font-family:var(--sans)!important}
footer .fine,footer .cred{font-family:var(--sans)!important}
footer a{color:#d8c9ad}

/* Homepage: personal editorial introduction */
.home-page .hero{
  padding:62px 0 76px;
  text-align:left;
  background:var(--cream);
  overflow:visible;
}
.home-page .hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(380px,.82fr);
  gap:78px;
  align-items:center;
}
.home-page .hero-copy{padding:22px 0}
.home-page .hero h1{max-width:10.5ch;margin:0 0 26px}
.home-page .hero .rule{margin:0 0 25px;background:var(--line);height:1px}
.home-page .hero p.sub{
  max-width:570px;
  margin:0 0 28px;
  color:#49413b;
  font-size:18px;
  line-height:1.62;
}
.home-page .hero .cta-row{justify-content:flex-start}
.home-page .tagline{justify-content:flex-start;margin-top:30px}
.home-page .tagline span{font-family:var(--sans);color:var(--taupe);font-size:10px;letter-spacing:.2em}
.home-page .tagline i{background:var(--line)}
.hero-visual{position:relative;padding:0 0 48px 54px}
.hero-kaylie{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center 38%;
}
.hero-family-detail{
  position:absolute;
  left:0;
  bottom:0;
  width:46%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center 44%;
  border:12px solid var(--cream);
}
.hero-note{
  position:absolute;
  right:-22px;
  bottom:24px;
  width:220px;
  padding:18px 22px;
  background:var(--warm-ivory);
  color:var(--charcoal);
  font-family:var(--serif);
  font-size:19px;
  line-height:1.3;
}

/* Homepage: lighter editorial service grid */
.home-page #trips{border-top:1px solid var(--line)}
.home-page #trips .section-head{text-align:left;max-width:none;margin:0 0 40px}
.home-page #trips .section-head h2{max-width:12ch}
.home-page #trips .section-head p:last-child{max-width:590px}
.home-page #trips .section-head .label:after{margin-left:0}
.home-page .cards{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.home-page .card{
  min-height:240px;
  padding:32px 32px 28px;
  background:transparent;
  border:0;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  box-shadow:none;
}
.home-page .card:nth-child(3n){border-right:0}
.home-page .card:nth-child(n+4){border-bottom:0}
.home-page .card:hover{transform:none;border-top-color:transparent;box-shadow:none;background:var(--warm-ivory)}
.home-page .card p{font-size:15px;line-height:1.6}
.home-page .card-link{color:var(--sea)}
.home-page #how{background:var(--sand-mist)!important}
.home-page .step{padding-right:28px}
.home-page .step .num{color:var(--sea)}
.home-page .about .inner{grid-template-columns:.78fr 1.22fr;gap:74px}
.home-page .about-photo{border-radius:0;aspect-ratio:4/5;object-position:center 35%}
.home-page .gallery-grid{gap:12px}
.home-page .gallery-grid img{border-radius:0!important}
.home-page .form-shell{border-color:var(--line);background:var(--sand-mist)}

@media(max-width:900px){
  .home-page .hero-grid{grid-template-columns:1fr 1fr;gap:40px}
  .home-page .hero h1{font-size:clamp(3rem,7vw,4.4rem)}
  .home-page .card{padding-left:22px;padding-right:22px}
}

@media(max-width:760px){
  html{scroll-padding-top:70px}
  body{font-size:16px}
  .brand-wordmark span{font-size:31px}
  .brand-wordmark small{font-size:7px}
  .nav-links{background:rgba(247,243,236,.98)!important;border-color:var(--line)!important}
  .home-page .hero{padding:36px 0 58px}
  .home-page .hero-grid{grid-template-columns:1fr;gap:42px}
  .home-page .hero-copy{padding:0}
  .home-page .hero h1{font-size:clamp(3rem,13vw,4.2rem);max-width:10ch}
  .home-page .hero p.sub{font-size:16px}
  .hero-visual{max-width:520px;margin:0 auto;padding-left:34px;padding-bottom:38px}
  .hero-family-detail{border-width:8px;width:43%}
  .hero-note{right:-4px;bottom:16px;width:190px;font-size:16px;padding:15px 17px}
  .home-page .cards{grid-template-columns:1fr}
  .home-page .card,.home-page .card:nth-child(3n),.home-page .card:nth-child(n+4){min-height:0;border-right:0;border-bottom:1px solid var(--line)}
  .home-page .card:last-child{border-bottom:0}
  .home-page .about .inner{grid-template-columns:1fr;gap:38px}
}

@media(max-width:420px){
  .hero-note{position:relative;right:auto;bottom:auto;margin:-20px 0 0 18%;width:82%}
}

/* Laptop-scale refinement */
@media(min-width:901px){
  section{padding-top:56px;padding-bottom:56px}
  h2{font-size:clamp(2.25rem,3.15vw,3.25rem)}
  .section-head{margin-bottom:30px}

  .home-page .hero{padding:42px 0 58px}
  .home-page .hero-grid{
    grid-template-columns:minmax(0,1.04fr) minmax(380px,.76fr);
    gap:56px;
  }
  .home-page .hero-copy{padding:8px 0}
  .home-page .hero h1{
    max-width:12.25ch;
    margin-bottom:22px;
    font-size:clamp(3.25rem,4vw,4.25rem);
    line-height:.98;
  }
  .home-page .hero p.sub{margin-bottom:24px;font-size:17px}
  .home-page .tagline{margin-top:24px}
  .hero-visual{width:100%;max-width:520px;justify-self:end;padding-left:44px;padding-bottom:42px}
  .hero-note{right:-10px;bottom:20px;width:205px;padding:15px 18px;font-size:17px}
  .hero-family-detail{width:43%;border-width:10px}

  .home-page #trips .section-head{margin-bottom:28px}
  .home-page #trips .section-head h2{max-width:14ch}
  .home-page .card{min-height:190px;padding:25px 27px 23px}
  .home-page .card p{margin-bottom:12px}

  .deals{padding-top:58px;padding-bottom:58px}
  .deals h2{margin-bottom:18px}
  .home-page #how .section-head{margin-bottom:26px}
  .home-page .steps{gap:28px}
  .home-page .pay-note{margin-top:34px;padding:23px 28px}
  .home-page .pay-note p{font-size:16px;line-height:1.58}

  .home-page .about .inner{grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);gap:58px}
  .home-page .about-photo{max-height:650px;object-position:center 44%}
  .home-page .about p{margin-top:14px;margin-bottom:14px}

  .home-page #moments .section-head{margin-bottom:30px}
  .home-page #moments .section-head p:last-child{max-width:680px;margin-left:auto;margin-right:auto}
  .home-page .gallery-grid{gap:10px}

  .home-page .plan .section-head{margin-bottom:28px}
  .home-page .form-ph{min-height:245px;gap:12px;padding:28px 24px}
  .home-page .form-ph p{max-width:760px;margin:0 auto}
  .home-page .form-shell{max-width:1050px;margin-left:auto;margin-right:auto}
  .home-page .plan .alt{margin-top:22px}
}


/* side gutters: .wrap capped at 1180 with no padding leaves content
   jammed against the edges between roughly 1180 and 1250 viewport */
.wrap{width:min(var(--max),100%);max-width:none;margin-inline:auto;
  padding-inline:clamp(22px,5vw,72px)}


/* ---- hero visual: single portrait, credentials as a caption ----
   The stacked portrait + balcony inset + floating card put a dim phone
   snapshot across the middle of a professional headshot and pushed the
   card past the photo edge. One image, one caption instead. */
.home-page .hero-family-detail{display:none !important}
.home-page .hero-visual{
  position:relative;
  width:100%;
  max-width:470px;
  margin:0;
  padding:0 !important;
  justify-self:end;
}
.home-page .hero-kaylie{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center 32%;
}
.home-page .hero-note{
  position:static !important;
  width:auto !important;
  margin:18px 0 0;
  padding:16px 0 0 !important;
  border-top:1px solid var(--sand);
  background:none !important;
  color:var(--taupe);
  font-family:var(--sans) !important;
  font-size:11px !important;
  font-weight:400;
  line-height:2.1 !important;
  letter-spacing:.19em;
  text-transform:uppercase;
}
@media (max-width:900px){
  .home-page .hero-visual{max-width:100%;justify-self:stretch}
  .home-page .hero-note{font-size:10px !important;letter-spacing:.16em;line-height:2 !important}
}


/* ---- header wordmark: match the footer lockup ----
   Header and footer had identical gap and tracking; the header only
   looked tighter because the sub-label was left-aligned under the K
   while the footer centres it under the script. */
header .brand-wordmark{align-items:center !important}
header .brand-wordmark small{
  padding-left:0 !important;
  margin-top:4px !important;
}

/* Keep both language versions aligned with the light editorial homepage. */
.home-page .hero .label{color:var(--taupe)}
.home-page .hero h1{color:var(--charcoal);text-shadow:none}

/* The French homepage retains legacy full-bleed hero rules in its inline
   stylesheet. Reset only those layout properties so its editorial hero
   follows the same centered spacing as the English homepage. */
html[lang="fr"] .home-page .hero{
  display:block;
  min-height:0;
}
html[lang="fr"] .home-page .hero .wrap{width:min(var(--max),100%)}

/* Compact the homepage planning prompt without changing its content. */
.home-page .form-shell{max-width:820px;min-height:0}
.home-page .form-ph{min-height:0;padding:40px 28px}
@media(max-width:760px){
  .home-page .form-ph{padding:34px 22px}
}