:root{--ink:#151414;--cream:#f4eee7;--white:#fffdfb;--pink:#f7dfe3;--blush:#edc9ce;--grey:#e8e8e6;--muted:#6e6865;--line:rgba(21,20,20,.16)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:"DM Sans",sans-serif;font-size:17px;line-height:1.6;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.nav{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid var(--line);background:rgba(255,253,251,.9);backdrop-filter:blur(14px);position:relative;z-index:20}
.wordmark{font-family:"Italiana",serif;font-size:1.45rem}
.nav nav{display:flex;align-items:center;gap:2.2rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.1em}
.nav-cta{border-bottom:1px solid}
.hero{min-height:calc(100vh - 88px);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:6vw 5vw 7vw;background:linear-gradient(135deg,var(--white) 0 58%,#f8f2ee 58%)}
.kicker,.section-label{text-transform:uppercase;letter-spacing:.19em;font-size:.68rem;font-weight:600;margin:0 0 1.7rem}
.hero h1,.intro-section h2,.section-title-row h2,.results h2,.about h2,.contact h2{font-family:"Italiana",serif;font-weight:400;letter-spacing:-.035em;line-height:.98;margin:0}
.hero h1{font-size:clamp(3.7rem,6.5vw,7.4rem)}
em{font-weight:400;color:#b67f88}
.hero-intro{max-width:600px;color:var(--muted);font-size:1.05rem;margin:2rem 0}
.hero-actions{display:flex;align-items:center;gap:2rem}
.button{display:inline-flex;justify-content:space-between;align-items:center;gap:2.7rem;background:var(--pink);border:1px solid var(--ink);padding:.95rem 1.15rem;text-transform:uppercase;letter-spacing:.09em;font-size:.72rem;transition:.25s}
.button:hover{transform:translateY(-3px);box-shadow:6px 6px 0 var(--ink)}
.quiet-link{font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid}
.hero-images{position:relative;height:650px}
.soft-orb{position:absolute;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fff 0,#f7dfe3 42%,#eee6e1 72%,transparent 73%);right:-12%;top:2%}
.portrait{position:absolute;margin:0;overflow:hidden}
.portrait img{width:100%;height:100%;object-fit:cover}
.portrait-main{width:390px;height:540px;right:8%;top:2%;border-radius:48% 48% 8px 8px}
.portrait-small{width:205px;height:275px;left:2%;bottom:1%;border:10px solid var(--white);transform:rotate(-5deg)}
.note{position:absolute;right:0;bottom:3%;font-family:"Italiana";font-size:1.1rem;transform:rotate(-4deg)}
.social-proof{position:absolute;left:0;top:12%;background:rgba(255,253,251,.92);padding:1rem 1.4rem;display:flex;flex-direction:column;box-shadow:0 15px 50px rgba(70,45,45,.12)}
.social-proof strong{font-family:"Italiana";font-size:2.3rem;line-height:1}
.social-proof span{font-size:.66rem;text-transform:uppercase;letter-spacing:.13em}
.marquee{overflow:hidden;background:var(--pink);border-block:1px solid var(--ink);padding:1rem 0;white-space:nowrap}
.marquee div{font-size:.72rem;letter-spacing:.15em;word-spacing:1.4rem;animation:slide 24s linear infinite;width:max-content}
@keyframes slide{to{transform:translateX(-35%)}
}
.intro-section{padding:10vw 12vw;text-align:center;background:var(--cream)}
.intro-section h2{font-size:clamp(3rem,6vw,6.3rem);max-width:1150px;margin:auto}
.intro-section>p:last-child{max-width:740px;margin:2rem auto 0;color:var(--muted)}
.work{padding:9vw 5vw}
.section-title-row{display:grid;grid-template-columns:1fr .65fr;align-items:end;gap:8vw;margin-bottom:5rem}
.section-title-row h2,.results h2,.about h2{font-size:clamp(3.2rem,5.4vw,6rem)}
.section-title-row>p{color:var(--muted)}
.portfolio-grid{display:grid;grid-template-columns:1fr .82fr;gap:7vw}
.video-project{display:grid;grid-template-columns:minmax(260px,410px) 1fr;gap:2rem;align-items:end}
.video-shell{background:var(--grey);padding:1.2rem;border-radius:210px 210px 15px 15px}
.video-shell video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:190px 190px 6px 6px;background:#ddd}
.project-copy span,.formats span,.result-card span{font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted)}
.project-copy h3,.formats h3,.service-list h3{font-family:"Italiana";font-weight:400;font-size:1.8rem;line-height:1.1;margin:.7rem 0}
.project-copy p,.formats p{font-size:.82rem;color:var(--muted)}
.formats{border-top:1px solid}
.formats article{padding:2rem 0;border-bottom:1px solid}
.formats h3{font-size:2.5rem}
.formats article:nth-child(2){margin-left:3rem}
.results{padding:9vw 5vw;background:var(--pink)}
.results-head{display:grid;grid-template-columns:.55fr 1.1fr .55fr;align-items:end;gap:4vw;margin-bottom:4rem}
.results-head .section-label{align-self:start}
.results-head>p:last-child{color:#765f63}
.result-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.result-card{min-height:610px;padding:2rem;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden}
.rose{background:#fdf4f5}
.beige{background:var(--cream)}
.grey{background:var(--grey)}
.result-card strong{display:block;font-family:"Italiana";font-size:4rem;line-height:1;margin:.7rem 0}
.result-card p{font-size:.8rem;color:var(--muted)}
.result-card img{width:74%;max-height:430px;object-fit:cover;object-position:top;margin:1.25rem auto -4rem;box-shadow:0 15px 45px rgba(40,30,30,.14);border-radius:18px}
.services{padding:9vw 5vw}
.service-list{border-top:1px solid}
.service-list article{display:grid;grid-template-columns:80px .8fr 1fr;gap:3vw;padding:2.3rem 0;border-bottom:1px solid}
.service-list article>span{font-size:.68rem;color:#a7848a}
.service-list h3{font-size:2.7rem;margin:0}
.service-list p{margin:0;color:var(--muted)}
.about{display:grid;grid-template-columns:1fr 1fr;gap:8vw;padding:10vw 5vw;background:var(--cream);align-items:center}
.about-collage{height:700px;position:relative}
.about-collage img{position:absolute;object-fit:cover}
.about-one{width:70%;height:82%;left:0;top:0;border-radius:220px 220px 0 0}
.about-two{width:43%;height:50%;right:0;bottom:0;border:10px solid var(--cream)}
.about-collage span{position:absolute;right:0;top:15%;background:var(--pink);padding:1rem;transform:rotate(5deg);font-size:.68rem;text-transform:uppercase}
.about-copy>p:not(.section-label){color:var(--muted)}
.about-copy h2{margin-bottom:2rem}
.contact{padding:10vw 5vw;background:linear-gradient(135deg,var(--white) 0 52%,#faf2f3 52%);display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;align-items:start}
.contact-intro{position:sticky;top:2rem}
.contact h2{font-size:clamp(3.4rem,6.7vw,7.6rem)}
.contact-intro>p:not(.section-label){color:var(--muted);margin:2rem 0;max-width:520px}
.button.dark{background:var(--ink);color:white}
.email{display:block;margin-top:1.4rem;font-size:.76rem;text-decoration:underline;color:var(--muted)}
.inquiry-form{background:var(--white);border:1px solid var(--ink);padding:clamp(1.4rem,3vw,3rem);box-shadow:12px 12px 0 var(--pink)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1.2rem}
.inquiry-form label{display:flex;flex-direction:column;gap:.45rem;text-align:left}
.inquiry-form label.full{grid-column:1/-1}
.inquiry-form label>span{font-size:.69rem;text-transform:uppercase;letter-spacing:.12em;font-weight:600}
.inquiry-form small{font-size:inherit;text-transform:none;letter-spacing:0;color:var(--muted);font-weight:400}
.inquiry-form input,.inquiry-form select,.inquiry-form textarea{width:100%;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);font:inherit;font-size:.95rem;padding:.75rem .1rem;outline:none}
.inquiry-form textarea{border:1px solid var(--line);padding:.8rem;resize:vertical;min-height:130px}
.inquiry-form input:focus,.inquiry-form select:focus,.inquiry-form textarea:focus{border-color:#b67f88;box-shadow:0 2px 0 #b67f88}
.form-submit{border:0;margin-top:1.7rem;cursor:pointer;width:100%;min-height:52px;touch-action:manipulation;-webkit-appearance:none;appearance:none}
.form-error{background:#fff0f0;border:1px solid #bd5b62;color:#7c252b;padding:.8rem 1rem;margin:1rem 0 0;font-size:.85rem;text-align:left}
.form-status{background:var(--pink);border:1px solid var(--blush);padding:.85rem 1rem;margin:1rem 0 0;font-size:.85rem;text-align:left}
.form-note{font-size:.68rem;color:var(--muted);line-height:1.45;margin:1rem 0 0}
footer{display:flex;justify-content:space-between;align-items:center;padding:2rem 5vw;background:var(--pink);border-top:1px solid}
footer p{margin:0;font-size:.72rem;color:#705f62}
@media(max-width:1000px){.hero{grid-template-columns:1fr}
.hero-images{height:620px;margin-top:2rem}
.section-title-row,.results-head,.portfolio-grid,.about,.contact{grid-template-columns:1fr}
.contact-intro{position:static}
.result-cards{grid-template-columns:1fr 1fr}
.nav nav a:not(.nav-cta){display:none}
}
@media(max-width:680px){body{font-size:16px}
.nav{height:72px;padding:0 1.2rem}
.hero{padding:4rem 1.2rem}
.hero h1{font-size:3.7rem}
.hero-actions{align-items:flex-start;flex-direction:column}
.hero-images{height:510px}
.soft-orb{width:430px;height:430px}
.portrait-main{width:280px;height:410px;right:0}
.portrait-small{width:150px;height:205px}
.social-proof{top:4%;left:-4%}
.note{display:none}
.intro-section,.work,.results,.services,.about,.contact{padding:5.5rem 1.2rem}
.video-project{grid-template-columns:1fr}
.video-shell{max-width:340px;margin:auto}
.project-copy{text-align:center}
.formats article:nth-child(2){margin-left:0}
.result-cards{grid-template-columns:1fr}
.result-card{min-height:0;padding:1.5rem;text-align:center}
.result-card img{width:86%;max-height:none;margin:1rem auto -1.5rem}
.form-grid{grid-template-columns:1fr}
.inquiry-form label.full{grid-column:auto}
.inquiry-form input,.inquiry-form select,.inquiry-form textarea{font-size:16px}
.form-submit{position:relative;z-index:2}
.service-list article{grid-template-columns:40px 1fr}
.service-list article p{grid-column:2}
.about-collage{height:500px}
footer{flex-direction:column;gap:.5rem}
footer p:nth-child(2){display:none}
}

.yapping-showcase{display:grid;grid-template-columns:150px 1fr;gap:1.6rem;align-items:center;margin-left:0!important;padding:2rem 0!important}
.mini-video{padding:.55rem;background:var(--pink);border-radius:80px 80px 8px 8px}
.mini-video video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:70px 70px 4px 4px;background:#ddd}
@media(max-width:680px){.yapping-showcase{grid-template-columns:120px 1fr!important;gap:1.1rem}.yapping-showcase h3{font-size:2rem}}
