@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#10100f; --paper:#f6f3ee; --line:rgba(16,16,15,.16); --orange:#ff5b2e; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
h1,h2,h3 { font-family:"Barlow Condensed",Arial,sans-serif; font-weight:600; }
.nav { position:absolute; z-index:3; inset:0 0 auto; display:flex; justify-content:space-between; align-items:center; padding:26px 4vw; color:#fff; mix-blend-mode:normal; }
.brand { font-weight:800; line-height:.95; letter-spacing:-.055em; font-size:1.38rem; }
.nav-links { display:flex; gap:1.55rem; font:500 .82rem/1 "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.nav-links a:hover,.nav-links a:focus { text-decoration:underline; text-underline-offset:5px; }
.menu { display:none; }
.hero { min-height:100svh; color:#fff; position:relative; isolation:isolate; overflow:hidden; background:#10100f; }
.hero video { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; background:#161615; }
.shade { position:absolute; z-index:1; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.28),transparent 52%); }
.hero-content { position:relative; z-index:2; width:40%; min-width:28rem; min-height:100svh; padding:2rem 3vw; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2rem; background:rgba(0,0,0,.4); text-align:center; }
.hero-logo { display:flex; flex-direction:column; align-items:center; color:#fff; font:700 clamp(5rem,8.1vw,8.7rem)/.76 "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:-.035em; }
.hero-logo span { display:block; }
.hero-categories { display:flex; flex-direction:column; gap:.78rem; align-items:center; font:500 1.18rem/1 "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.hero-categories a { border-bottom:1px solid rgba(255,255,255,.42); padding-bottom:.27rem; transition:border-color .2s,color .2s; }
.hero-categories a:hover,.hero-categories a:focus { color:#ff5b2e; border-color:#ff5b2e; }
.eyebrow,.kicker { font:500 .8rem/1 "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.09em; }
h1 { font-size:clamp(3.7rem,10.8vw,10.8rem); max-width:10ch; letter-spacing:-.09em; line-height:.8; margin:.6rem 0 0; }
.hero-side { max-width:16rem; margin-bottom:.35rem; font-size:.9rem; line-height:1.45; }
.scroll { position:absolute; z-index:2; left:0; width:40%; min-width:28rem; bottom:1.4rem; text-align:center; font:500 .78rem "Barlow Condensed",Arial,sans-serif; letter-spacing:.1em; text-transform:uppercase; }
main { overflow:hidden; }
.intro { padding:5vw 4vw; display:grid; grid-template-columns:1fr 2fr; gap:4vw; align-items:start; }
.intro h2,.section-head h2,.page-title h1 { font-size:clamp(2.2rem,4.8vw,5.5rem); letter-spacing:-.045em; line-height:.91; margin:0; }
.intro p { max-width:40rem; font-size:clamp(1.25rem,2.05vw,2rem); line-height:1.25; letter-spacing:-.04em; margin:0; }
.works { padding:0 4vw 8vw; }
.section-head { display:flex; justify-content:space-between; gap:2rem; padding:0 0 2rem; border-bottom:1px solid var(--line); }
.section-head h2 { font-size:clamp(2rem,4.4vw,4.5rem); }
.section-head p { max-width:17rem; font-size:.87rem; line-height:1.45; }
.work-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:1.2vw; margin-top:1.2vw; }
.work { position:relative; overflow:hidden; min-height:22vw; background:#222; }
.work:nth-child(1) { grid-column:span 7; min-height:39vw; }
.work:nth-child(2) { grid-column:span 5; min-height:39vw; }
.work:nth-child(3),.work:nth-child(4),.work:nth-child(5) { grid-column:span 4; }
.work img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform .7s ease; }
.work:hover img { transform:scale(1.035); }
.work-label { position:absolute; inset:auto 1rem 1rem; color:white; font:500 .8rem "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.09em; text-shadow:0 1px 8px rgba(0,0,0,.55); }
.services { padding:7vw 4vw 9vw; background:#181817; color:#f6f3ee; }
.services-head { max-width:42rem; margin-bottom:4rem; }
.services h2 { font-size:clamp(2.6rem,6vw,6rem); line-height:.9; letter-spacing:-.05em; margin:.7rem 0 0; }
.service { display:grid; grid-template-columns:.18fr 1fr auto; gap:1.5rem; align-items:baseline; padding:1.4rem 0; border-top:1px solid rgba(255,255,255,.22); }
.service:last-child { border-bottom:1px solid rgba(255,255,255,.22); }
.service h3 { font-size:clamp(1.45rem,2.4vw,2.55rem); letter-spacing:-.04em; margin:0; }
.service p { font-size:.9rem; line-height:1.45; margin:0; }
.arrow { font-size:1.7rem; }
.contact { padding:9vw 4vw 3vw; }
.contact h2 { font-size:clamp(3.2rem,8vw,8.7rem); line-height:.84; letter-spacing:-.05em; max-width:13ch; margin:.7rem 0 2rem; }
.button { display:inline-flex; padding:.95rem 1.2rem; border:1px solid var(--ink); font:500 .82rem "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.1em; transition:.2s; }
.button:hover { background:var(--ink); color:var(--paper); }
footer { display:flex; justify-content:space-between; gap:2rem; padding:2.2rem 4vw; border-top:1px solid var(--line); font:500 .8rem "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.09em; }

.page-hero { min-height:58svh; color:#fff; position:relative; display:flex; align-items:end; padding:9rem 4vw 3rem; background-size:cover; background-position:center; isolation:isolate; }
.page-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(0,0,0,.68),rgba(0,0,0,.1)); }
.page-hero h1 { max-width:12ch; font-size:clamp(3.5rem,9vw,9rem); }
.page-hero p { max-width:31rem; margin:1.3rem 0 0; line-height:1.45; }
.page-body { padding:8vw 4vw; max-width:105rem; }
.page-copy { max-width:44rem; font-size:clamp(1.15rem,1.8vw,1.7rem); line-height:1.38; letter-spacing:-.035em; }
.page-image { width:100%; height:min(52vw,44rem); object-fit:cover; margin:3rem 0 0; }
.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:3.5rem; }
.price { border:1px solid var(--line); padding:1.5rem; min-height:20rem; display:flex; flex-direction:column; }
.price .price-name { font:500 .8rem "Barlow Condensed",Arial,sans-serif; text-transform:uppercase; letter-spacing:.09em; }
.price strong { font-size:clamp(2rem,3.5vw,3.5rem); letter-spacing:-.07em; margin:1.2rem 0; }
.price p { font-size:.9rem; line-height:1.5; margin:0; }
.price .button { margin-top:auto; align-self:flex-start; }
.note { margin-top:1.2rem; font-size:.8rem; line-height:1.5; max-width:50rem; }
.wedding-gallery { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:1.2vw; margin-top:2.25rem; }
.wedding-gallery figure { margin:0; min-height:20vw; overflow:hidden; background:#dedbd4; }
.wedding-gallery figure:nth-child(1) { grid-column:span 7; grid-row:span 2; min-height:42vw; }
.wedding-gallery figure:nth-child(2),.wedding-gallery figure:nth-child(3) { grid-column:span 5; }
.wedding-gallery figure:nth-child(n+4) { grid-column:span 4; }
.wedding-gallery img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.wedding-gallery figure:hover img { transform:scale(1.025); }

@media (max-width:720px) {
 .nav { padding:20px 5vw; align-items:flex-start; } .nav-links { position:absolute; top:72px; left:5vw; right:5vw; display:flex; justify-content:space-between; gap:.45rem; font-size:.56rem; } .menu { display:none; }
 .hero { min-height:100svh; } .hero video,.shade { position:absolute; inset:0; } .hero-content { width:100%; min-width:0; min-height:42svh; position:absolute; inset:auto 0 0; padding:2rem 5vw; justify-content:center; } .hero-logo { font-size:clamp(4.1rem,20vw,6.2rem); } .hero-categories { flex-direction:row; flex-wrap:wrap; gap:.65rem 1rem; font-size:1rem; }
 .scroll { left:0; width:100%; min-width:0; bottom:calc(42svh + 1.4rem); } .intro { padding:20vw 5vw; grid-template-columns:1fr; gap:2rem; }
 .works,.services,.contact,.page-body { padding-left:5vw; padding-right:5vw; } .section-head { display:block; } .section-head p { margin:1.2rem 0 0; }
 .work-grid { grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; } .work,.work:nth-child(n) { grid-column:span 1; min-height:54vw; } .work:first-child { grid-column:span 2; min-height:76vw; }
 .service { grid-template-columns:2rem 1fr auto; gap:.75rem; } .service p { grid-column:2 / -1; padding-bottom:.4rem; } .service .arrow { grid-column:3; grid-row:1; }
 footer { display:block; line-height:2; padding-left:5vw; padding-right:5vw; } .page-hero { padding-left:5vw; padding-right:5vw; min-height:63svh; }
 .price-grid { grid-template-columns:1fr; } .price { min-height:17rem; }
 .wedding-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:1.5rem; } .wedding-gallery figure,.wedding-gallery figure:nth-child(n) { grid-column:span 1; grid-row:auto; min-height:56vw; } .wedding-gallery figure:first-child { grid-column:span 2; min-height:100vw; }
}
