/* ============================================================
   made by lana — editorial / cinematic / soft
   ============================================================ */

:root{
  --ivory:#F8F5F0;
  --beige:#EDE5DD;
  --rose:#DCC9C4;
  --charcoal:#2D2A28;
  --white:#FFFFFF;

  --font-display:"Cormorant Garamond", "Times New Roman", Georgia, serif;
  --font-body:"DM Sans", "Helvetica Neue", Arial, sans-serif;

  --maxw:1360px;
  --gutter:32px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ivory);
  color:var(--charcoal);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter);}
@media (max-width:700px){:root{--gutter:20px;}}

h1,h2,h3{
  font-family:var(--font-display);
  font-weight:400;
  line-height:1.08;
  margin:0;
  text-wrap:balance;
}
h1{font-size:clamp(2.6rem,6.4vw,5.6rem); font-style:italic;}
h2{font-size:clamp(2rem,4.4vw,3.4rem);}
h2.italic{font-style:italic;}
h3{font-size:clamp(1.3rem,2.2vw,1.7rem); font-weight:500;}

.kicker{
  font-family:var(--font-body);
  text-transform:uppercase;
  letter-spacing:3.5px;
  font-size:.7rem;
  color:var(--charcoal);
  opacity:.6;
  margin-bottom:22px;
  display:block;
}
.num{font-family:var(--font-body); font-size:.75rem; letter-spacing:1px; opacity:.55;}

p{margin:0; color:var(--charcoal); opacity:.82;}
.lede{font-size:clamp(1.05rem,1.6vw,1.3rem); line-height:1.7; max-width:620px;}

.cta{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-body);
  font-size:.85rem; letter-spacing:.5px;
  color:var(--charcoal);
  border-bottom:1px solid currentColor;
  padding-bottom:3px;
  transition:opacity .3s var(--ease), gap .3s var(--ease);
}
.cta:hover{opacity:.6; gap:16px;}
.cta.on-dark{color:var(--white);}

.btn{
  display:inline-block;
  padding:15px 34px;
  border:1px solid var(--charcoal);
  border-radius:2px;
  font-size:.8rem;
  letter-spacing:1.2px;
  text-transform:uppercase;
  transition:background .3s var(--ease), color .3s var(--ease);
}
.btn:hover{background:var(--charcoal); color:var(--ivory);}
.btn.on-dark{border-color:var(--white); color:var(--white);}
.btn.on-dark:hover{background:var(--white); color:var(--charcoal);}

section{padding:min(14vw,160px) 0;}
section.tight{padding:min(8vw,90px) 0;}
.bg-beige{background:var(--beige);}
.bg-charcoal{background:var(--charcoal); color:var(--ivory);}
.bg-charcoal p{color:var(--ivory); opacity:.75;}
.bg-charcoal .kicker{color:var(--ivory); opacity:.55;}

/* reveal-on-scroll */
.reveal{opacity:0; transform:translateY(28px); transition:opacity 1s var(--ease), transform 1s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1; transform:none; transition:none;}
}

/* ---------- Header ---------- */
header.site-header{
  padding:22px 0;
  mix-blend-mode:normal;
  transition:background .4s var(--ease), padding .4s var(--ease);
}
header.site-header.scrolled{
  background:rgba(248,245,240,.9);
  backdrop-filter:blur(8px);
  padding:14px 0;
  border-bottom:1px solid rgba(45,42,40,.08);
}
.nav{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter);
}
.logo{
  font-family:var(--font-display); font-style:italic;
  font-size:1.3rem; letter-spacing:.3px;
  filter:drop-shadow(0 1px 3px rgba(255,255,255,.85)) drop-shadow(0 0 12px rgba(255,255,255,.5));
}
.nav-links{
  display:flex; gap:40px; align-items:center;
  list-style:none; margin:0; padding:0;
  font-size:.8rem; letter-spacing:1px; text-transform:uppercase;
}
.nav-links a{opacity:.85; transition:opacity .25s, color .25s;}
.nav-links a:hover{opacity:1;}
.lang-links{display:flex; gap:6px; font-size:.75rem; letter-spacing:1px;}
.lang-links a{opacity:.5;}
.lang-links a.active{opacity:1; text-decoration:underline; text-underline-offset:3px;}
.nav-toggle{display:none; background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--charcoal);}

/* header sitting on a photo (not scrolled yet): scrim + light text so it stays legible */
header.site-header{position:fixed; top:0; left:0; right:0; z-index:100;}
header.site-header::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(0,0,0,.4) 0%, rgba(0,0,0,0) 100%);
  opacity:1; transition:opacity .4s var(--ease);
}
header.site-header.scrolled::before{opacity:0;}
header.site-header:not(.scrolled) .nav-links a,
header.site-header:not(.scrolled) .nav-toggle{color:var(--white);}
header.site-header:not(.scrolled) .lang-links a{opacity:.7;}
header.site-header:not(.scrolled) .lang-links a.active{opacity:1;}

@media (max-width:860px){
  .nav-links{
    position:fixed; inset:0 0 0 auto; width:78vw; max-width:360px;
    background:var(--ivory);
    flex-direction:column; align-items:flex-start; justify-content:center;
    padding:40px; gap:26px; font-size:1rem;
    transform:translateX(100%); transition:transform .4s var(--ease);
  }
  .nav-links.open{transform:translateX(0);}
  .nav-toggle{display:block;}
}

/* ---------- Hero (full photo; text on the left over a soft gradient that blends into it) ---------- */
.hero{
  min-height:96vh; position:relative;
  display:flex; align-items:center;
  background-size:cover; background-position:62% 30%;
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(20,18,16,.62) 0%, rgba(20,18,16,.34) 26%, rgba(20,18,16,0) 56%);
}
.hero video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.hero-inner{
  position:relative; z-index:1; width:100%;
  max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter);
}
.hero h1{color:var(--white); max-width:520px; text-shadow:0 2px 20px rgba(0,0,0,.35);}
.hero .sub{color:var(--white); opacity:.92; max-width:420px; margin-top:22px; font-size:1.05rem;}
.hero-ctas{display:flex; gap:32px; margin-top:36px; flex-wrap:wrap; align-items:center;}
@media (max-width:700px){
  .hero{align-items:flex-end;}
  .hero-inner{padding-bottom:60px;}
  .hero::after{background:linear-gradient(180deg, rgba(20,18,16,.1) 0%, rgba(20,18,16,.68) 100%);}
  .hero h1, .hero .sub{max-width:100%;}
}

/* ---------- Intro ---------- */
.intro-block .lede{max-width:none;}

/* ---------- Selected stories ---------- */
.stories-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}
@media (max-width:700px){.stories-grid{grid-template-columns:1fr;}}
.story-card{position:relative; overflow:hidden; aspect-ratio:3/4.3; display:block;}
.story-card img{width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease), filter .8s var(--ease);}
.story-card:hover img{transform:scale(1.09); filter:brightness(1.04);}
.story-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(45,42,40,0) 40%, rgba(45,42,40,.55) 100%);
  transition:background .5s var(--ease);
}
.story-card:hover::after{
  background:linear-gradient(180deg, rgba(45,42,40,0) 30%, rgba(45,42,40,.62) 100%);
}
.story-card-text{position:absolute; left:26px; right:26px; bottom:26px; z-index:1; color:var(--white); transition:transform .5s var(--ease);}
.story-card:hover .story-card-text{transform:translateY(-4px);}
.story-card-text h3{color:var(--white); font-style:italic; margin-bottom:10px;}
.story-card .cta{opacity:0; transform:translateY(8px); transition:opacity .4s var(--ease), transform .4s var(--ease);}
.story-card:hover .cta{opacity:1; transform:translateY(0);}

/* ---------- Feature (Love story / Cinematic / Portraits / Fashion) ---------- */
.feature{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;}
.feature.reverse .feature-media{order:2;}
.feature.reverse .feature-text{order:1;}
@media (max-width:860px){
  .feature{grid-template-columns:1fr; gap:32px;}
  .feature.reverse .feature-media{order:1;}
  .feature.reverse .feature-text{order:2;}
}
.feature-media{overflow:hidden;}
.feature-media img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .8s var(--ease), filter .8s var(--ease);}
.feature-media.wide img{aspect-ratio:16/10;}
.feature-media:hover img{transform:scale(1.06); filter:brightness(1.03);}
.feature-text .lede{margin:22px 0 30px;}

/* asymmetric offset for Fashion */
.feature.offset .feature-media{transform:translateY(-6%);}
@media (max-width:860px){.feature.offset .feature-media{transform:none;}}

/* triple image rows (Portraits / Fashion detail) */
.trio{display:grid; grid-template-columns:1.1fr .9fr 1fr; gap:18px; margin-top:56px;}
.trio img{width:100%; height:100%; object-fit:cover;}
.trio > *:nth-child(2){margin-top:64px;}
@media (max-width:820px){
  .trio{grid-template-columns:1fr 1fr; gap:12px;}
  .trio > *:nth-child(2){margin-top:0;}
  .trio > *:nth-child(3){grid-column:1/-1;}
}

/* wider gallery grid — Portraits / Love Stories */
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:56px;}
.gallery-grid img{width:100%; aspect-ratio:4/5; object-fit:cover;}
@media (max-width:820px){.gallery-grid{grid-template-columns:1fr 1fr; gap:10px;}}
@media (max-width:480px){.gallery-grid{grid-template-columns:1fr;}}

/* Portraits: single carousel row, 3 photos visible, arrow-driven */
.carousel-wrap{position:relative; margin-top:56px;}
.gallery-carousel{
  display:flex; gap:16px;
  overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.gallery-carousel::-webkit-scrollbar{display:none;}
.carousel-item{
  flex:0 0 calc((100% - 32px)/3); width:calc((100% - 32px)/3);
  aspect-ratio:4/5; overflow:hidden; scroll-snap-align:start;
}
.carousel-item img{width:100%; height:100%; object-fit:cover; display:block;}
@media (max-width:820px){.carousel-item{flex-basis:calc((100% - 10px)/2); width:calc((100% - 10px)/2);}}
@media (max-width:480px){.carousel-item{flex-basis:100%; width:100%;}}

.carousel-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border-radius:50%;
  background:var(--white); border:1px solid rgba(45,42,40,.12);
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; line-height:1; cursor:pointer; color:var(--charcoal); padding:0;
  box-shadow:0 6px 20px rgba(45,42,40,.16);
  transition:opacity .25s var(--ease), background .25s var(--ease);
  z-index:2;
}
.carousel-arrow:hover{background:var(--ivory);}
.carousel-arrow.prev{left:10px;}
.carousel-arrow.next{right:10px;}
.carousel-arrow:disabled{opacity:0; pointer-events:none;}
@media (max-width:700px){.carousel-arrow{width:36px; height:36px; font-size:1.05rem;}}

/* ---------- Vimeo component ---------- */
.vimeo-embed{position:relative; width:100%; background:var(--charcoal); overflow:hidden;}
.vimeo-embed[data-ratio="16:9"]{aspect-ratio:16/9;}
.vimeo-embed[data-ratio="9:16"]{aspect-ratio:9/16; max-width:480px; margin:0 auto;}
.vimeo-embed iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.vimeo-embed .poster{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .5s ease;}
.vimeo-embed.is-playing .poster{opacity:0; pointer-events:none;}
.vimeo-embed .vimeo-play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(45,42,40,.12); border:none; cursor:pointer; z-index:2;
}
.vimeo-embed.is-playing .vimeo-play{display:none;}
.vimeo-embed .vimeo-play span{
  width:64px; height:64px; border-radius:50%; border:1px solid var(--white);
  display:flex; align-items:center; justify-content:center; color:var(--white); font-size:.9rem;
  backdrop-filter:blur(2px);
}

/* ---------- Photo + Film ---------- */
.pf-list{list-style:none; margin:30px 0 0; padding:0; display:grid; gap:14px; max-width:520px;}
.pf-list li{padding-left:22px; position:relative; opacity:.85;}
.pf-list li::before{content:"—"; position:absolute; left:0; opacity:.5;}

/* ---------- About ---------- */
.about-grid{display:grid; grid-template-columns:.8fr 1.2fr; gap:64px; align-items:center;}
@media (max-width:820px){.about-grid{grid-template-columns:1fr; gap:32px;}}
.about-grid img{width:100%; aspect-ratio:4/5; object-fit:cover;}
.about-text p{margin-bottom:1.1em;}

/* ---------- Experience ---------- */
.exp-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:36px; margin-top:56px;}
@media (max-width:820px){.exp-grid{grid-template-columns:1fr 1fr; gap:32px;}}
@media (max-width:520px){.exp-grid{grid-template-columns:1fr;}}
.exp-step .num{display:block; margin-bottom:16px;}
.exp-step h3{margin-bottom:10px;}

/* ---------- Investment ---------- */
.invest-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(45,42,40,.14); margin-top:56px;}
@media (max-width:900px){.invest-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.invest-grid{grid-template-columns:1fr;}}
.invest-col{background:var(--ivory); padding:38px 30px;}
.invest-col h3{margin-bottom:6px;}
.invest-price{font-family:var(--font-display); font-style:italic; font-size:1.5rem; margin:6px 0 22px;}
.invest-col ul{list-style:none; padding:0; margin:0; display:grid; gap:9px; font-size:.86rem; opacity:.8;}
.invest-note{max-width:640px; margin:56px auto 0; text-align:center; font-size:.85rem; opacity:.65;}
.addon-list{list-style:none; padding:0; margin:26px 0 0; display:grid; gap:8px; max-width:520px; font-size:.9rem; opacity:.75;}

/* ---------- Services ---------- */
.services-list{margin-top:56px; border-top:1px solid rgba(45,42,40,.15);}
.service-row{
  display:grid; grid-template-columns:1.3fr 2fr .8fr; gap:30px; align-items:baseline;
  padding:30px 0; border-bottom:1px solid rgba(45,42,40,.15);
}
@media (max-width:760px){.service-row{grid-template-columns:1fr; gap:8px;}}
.service-row h3{font-style:italic;}
.service-row .price{font-size:.85rem; letter-spacing:.5px; text-align:right;}
@media (max-width:760px){.service-row .price{text-align:left; opacity:.6;}}

/* ---------- Instagram ---------- */
.insta-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:44px;}
@media (max-width:700px){.insta-grid{grid-template-columns:repeat(3,1fr); gap:3px;}}
.insta-grid a{position:relative; display:block; aspect-ratio:1/1; overflow:hidden;}
.insta-grid img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease), opacity .3s;}
.insta-grid a:hover img{transform:scale(1.06); opacity:.9;}

/* ---------- Contact ---------- */
.contact-head{max-width:760px;}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; margin-top:56px;}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr; gap:36px;}}
form{display:grid; gap:24px;}
.form-row{display:grid; gap:8px; border-bottom:1px solid rgba(45,42,40,.22); padding-bottom:10px;}
.form-row label{font-size:.72rem; letter-spacing:1.2px; text-transform:uppercase; opacity:.6;}
.form-row input, .form-row select, .form-row textarea{
  font-family:var(--font-body); font-size:1.02rem; padding:6px 0;
  border:none; background:transparent; color:var(--charcoal);
}
.form-row textarea{resize:vertical; min-height:80px;}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{outline:none;}
.form-note{font-size:.78rem; opacity:.6;}

/* ---------- Footer ---------- */
footer{background:var(--charcoal); color:var(--ivory); padding:70px 0 34px;}
.footer-top{display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px; padding-bottom:46px; border-bottom:1px solid rgba(248,245,240,.15);}
.footer-logo{font-family:var(--font-display); font-style:italic; font-size:1.8rem;}
.footer-tag{opacity:.6; font-size:.85rem; margin-top:10px;}
.footer-links{display:flex; gap:22px; align-items:center; flex-wrap:wrap;}
.footer-links a{opacity:.7; display:flex; align-items:center;}
.footer-links a:hover{opacity:1;}
.footer-links svg{width:20px; height:20px;}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:26px; font-size:.78rem; opacity:.55; flex-wrap:wrap; gap:14px;}

.preview-banner{background:var(--rose); color:var(--charcoal); text-align:center; font-size:.78rem; padding:9px 16px;}

/* ---------- Rates table ---------- */
.rates-table{width:100%; border-collapse:collapse; margin-top:56px; font-size:.92rem;}
.rates-table th, .rates-table td{padding:16px 18px; text-align:center; border-bottom:1px solid rgba(45,42,40,.15); white-space:nowrap;}
.rates-table th{font-family:var(--font-body); font-size:.72rem; letter-spacing:1px; text-transform:uppercase; opacity:.6; font-weight:500;}
.rates-table td:first-child, .rates-table th:first-child{text-align:left; opacity:.8; white-space:normal;}
.rates-table tr:last-child td{font-family:var(--font-display); font-style:italic; font-size:1.4rem; border-bottom:none; padding-top:22px;}
.rates-table tr:last-child td:first-child{font-family:var(--font-body); font-style:normal; font-size:.92rem; opacity:.8;}
@media (max-width:700px){.rates-table{font-size:.82rem;} .rates-table th,.rates-table td{padding:10px 10px;}}
