@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');

:root{--ink:#172126;--cream:#f4efe6;--paper:#fff9ef;--peach:#d38f71;--ochre:#d6a342;--sage:#74806a;--line:rgba(23,33,38,.19);font-family:'DM Sans',Arial,sans-serif;color:var(--ink);background:var(--cream);scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;min-width:320px}
img,video{display:block;max-width:100%}
button,a{font:inherit}
button{cursor:pointer}
a{color:inherit}
button:focus-visible,a:focus-visible{outline:3px solid var(--ochre);outline-offset:4px}
.skip-link{position:absolute;left:1rem;top:-5rem;z-index:100;background:var(--paper);padding:.6rem 1rem}.skip-link:focus{top:1rem}
.container{width:min(100% - 3rem,1220px);margin:auto}
.site-header{position:relative;z-index:10;background:var(--ink);color:var(--cream);border-bottom:1px solid rgba(244,239,230,.17)}
.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.wordmark{text-decoration:none;display:inline-flex;flex-direction:column;line-height:1;gap:.35rem;white-space:nowrap}
.wordmark-name,.site-footer strong{font-size:1.18rem;font-weight:700;letter-spacing:.075em}
.wordmark-period{color:var(--peach)}
.wordmark-sub{font-size:.75rem;letter-spacing:.2em;color:#b6b8ae;font-weight:600}
.site-nav{display:flex;align-items:center;gap:clamp(1rem,3vw,2.8rem);font-size:.88rem;font-weight:600}
.site-nav a{text-decoration:none;transition:color .2s ease}.site-nav a:hover{color:var(--peach)}
.site-nav .nav-contact{border:1px solid rgba(244,239,230,.52);border-radius:99px;padding:.76rem 1.1rem}.site-nav .nav-contact:hover{background:var(--cream);color:var(--ink)}
.site-nav .nav-contact span{margin-left:.35rem}
.hero{background:var(--ink);color:var(--cream);overflow:hidden}
.hero-grid{min-height:680px;display:grid;grid-template-columns:minmax(0,1.13fr) minmax(350px,.87fr);gap:clamp(2rem,5vw,6rem);align-items:center;padding-block:5rem 5.3rem}
.hero-copy{position:relative;z-index:1}
.eyebrow{text-transform:uppercase;font-size:.79rem;letter-spacing:.19em;font-weight:700;display:flex;align-items:center;gap:1rem;margin:0 0 1.5rem;color:#7c5d50}
.eyebrow-line{width:27px;height:1px;background:currentColor;display:inline-block;flex:none}
.eyebrow.light{color:#d6b29c}.eyebrow.dark{color:#563d26}
h1,h2,h3,p{margin-top:0}
h1,h2{letter-spacing:-.045em;line-height:1.03;font-weight:600}
h1{font-size:clamp(3.7rem,6.25vw,6.7rem);max-width:12ch;margin-bottom:1.5rem}
h1 em,h2 em{font-family:'DM Serif Display',Georgia,serif;font-weight:400;letter-spacing:-.035em}
h1 em{color:var(--peach)}
h1 span{display:block}
.hero-intro{font-size:clamp(1.05rem,1.4vw,1.26rem);line-height:1.6;max-width:520px;color:#dbdcd3;margin-bottom:2rem}
.hero-actions{display:flex;align-items:center;gap:1.9rem;flex-wrap:wrap}
.button{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:2rem;padding:1.1rem 1.3rem;font-weight:700;border-radius:4px;transition:transform .2s,background .2s}
.button:hover{transform:translateY(-3px)}.button-peach{background:var(--peach);color:var(--ink)}.button-peach:hover{background:#e3a98f}
.text-link{text-decoration:none;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:.32rem}.text-link span{margin-left:.4rem}.light-link{color:var(--cream)}
.hero-footnote{margin-top:4.5rem;display:flex;align-items:center;gap:.8rem;color:#b9bdb7;font-size:.9rem;line-height:1.5;max-width:28rem;letter-spacing:.02em}.footnote-mark{font-size:1.5rem;color:var(--peach);line-height:1}
.hero-media{position:relative;display:flex;justify-content:center;align-items:center;min-height:560px}
.hero-media-backdrop{position:absolute;width:88%;height:85%;right:0;top:4%;background:var(--peach);transform:rotate(7deg);border-radius:250px 250px 8px 8px}
.hero-film{position:relative;width:min(74%,330px);height:545px;background:#3b4644;padding:0;border:8px solid #334144;box-shadow:24px 26px 0 rgba(0,0,0,.2),0 24px 50px rgba(0,0,0,.22);border-radius:180px 180px 8px 8px;overflow:hidden;transform:rotate(-3deg);transition:transform .3s ease}
.hero-film:hover{transform:rotate(0deg) translateY(-6px)}
.hero-film>img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.hero-film:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.72));pointer-events:none}
.hero-play{position:absolute;z-index:1;left:1.3rem;bottom:1.5rem;color:#fff;display:flex;align-items:center;gap:.8rem;text-align:left;font-weight:700;font-size:1.05rem}
.hero-play small{display:block;font-size:.75rem;font-weight:500;opacity:.86;margin-top:.1rem}
.play-triangle{display:inline-block;width:0;height:0;border-left:12px solid currentColor;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px}
.hero-play>.play-triangle{border-left-color:#fff}
.hero-index{position:absolute;bottom:0;right:-1rem;transform:rotate(-90deg) translateX(100%);transform-origin:right bottom;color:#d7d8d0;font-size:.75rem;letter-spacing:.2em;font-weight:700}
.section-pad{padding-block:clamp(5rem,9vw,8.7rem)}
.work-section{background:var(--cream)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:3rem;margin-bottom:3.2rem}
h2{font-size:clamp(3.25rem,5.7vw,6.3rem);margin-bottom:0}
.section-heading p:last-child{max-width:330px;line-height:1.6;font-size:1.05rem;margin:0 0 .2rem;color:#59605e}
.work-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:1.1rem;row-gap:3.4rem}
.work-card{min-width:0}
.work-button{position:relative;width:100%;padding:0;border:0;background:#d9d5cb;display:block;aspect-ratio:9/13.4;overflow:hidden;border-radius:3px}
.work-button img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease,filter .35s ease}
.work-button:hover img{transform:scale(1.05);filter:brightness(.82)}
.work-button:focus-visible img{filter:brightness(.8)}
.work-play{position:absolute;left:1rem;bottom:1rem;border-radius:50%;width:3.1rem;height:3.1rem;background:var(--cream);color:var(--ink);display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.16);transition:transform .2s}
.work-button:hover .work-play{transform:scale(1.12)}
.work-play .play-triangle{border-left-width:10px;border-top-width:7px;border-bottom-width:7px}
.work-meta{margin-top:1rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:#8b6756}
.work-card h3{font-size:1.2rem;line-height:1.22;margin:.45rem 0 .35rem;letter-spacing:-.02em}
.work-card p{font-size:.88rem;line-height:1.5;color:#626866;margin:0}
.family-section{background:var(--ochre);overflow:hidden}
.family-grid{display:grid;grid-template-columns:1fr .9fr;gap:clamp(3rem,7vw,8rem);align-items:center}
.family-copy h2{font-size:clamp(3.4rem,6vw,6rem);margin-bottom:1.7rem}.family-copy h2 em{color:#fff3d5}
.family-copy>p:not(.eyebrow){font-size:1.17rem;line-height:1.6;max-width:520px;margin-bottom:2rem}
.family-list{padding:0;margin:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.65rem 1.5rem;max-width:530px}
.family-list li{border-top:1px solid rgba(23,33,38,.5);padding-top:.7rem;font-size:.93rem;font-weight:700}
.family-film{position:relative;display:block;width:min(100%,355px);aspect-ratio:9/13;justify-self:center;border:0;padding:0;background:var(--ink);border-radius:190px 190px 6px 6px;overflow:hidden;box-shadow:25px 25px 0 rgba(23,33,38,.17)}
.family-film img{height:100%;width:100%;object-fit:cover;object-position:center 20%;transition:transform .4s}
.family-film:hover img{transform:scale(1.05)}
.family-film:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.62));pointer-events:none}
.round-play{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);width:4.6rem;height:4.6rem;border-radius:50%;background:rgba(255,255,255,.93);display:grid;place-items:center;color:var(--ink)}
.film-caption{position:absolute;z-index:1;left:1.5rem;right:1.5rem;bottom:1.5rem;color:#fff;display:flex;justify-content:space-between;font-weight:700;font-size:1.1rem;text-align:left}
.about-section{background:var(--ink);color:var(--cream)}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(3rem,8vw,9rem)}
.about-lede h2{max-width:9ch}.about-lede h2 em{color:var(--peach)}
.about-aside{margin:1.5rem 0 0;color:#adb8b2;font-size:1rem}
.about-body>p{font-size:clamp(1.12rem,1.5vw,1.35rem);line-height:1.6;color:#e0e0d7;max-width:690px;margin-bottom:1.35rem}
.about-body h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.17em;color:var(--peach);margin:3.2rem 0 1.3rem}
.capability-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem 1.6rem}
.capability-grid span{font-size:.93rem;border-top:1px solid rgba(244,239,230,.27);padding:.8rem 0;line-height:1.3}
.contact-section{background:var(--sage);color:#fffaf0;text-align:center}
.contact-inner{display:flex;align-items:center;flex-direction:column}
.contact-section h2{margin-bottom:2.1rem}.contact-section h2 em{color:#f7dfae}
.contact-email{display:inline-flex;align-items:center;gap:1.4rem;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:.45rem;font-size:clamp(1.25rem,2.2vw,2rem);font-weight:700;word-break:break-word}
.contact-email:hover{color:#f7dfae}
.contact-inner>p:last-child{margin:1.4rem 0 0;color:#f0f0e8}
.site-footer{background:#10191d;color:var(--cream);padding:2.3rem 0}
.footer-inner{display:flex;justify-content:space-between;gap:2rem;align-items:center}
.site-footer strong{display:block}.site-footer span:not(.wordmark-period){display:block;color:#aeb7b2;font-size:.88rem;margin-top:.3rem}
.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap}.footer-links a{text-decoration:none;font-size:.88rem;font-weight:600}.footer-links a:hover{color:var(--peach)}
.video-dialog{border:0;padding:0;background:transparent;color:#fff;width:min(92vw,440px);max-height:95vh;overflow:visible}
.video-dialog::backdrop{background:rgba(4,10,12,.88);backdrop-filter:blur(4px)}
.dialog-content{background:#10191d;padding:.5rem;border:1px solid rgba(255,255,255,.2);box-shadow:0 20px 80px #0008}
.dialog-content video{width:100%;max-height:78vh;aspect-ratio:9/16;background:#000}
.dialog-content p{margin:.7rem .6rem .35rem;font-size:.93rem;font-weight:700}
.dialog-close{position:absolute;z-index:2;right:-3rem;top:-.35rem;border:0;background:var(--cream);color:var(--ink);border-radius:50%;width:2.45rem;height:2.45rem;display:grid;place-items:center;font-size:1.7rem;line-height:1}
@media(max-width:1000px){.hero-grid{grid-template-columns:1.1fr .9fr;gap:1rem}.hero-film{height:470px}.hero-media{min-height:500px}.work-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.container{width:min(100% - 2rem,600px)}.header-inner{min-height:72px}.site-nav{gap:1rem}.site-nav a:not(.nav-contact){display:none}.hero-grid{display:flex;flex-direction:column;align-items:stretch;padding-block:4rem 5rem;gap:2.7rem}.hero h1{max-width:12ch}.hero-footnote{margin-top:2.2rem}.hero-media{min-height:430px}.hero-film{height:420px;width:250px}.hero-media-backdrop{width:250px;height:390px;right:calc(50% - 145px);top:5px}.hero-index{display:none}.section-heading{display:block}.section-heading p:last-child{margin-top:1.2rem;max-width:500px}.work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.4rem 1rem}.family-grid,.about-grid{display:grid;grid-template-columns:1fr}.family-film{width:min(100%,320px)}.footer-inner{align-items:start;flex-direction:column}.dialog-close{right:.25rem;top:-2.9rem}}
@media(max-width:480px){.wordmark-name{font-size:.94rem}.wordmark-sub{font-size:.75rem;letter-spacing:.12em}.site-nav .nav-contact{font-size:.76rem;padding:.67rem .85rem}.hero h1{font-size:clamp(3.1rem,13vw,4.25rem)}.hero-intro{font-size:1rem}.hero-actions{gap:1.2rem}.button{padding:.95rem 1rem;gap:1rem}.work-grid{gap:2.2rem .75rem}.work-button{aspect-ratio:9/14}.work-card h3{font-size:1.04rem}.work-card p{font-size:.88rem}.work-play{width:2.55rem;height:2.55rem;left:.6rem;bottom:.6rem}.work-meta{font-size:.75rem}.family-list{grid-template-columns:1fr}.capability-grid{grid-template-columns:1fr}.footer-links{gap:1rem}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}