*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

[id]{
scroll-margin-top:110px;
}

body{
background:#fbfaf7;
color:#111;
font-family:Inter,sans-serif;
overflow-x:hidden;
}

::selection{
background:#111;
color:#fff;
}

.visually-hidden{
position:absolute;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0;
}

nav{
position:fixed;
top:0;
left:0;
width:100%;
padding:35px 70px;
display:flex;
justify-content:space-between;
align-items:center;
z-index:100;
background:transparent;
transition:padding .5s ease,background .35s ease,box-shadow .35s ease;
}

nav.nav-dark{
background:#111;
box-shadow:0 1px 0 rgba(255,255,255,.08);
}

nav.scrolled{
padding:22px 70px;
}

.logo{
display:block;
width:92px;
height:auto;
transition:width .5s ease;
}

nav.scrolled .logo{
width:78px;
}

.logo::after{
display:none;
}

.logo img{
width:100%;
height:auto;
display:block;
filter:brightness(0) invert(1);
}

nav ul{
display:flex;
gap:40px;
list-style:none;
}

nav a{
position:relative;
text-decoration:none;
color:#fff;
font-size:14px;
letter-spacing:2px;
text-transform:uppercase;
}

nav a::after{
content:"";
position:absolute;
left:0;
bottom:-6px;
width:0;
height:1px;
background:#fff;
transition:width .4s ease;
}

nav a:hover::after{
width:100%;
}

.nav-item{
opacity:0;
transform:translateY(-14px);
animation:navDrop .9s cubic-bezier(.22,1,.36,1) forwards;
}

.nav-item.logo{animation-delay:.2s;}
nav li:nth-child(1) .nav-item{animation-delay:.4s;}
nav li:nth-child(2) .nav-item{animation-delay:.5s;}
nav li:nth-child(3) .nav-item{animation-delay:.6s;}
nav li:nth-child(4) .nav-item{animation-delay:.7s;}
nav li:nth-child(5) .nav-item{animation-delay:.8s;}
nav li:nth-child(6) .nav-item{animation-delay:.9s;}

@keyframes navDrop{
to{opacity:1;transform:translateY(0);}
}

.hero{
height:100vh;
display:flex;
align-items:center;
justify-content:center;
position:relative;
overflow:hidden;
}

.hero-bg{
position:absolute;
inset:-2%;
width:104%;
height:104%;
object-fit:cover;
object-position:center;
transform:scale(1.15);
animation:heroZoom 2.4s cubic-bezier(.22,1,.36,1) forwards;
will-change:transform;
}

@keyframes heroZoom{
to{transform:scale(1.04);}
}

.hero::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.38));
z-index:1;
}

.hero-content{
position:relative;
z-index:2;
text-align:center;
color:white;
transform:translateY(-190px);
}

.hero-logo{
width:min(360px,72vw);
height:auto;
display:block;
margin:90px auto 0;
filter:brightness(0) invert(1) drop-shadow(0 10px 28px rgba(0,0,0,.28));
opacity:0;
transform:translateY(30px);
animation:riseIn 1.2s cubic-bezier(.22,1,.36,1) .5s forwards;
}

.hero p{
margin-top:18px;
font-size:15px;
letter-spacing:5px;
text-transform:uppercase;
opacity:0;
transform:translateY(20px);
animation:riseIn 1.2s cubic-bezier(.22,1,.36,1) .8s forwards;
}

.hero .intro{
max-width:620px;
margin:30px auto 0;
font-size:18px;
line-height:1.8;
letter-spacing:0;
text-transform:none;
}

.hero-book-btn{
display:inline-block;
margin-top:38px;
padding:16px 38px;
background:#fff;
color:#111;
border:none;
font-family:Inter,sans-serif;
font-size:13px;
font-weight:500;
letter-spacing:2px;
text-transform:uppercase;
border-radius:0;
cursor:pointer;
opacity:0;
transform:translateY(20px);
animation:riseIn 1.2s cubic-bezier(.22,1,.36,1) 1.1s forwards;
transition:background .3s ease,color .3s ease;
}

.hero-book-btn:hover{
background:#d8d4ca;
}

@keyframes riseIn{
to{opacity:1;transform:translateY(0);}
}

.scroll{
position:absolute;
bottom:40px;
left:50%;
transform:translateX(-50%);
z-index:2;
font-size:12px;
letter-spacing:3px;
color:white;
display:flex;
flex-direction:column;
align-items:center;
gap:14px;
opacity:0;
animation:fadeIn 1s ease 1.4s forwards;
}

.scroll .line{
width:1px;
height:50px;
background:rgba(255,255,255,.5);
overflow:hidden;
position:relative;
}

.scroll .line::after{
content:"";
position:absolute;
top:-50%;
left:0;
width:100%;
height:50%;
background:white;
animation:scrollLine 2s cubic-bezier(.76,0,.24,1) infinite;
}

@keyframes scrollLine{
0%{top:-50%;}
100%{top:100%;}
}

@keyframes fadeIn{
to{opacity:1;}
}

.section{
padding:140px 12%;
display:grid;
grid-template-columns:1fr 1fr;
gap:100px;
align-items:center;
}

.section.alt{
background:#f0ece4;
}

.section.reverse .img-wrap{
order:2;
}

.eyebrow{
display:block;
margin-bottom:18px;
font-size:12px;
letter-spacing:4px;
text-transform:uppercase;
color:#999;
}

.img-wrap{
overflow:hidden;
}

.section img{
width:100%;
height:700px;
display:block;
object-fit:cover;
transition:transform 1.2s cubic-bezier(.22,1,.36,1),filter 1.2s ease;
will-change:transform;
}

.img-wrap:hover img{
transform:scale(1.06);
}

.text h2{
font-family:"Cormorant Garamond",serif;
font-size:58px;
font-weight:300;
margin-bottom:30px;
}

.text p{
line-height:2;
font-size:17px;
color:#555;
}

.text ul{
margin-top:34px;
display:grid;
gap:16px;
list-style:none;
}

.editing-contact{
margin-top:30px;
font-size:14px;
line-height:1.8;
color:#777;
}

.editing-contact a{
color:#111;
text-decoration:underline;
text-underline-offset:3px;
}

.text li{
padding-top:16px;
border-top:1px solid rgba(0,0,0,.12);
font-size:13px;
letter-spacing:2px;
text-transform:uppercase;
color:#222;
}

.photography-mark{
width:110px;
height:auto;
margin:34px 0 0;
display:block;
opacity:.82;
}

.about-band{
padding:120px 12%;
background:#f0ece4;
}

.about-inner{
display:grid;
grid-template-columns:.75fr 1fr;
gap:80px;
align-items:center;
max-width:1100px;
margin:0 auto;
}

.about-photo{
width:100%;
aspect-ratio:4/5;
object-fit:cover;
object-position:center;
}

.about-band p + p{
margin-top:18px;
}

.about-band ul{
grid-template-columns:repeat(3,1fr);
}

.portfolio-grid{
padding:130px 8%;
display:grid;
grid-template-columns:1.2fr .8fr 1fr;
gap:18px;
align-items:end;
background:#fbfaf7;
}

.portfolio-item{
overflow:hidden;
position:relative;
min-height:420px;
}

.portfolio-item.tall{
min-height:620px;
}

.portfolio-item img{
width:100%;
height:100%;
position:absolute;
inset:0;
object-fit:cover;
transition:transform 1.2s cubic-bezier(.22,1,.36,1);
}

.portfolio-item:hover img{
transform:scale(1.04);
}

.portfolio-caption{
padding:34px 0 0;
align-self:start;
}

.portfolio-caption h2{
font-family:"Cormorant Garamond",serif;
font-size:54px;
font-weight:300;
margin-bottom:22px;
}

.portfolio-caption p{
max-width:430px;
line-height:1.9;
font-size:16px;
color:#555;
}

.pricing{
padding:130px 12%;
background:#f0ece4;
}

.pricing-intro{
max-width:720px;
margin-bottom:70px;
}

.pricing-intro h2{
font-family:"Cormorant Garamond",serif;
font-size:58px;
font-weight:300;
margin:18px 0 24px;
}

.pricing-intro p{
line-height:1.9;
font-size:17px;
color:#555;
}

.pricing-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:18px;
}

.pricing-card{
background:#fbfaf7;
padding:42px 34px;
display:flex;
flex-direction:column;
justify-content:space-between;
}

.pricing-card .desc{
line-height:1.8;
font-size:14px;
color:#666;
margin-bottom:22px;
}

.pricing-card .note{
line-height:1.8;
font-size:14px;
color:#666;
margin:22px 0;
}

.pricing-card h3{
font-family:"Cormorant Garamond",serif;
font-size:36px;
font-weight:300;
margin-bottom:18px;
}

.price{
font-size:13px;
letter-spacing:3px;
text-transform:uppercase;
color:#777;
margin-bottom:28px;
}

.pricing-card ul{
display:grid;
gap:14px;
list-style:none;
margin-top:28px;
}

.pricing-card li{
padding-top:14px;
border-top:1px solid rgba(0,0,0,.1);
font-size:14px;
line-height:1.6;
color:#444;
}

.pricing-cta{
margin-top:50px;
padding-top:40px;
border-top:1px solid rgba(0,0,0,.12);
text-align:center;
}

.pricing-cta h3{
font-family:"Cormorant Garamond",serif;
font-size:34px;
font-weight:300;
margin-bottom:16px;
}

.pricing-cta p{
max-width:560px;
margin:0 auto;
font-size:16px;
line-height:1.9;
color:#444;
}

.pricing-cta strong{
color:#111;
font-weight:600;
}

.pricing-cta a{
color:#111;
text-decoration:underline;
text-underline-offset:3px;
}

.booking-note{
max-width:560px;
margin:26px auto 34px;
background:#fbfaf7;
border:1px solid rgba(0,0,0,.1);
padding:18px 24px;
font-size:14px;
line-height:1.8;
color:#666;
}

.booking-btn{
display:inline-block;
padding:16px 44px;
background:#111;
color:#fff;
border:none;
font-family:Inter,sans-serif;
font-size:13px;
font-weight:600;
letter-spacing:2px;
text-transform:uppercase;
border-radius:0;
cursor:pointer;
transition:background .3s ease;
}

.booking-btn:hover{
background:#333;
}

.pricing-cta-alt{
margin-top:38px!important;
padding-top:32px;
border-top:1px solid rgba(0,0,0,.1);
font-size:14px!important;
color:#777!important;
}

.cta-button{
display:inline-block;
margin-top:30px;
padding:16px 38px;
background:#111;
color:#fff!important;
font-size:13px;
letter-spacing:2px;
text-transform:uppercase;
text-decoration:none!important;
transition:background .3s ease;
}

.cta-button:hover{
background:#333;
}

.js .reveal{
opacity:0;
transform:translateY(60px);
transition:opacity 1.1s cubic-bezier(.22,1,.36,1),transform 1.1s cubic-bezier(.22,1,.36,1);
}

.js .reveal.from-left{transform:translateX(-70px);}
.js .reveal.from-right{transform:translateX(70px);}

.js .reveal.visible{
opacity:1;
transform:translate(0,0);
}

footer{
padding:90px 12% 40px;
background:#111;
color:#d8d4ca;
}

footer h2{
font-family:"Cormorant Garamond",serif;
font-size:52px;
font-weight:300;
letter-spacing:1px;
text-transform:none;
color:#fff;
margin-bottom:24px;
}

footer p{
margin-top:14px;
line-height:1.8;
letter-spacing:0;
}

footer a{
color:#fff;
text-decoration:none;
text-transform:none;
}

.footer-top{
display:grid;
grid-template-columns:1.2fr repeat(4,1fr);
gap:60px;
align-items:start;
}

.footer-logo{
width:130px;
height:auto;
margin-bottom:28px;
filter:brightness(0) invert(1);
}

.footer-column h3{
font-size:12px;
font-weight:400;
letter-spacing:3px;
text-transform:uppercase;
color:#8f8a80;
margin-bottom:22px;
}

.footer-column ul{
display:grid;
gap:14px;
list-style:none;
}

.footer-column li,
.footer-column a,
.footer-column p{
font-size:14px;
color:#d8d4ca;
}

.footer-column a:hover{
color:#fff;
}

.footer-bottom{
margin-top:70px;
padding-top:24px;
border-top:1px solid rgba(255,255,255,.12);
display:flex;
justify-content:space-between;
gap:24px;
font-size:12px;
letter-spacing:2px;
text-transform:uppercase;
color:#8f8a80;
}

@media(max-width:900px){

nav{
padding:30px;
align-items:flex-start;
gap:20px;
}

nav.scrolled{
padding:20px 30px;
}

nav ul{
gap:12px;
flex-wrap:wrap;
justify-content:flex-end;
}

nav a{
font-size:10px;
letter-spacing:1.2px;
}

.hero-content{
transform:translateY(-110px);
}

.hero-logo{
width:min(280px,76vw);
}

.hero p{
font-size:12px;
letter-spacing:3px;
}

.hero .intro{
max-width:82%;
font-size:15px;
letter-spacing:0;
}

.section{
grid-template-columns:1fr;
gap:60px;
padding:90px 8%;
}

.section.reverse .img-wrap{
order:0;
}

.section img{
height:450px;
}

.photography-mark{
width:90px;
}

.about-band{
padding:90px 8%;
}

.about-inner{
grid-template-columns:1fr;
gap:42px;
}

.about-photo{
max-width:420px;
margin:0 auto;
}

.about-band ul{
grid-template-columns:1fr;
}

.portfolio-grid{
grid-template-columns:1fr;
padding:80px 8%;
}

.portfolio-item,
.portfolio-item.tall{
min-height:430px;
}

.portfolio-caption{
padding:20px 0 30px;
}

.portfolio-caption h2{
font-size:42px;
}

.pricing{
padding:80px 8%;
}

.pricing-intro{
margin-bottom:44px;
}

.pricing-intro h2{
font-size:42px;
}

.pricing-grid{
grid-template-columns:1fr;
}

.footer-top{
grid-template-columns:1fr;
gap:42px;
}

.footer-bottom{
flex-direction:column;
}

.text h2{
font-size:42px;
}

}

@media(prefers-reduced-motion:reduce){
*{animation:none!important;transition:none!important;}
.js .reveal{opacity:1;transform:none;}
.hero-book-btn{opacity:1;transform:none;}
}


/* ---- legal / inner page styles ---- */
.legal-hero{
padding:220px 12% 80px;
background:#f0ece4;
}

.legal-hero .eyebrow{
color:#999;
}

.legal-hero h1{
font-family:"Cormorant Garamond",serif;
font-size:56px;
font-weight:300;
margin:14px 0 18px;
}

.legal-hero .updated{
font-size:13px;
letter-spacing:1px;
color:#777;
}

.legal-body{
padding:90px 12% 140px;
max-width:820px;
}

.legal-body h2{
font-family:"Cormorant Garamond",serif;
font-size:32px;
font-weight:400;
margin:56px 0 18px;
}

.legal-body h2:first-child{
margin-top:0;
}

.legal-body p{
font-size:16px;
line-height:1.9;
color:#444;
margin-bottom:18px;
}

.legal-body ul{
margin:0 0 18px 22px;
}

.legal-body li{
font-size:16px;
line-height:1.9;
color:#444;
margin-bottom:10px;
}

.legal-body a{
color:#111;
text-decoration:underline;
text-underline-offset:3px;
}

.legal-body .note-box{
background:#f0ece4;
padding:26px 30px;
font-size:15px;
line-height:1.8;
color:#555;
margin:34px 0;
}

@media(max-width:900px){

.legal-hero{
padding:170px 8% 60px;
}

.legal-hero h1{
font-size:40px;
}

.legal-body{
padding:60px 8% 90px;
}

.legal-body h2{
font-size:26px;
margin:44px 0 14px;
}

}

/* Solid nav for inner pages without a dark hero behind it */
nav.nav-solid{
background:#111;
mix-blend-mode:normal;
}

/* ---- cookie consent banner ---- */
.cookie-banner{
position:fixed;
right:24px;
bottom:24px;
z-index:200;
background:#111;
color:#d8d4ca;
width:340px;
max-width:calc(100vw - 40px);
padding:26px 26px 24px;
display:flex;
flex-direction:column;
gap:18px;
box-shadow:0 16px 44px rgba(0,0,0,.4);
}

.cookie-banner[hidden]{
display:none;
}

.cookie-banner p{
margin:0;
font-size:13.5px;
line-height:1.7;
color:#d8d4ca;
}

.cookie-banner a{
color:#fff;
text-decoration:underline;
text-underline-offset:3px;
}

.cookie-banner-actions{
display:flex;
gap:10px;
}

.cookie-btn{
flex:1;
padding:12px 18px;
border:none;
font-family:Inter,sans-serif;
font-size:11px;
font-weight:600;
letter-spacing:1.5px;
text-transform:uppercase;
cursor:pointer;
background:#fff;
color:#111;
transition:background .3s ease,color .3s ease;
}

.cookie-btn:hover{
background:#d8d4ca;
}

.cookie-btn-ghost{
background:transparent;
color:#d8d4ca;
border:1px solid rgba(255,255,255,.3);
}

.cookie-btn-ghost:hover{
background:rgba(255,255,255,.08);
color:#fff;
}

@media(max-width:600px){

.cookie-banner{
left:16px;
right:16px;
bottom:16px;
width:auto;
max-width:none;
padding:22px 20px 20px;
}

}

/* ---- 404 page ---- */
.notfound{
position:relative;
overflow:hidden;
min-height:86vh;
display:flex;
align-items:center;
justify-content:center;
padding:200px 8% 100px;
background:#fbfaf7;
}

.notfound-bokeh{
position:absolute;
inset:0;
z-index:0;
pointer-events:none;
}

.notfound-bokeh span{
position:absolute;
border-radius:50%;
filter:blur(48px);
}

.notfound-bokeh .b1{
top:10%;
left:8%;
width:220px;
height:220px;
background:#d8b788;
opacity:.4;
}

.notfound-bokeh .b2{
top:56%;
left:80%;
width:300px;
height:300px;
background:#d9b9b0;
opacity:.32;
filter:blur(60px);
}

.notfound-bokeh .b3{
top:12%;
left:76%;
width:150px;
height:150px;
background:#b9c2ab;
opacity:.3;
}

.notfound-bokeh .b4{
bottom:8%;
left:16%;
width:260px;
height:260px;
background:#e7d9bd;
opacity:.35;
filter:blur(56px);
}

.notfound-bokeh .b5{
top:68%;
left:42%;
width:110px;
height:110px;
background:#cfc9be;
opacity:.3;
}

.notfound-content{
position:relative;
z-index:1;
text-align:center;
max-width:560px;
}

.notfound .eyebrow{
opacity:0;
transform:translateY(20px);
animation:riseIn 1s cubic-bezier(.22,1,.36,1) .1s forwards;
}

.notfound-figure{
margin:14px 0 0;
font-family:"Cormorant Garamond",serif;
font-weight:300;
font-size:clamp(120px,20vw,230px);
line-height:.92;
letter-spacing:-2px;
color:#111;
filter:blur(16px);
opacity:0;
transform:scale(1.06);
animation:notfoundFocus 1.5s cubic-bezier(.22,1,.36,1) .35s forwards;
}

@keyframes notfoundFocus{
0%{filter:blur(20px);opacity:0;transform:scale(1.07);}
55%{opacity:1;}
100%{filter:blur(0);opacity:1;transform:scale(1);}
}

.notfound h1{
font-family:"Cormorant Garamond",serif;
font-size:36px;
font-weight:300;
margin:6px 0 18px;
opacity:0;
transform:translateY(20px);
animation:riseIn 1s cubic-bezier(.22,1,.36,1) .9s forwards;
}

.notfound-copy{
font-size:16px;
line-height:1.9;
color:#555;
margin:0 auto 38px;
max-width:420px;
opacity:0;
transform:translateY(20px);
animation:riseIn 1s cubic-bezier(.22,1,.36,1) 1.1s forwards;
}

.notfound-links{
display:flex;
align-items:center;
gap:28px;
flex-wrap:wrap;
justify-content:center;
opacity:0;
transform:translateY(20px);
animation:riseIn 1s cubic-bezier(.22,1,.36,1) 1.3s forwards;
}

.notfound-link{
font-size:13px;
letter-spacing:1.5px;
text-transform:uppercase;
color:#111;
text-decoration:underline;
text-underline-offset:4px;
}

.notfound-link:hover{
color:#555;
}

@media(max-width:900px){

.notfound{
padding:150px 8% 90px;
min-height:auto;
}

.notfound h1{
font-size:26px;
}

.notfound-links{
gap:18px;
}

.notfound-bokeh span{
transform:scale(.7);
}

}

@media(prefers-reduced-motion:reduce){

.notfound .eyebrow,
.notfound h1,
.notfound-copy,
.notfound-links{
opacity:1!important;
transform:none!important;
}

.notfound-figure{
opacity:1!important;
filter:none!important;
transform:none!important;
}

}