:root{--bg:#101010;--card:#1c1c1c;--text:#f7f7f7;--muted:#b8b8b8;--line:#343434;--accent:#eaa477;--button:#c54e14;--button-hover:#b34510;--band:#151515;--header:rgba(16,16,16,.97);--hero-gradient:radial-gradient(ellipse at 80% 30%,#8c48252b,transparent 53%);--media-gradient:linear-gradient(135deg,#241d19,#1c1c1c 70%);--invitation-gradient:linear-gradient(120deg,#201915,#161616 75%);--focus:#eaa477;color-scheme:dark}
:root[data-theme=light]{--bg:#fff;--card:#f5f5f5;--text:#171717;--muted:#595959;--line:#dedede;--accent:#b74512;--button:#c54e14;--button-hover:#b34510;--band:#fafafa;--header:rgba(255,255,255,.98);--hero-gradient:radial-gradient(ellipse at 80% 30%,#fbe6d9a8,transparent 53%);--media-gradient:linear-gradient(135deg,#fff0e6,#f5f5f5 70%);--invitation-gradient:linear-gradient(120deg,#fff0e6,#fff 75%);--focus:#b74512;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:var(--text);background:var(--bg);font-family:Inter,'Segoe UI',Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--focus);outline-offset:5px}::selection{background:var(--button);color:#fff}img{max-width:100%}h1,h2,h3,p{margin-top:0}h1,h2,h3{overflow-wrap:break-word}main:focus{outline:none}.shell{width:min(1160px,calc(100% - 80px));margin-inline:auto}.skip{position:fixed;left:20px;top:-100px;z-index:100;background:var(--button);color:#fff;padding:12px 20px}.skip:focus{top:12px}.icon{width:20px;height:20px;flex:none;display:inline-block;vertical-align:middle}.header{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:var(--header)}.header-inner{height:92px;display:flex;align-items:center;gap:30px}.brand{display:inline-flex;gap:10px;align-items:center;flex-shrink:0;font-size:20px;line-height:1.15;font-weight:650;letter-spacing:-.6px}.brand img{width:60px;height:40px;object-fit:contain;flex:none}.nav{display:flex;gap:24px;margin-left:auto;align-items:center;font-size:12px;white-space:nowrap}.nav a{color:var(--muted);padding:8px 0}.nav a:hover,.nav a[aria-current=page],.footer a:hover{color:var(--accent)}.header-actions{display:flex;gap:23px;align-items:center;flex:none}.button{display:inline-flex;justify-content:center;align-items:center;gap:22px;min-height:50px;padding:13px 22px;border:1px solid transparent;border-radius:5px;font-size:12px;line-height:1.4;font-weight:600;transition:background .2s,border-color .2s,transform .2s}.button .icon{width:18px;height:18px}.button:hover{transform:translateY(-2px)}.primary{background:var(--button);color:#fff}.primary:hover{background:var(--button-hover)}.secondary{background:var(--card);border-color:var(--line);color:var(--text)}.secondary:hover{border-color:var(--accent)}.header-project{min-height:42px;padding:10px 15px;border-color:var(--line);gap:12px;font-size:11px}.header-project:hover,.header-project[aria-current=page]{border-color:var(--accent);color:var(--accent)}.mobile-project,.menu-toggle{display:none}.hero{background:var(--hero-gradient);position:relative;isolation:isolate}.hero:after{content:'';position:absolute;top:22%;right:12%;width:24%;height:45%;border:1px solid var(--line);border-radius:50% 50% 6px 6px;transform:rotate(22deg);opacity:.45;z-index:-1}.hero-inner{padding-top:94px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin:0 0 24px;display:flex;align-items:center;gap:10px}.short-line{width:22px;height:1px;background:var(--accent)}h1{font-size:clamp(42px,5.2vw,72px);line-height:1.08;font-weight:550;letter-spacing:-3px;margin-bottom:25px}h1 span{color:var(--accent)}.hero-description{font-size:17px;line-height:1.85;color:var(--muted);margin-bottom:30px;max-width:570px}.button-row{display:flex;flex-wrap:wrap;gap:12px}.hero-note{font-size:11px;color:var(--muted);margin-top:22px;margin-bottom:64px}.hero-rule{border-top:1px solid var(--line);padding-block:24px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}.hero-rule>span{display:flex;align-items:center;gap:16px}.hero-rule i{display:inline-block;width:3px;height:3px;background:var(--accent);border-radius:50%}.hero-rule a{display:flex;align-items:center;gap:16px}.hero-rule .icon{width:16px;height:16px;color:var(--accent);transform:rotate(90deg)}.section{padding-block:80px}.section-heading{display:grid;grid-template-columns:1fr 2fr;gap:30px;margin-bottom:34px}.section-heading>.eyebrow{padding-top:8px}h2{font-size:clamp(30px,3.1vw,44px);line-height:1.18;font-weight:550;letter-spacing:-1.4px;margin-bottom:18px}.section-intro{font-size:14px;color:var(--muted);line-height:1.85;max-width:570px;margin:0}.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.service{padding:32px;background:var(--card);border:1px solid var(--line);border-radius:6px;min-width:0}.service-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.service-top span{font-size:11px;color:var(--muted)}.service-top .icon{width:32px;height:32px;color:var(--accent);stroke-width:1.2}.service h3{font-size:22px;letter-spacing:-.5px;font-weight:550;margin-bottom:12px}.service p{font-size:14px;line-height:1.8;color:var(--muted);max-width:420px;margin-bottom:24px}.service-tags{font-size:11px;border-top:1px solid var(--line);padding-top:16px;color:var(--muted)}.work-band{background:var(--band);border-block:1px solid var(--line)}.selected-grid{display:grid;grid-template-columns:1.65fr 1fr 1fr;gap:28px;align-items:start}.work-card{min-width:0}.media{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--line);border-radius:6px;background:var(--media-gradient);width:100%;color:var(--muted)}.media.horizontal{aspect-ratio:16/9;max-width:480px}.media.portrait{aspect-ratio:9/16;max-width:200px}.selected-grid .media.portrait{max-width:170px}.media.website{aspect-ratio:16/10;max-width:480px}.media-format{position:absolute;top:16px;left:16px;font-size:10px}.media-bottom{position:absolute;bottom:16px;left:16px;font-size:8px;letter-spacing:1.2px}.placeholder-center{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:24px;width:100%;font-size:12px;line-height:1.6}.placeholder-center .icon{width:28px;height:28px;color:var(--accent);stroke-width:1.1}.card-caption{padding-top:18px}.card-caption .eyebrow{font-size:8px;letter-spacing:1.1px;margin-bottom:8px}.card-caption h3{font-size:17px;line-height:1.4;font-weight:550;letter-spacing:-.2px;margin-bottom:7px}.card-caption>p:not(.eyebrow){font-size:12px;color:var(--muted);margin:0}.section-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:24px;margin-top:36px;font-size:11px;color:var(--muted);gap:24px}.text-link{display:inline-flex;align-items:center;gap:24px;font-size:12px;font-weight:550;color:var(--text);padding-block:5px}.text-link .icon{width:18px;height:18px;color:var(--accent)}.text-link:hover{color:var(--accent)}.about{display:grid;grid-template-columns:1fr 2fr;gap:30px;border-bottom:1px solid var(--line)}.about>.eyebrow{padding-top:8px}.about-lead{font-size:19px;line-height:1.8;max-width:640px;margin-bottom:18px}.process .section-heading{margin-bottom:34px}.process-grid{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);padding:0;margin:0}.process-grid li{border-top:1px solid var(--line);padding:24px 24px 0 0;position:relative;min-width:0}.process-grid li:before{content:'';width:5px;height:5px;position:absolute;top:-3px;left:0;border-radius:50%;background:var(--accent)}.process-grid li>span{font-size:10px;color:var(--muted)}.process-grid h3{font-size:17px;font-weight:550;margin:18px 0 10px}.process-grid p{font-size:12px;color:var(--muted);line-height:1.85;margin:0;max-width:180px}.contact-invitation{background:var(--invitation-gradient);border-block:1px solid var(--line)}.contact-invitation>.shell{padding-block:65px;display:flex;align-items:center;justify-content:space-between;gap:40px}.contact-invitation p:not(.eyebrow){font-size:14px;color:var(--muted);max-width:610px;margin-bottom:0}.contact-invitation .button{flex:none}.page-heading{padding-top:75px;padding-bottom:48px;border-bottom:1px solid var(--line)}.page-heading h1{font-size:clamp(40px,4.4vw,62px);letter-spacing:-2px;max-width:800px}.page-description{font-size:16px;color:var(--muted);line-height:1.85;max-width:640px;margin:0}.portfolio-section{padding-block:56px}.subheading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px}.subheading h2{font-size:27px;letter-spacing:-.8px;margin-bottom:0}.subheading>span{font-size:10px;color:var(--muted)}.featured-ad{display:grid;grid-template-columns:minmax(0,480px) 1fr;gap:44px;align-items:center;margin-bottom:44px}.feature-copy .eyebrow{font-size:9px;margin-bottom:16px}.feature-copy h3{font-size:27px;line-height:1.3;font-weight:550;letter-spacing:-.6px;margin-bottom:12px}.feature-copy>p:not(.eyebrow){font-size:14px;color:var(--muted);margin-bottom:22px}.format-chip{display:inline-block;border:1px solid var(--line);padding:6px 10px;border-radius:3px;font-size:10px;color:var(--muted)}.portrait-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}.website-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}.work-social{padding-block:48px;display:flex;align-items:center;justify-content:space-between;gap:35px}.work-social h2{font-size:23px;letter-spacing:-.5px;margin-bottom:10px}.work-social p{font-size:13px;color:var(--muted);margin:0}.social-placeholder{display:flex;align-items:center;gap:16px;flex:none;font-size:13px}.social-placeholder>.icon{color:var(--accent)}.social-placeholder small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.contact-heading{padding-bottom:48px}.contact-content{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;padding-top:60px;padding-bottom:85px}.contact-copy h2{font-size:33px}.contact-copy>p{font-size:15px;line-height:1.9;color:var(--muted)}.contact-guidance{border-left:2px solid var(--accent);padding-left:20px;font-size:13px!important;margin-block:25px}.contact-options{display:grid;gap:22px}.contact-option{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:28px}.contact-option>.icon{color:var(--accent);width:25px;height:25px;margin-bottom:18px}.contact-option h3{font-size:20px;font-weight:550;letter-spacing:-.3px;margin-bottom:10px}.contact-option p{font-size:13px;color:var(--muted);margin-bottom:18px}.pending-contact{display:block;font-size:11px;line-height:1.7;color:var(--muted);border-top:1px dashed var(--line);padding-top:14px;overflow-wrap:anywhere}.footer{background:var(--bg);padding-block:44px 24px}.footer-top{display:grid;grid-template-columns:1.3fr .7fr 1fr;gap:35px;padding-bottom:32px}.footer .brand{font-size:19px}.footer .brand img{width:54px;height:36px}.footer p{font-size:12px;color:var(--muted);margin:14px 0 0;line-height:1.9}.footer nav{display:flex;flex-direction:column;align-items:start;gap:8px;font-size:12px;color:var(--muted)}.footer-note{justify-self:end;color:var(--muted);font-size:12px;line-height:2}.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:20px;font-size:10px;color:var(--muted)}.footer-bottom a{display:flex;align-items:center;gap:12px}.footer-bottom .icon{width:14px;height:14px;color:var(--accent)}.media-trigger{padding:0;text-align:inherit}.media-trigger .placeholder-center{color:var(--text)}.media-trigger img{position:absolute;width:100%;height:100%;object-fit:contain}.media-trigger .media-format,.media-trigger .media-bottom{background:var(--card);padding:3px 6px;border-radius:3px}.video-dialog{width:min(940px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);padding:20px}.video-dialog::backdrop{background:#000b}.player-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}.player-header h2{font-size:20px;margin:0;letter-spacing:-.4px}.player-close{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:4px;padding:8px 14px}.video-dialog video{display:block;width:100%;max-height:calc(100dvh - 140px);object-fit:contain;background:#000}
@media(max-width:1150px){.shell{width:calc(100% - 64px)}.header-inner{gap:20px}.brand{font-size:19px;gap:8px}.brand img{width:48px;height:32px}.nav{gap:18px}.header-actions{gap:18px}.header-project{padding-inline:12px;gap:8px}.selected-grid{gap:22px}.contact-content{gap:48px}}
@media(max-width:1000px){.header-inner{height:80px}.nav{display:none;position:absolute;left:0;right:0;top:80px;background:var(--bg);border-bottom:1px solid var(--line);padding:18px 32px;flex-direction:column;align-items:stretch;gap:0}.nav.open{display:flex}.nav a{padding:12px 0;font-size:15px}.mobile-project{display:flex!important;align-items:center;justify-content:space-between}.header-actions{margin-left:auto;gap:22px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:40px;height:40px;background:var(--card);border:1px solid var(--line);border-radius:5px;padding:10px}.menu-toggle span{height:1px;width:100%;background:var(--text);transition:transform .2s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.hero-inner{padding-top:75px}.hero:after{right:9%;width:25%;opacity:.3}.selected-grid{grid-template-columns:1.5fr 1fr 1fr;gap:20px}.card-caption h3{font-size:15px}.card-caption .eyebrow{font-size:7px}.media-format{font-size:9px}.portrait-grid{gap:20px}.contact-content{grid-template-columns:1fr 1fr;gap:36px}.service{padding:28px}.featured-ad{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:30px}.feature-copy h3{font-size:23px}.section{padding-block:65px}.portfolio-section{padding-block:48px}}
@media(max-width:760px){.shell{width:calc(100% - 40px)}.header-inner{height:74px}.nav{top:74px;padding-inline:20px}.header-project{display:none}.brand{font-size:18px}.header-actions{gap:18px}.hero:after{display:none}.hero-inner{padding-top:55px}h1{font-size:clamp(38px,7.9vw,58px);letter-spacing:-2px}.hero-description{font-size:16px}.hero-note{margin-bottom:44px}.section-heading,.about{grid-template-columns:1fr;gap:8px}.section-heading>.eyebrow,.about>.eyebrow{padding:0;margin-bottom:12px}h2{font-size:33px}.section-heading{margin-bottom:28px}.services-grid{gap:16px}.service{padding:24px}.service h3{font-size:19px}.service p{font-size:13px}.service-tags{font-size:10px}.selected-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.selected-grid>.work-card:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:center}.selected-grid>.work-card:first-child .card-caption{padding:0}.selected-grid .media.portrait{max-width:200px}.process-grid{grid-template-columns:1fr;gap:0}.process-grid li{display:grid;grid-template-columns:25px 90px minmax(0,1fr);gap:14px;padding:20px 0;align-items:baseline}.process-grid li:before{display:none}.process-grid h3{margin:0;font-size:16px}.process-grid p{max-width:none;font-size:12px}.about-lead{font-size:18px}.contact-invitation>.shell{padding-block:50px;display:block}.contact-invitation .button{margin-top:26px}.contact-invitation h2 br{display:none}.page-heading{padding-top:50px;padding-bottom:35px}.page-heading h1{font-size:46px}.page-description{font-size:14px}.portrait-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px}.website-grid{gap:24px}.work-social{display:block;padding-block:38px}.social-placeholder{margin-top:24px}.contact-content{grid-template-columns:1fr;gap:36px}.contact-copy h2{font-size:30px}.contact-options{grid-template-columns:1fr 1fr;gap:20px}.contact-option{padding:22px}.footer-top{grid-template-columns:1.3fr .7fr;gap:26px}.footer-note{grid-column:1/-1;justify-self:start}.footer .brand{font-size:18px}.subheading h2{font-size:25px}.subheading>span{font-size:9px}.feature-copy .eyebrow{font-size:8px}.feature-copy h3{font-size:21px}.placeholder-center{padding:20px;font-size:11px}}
@media(max-width:480px){.shell{width:calc(100% - 32px)}.header-inner{gap:10px;height:72px}.nav{top:72px;padding-inline:16px}.brand{font-size:16px;gap:6px;letter-spacing:-.5px}.brand img{width:36px;height:24px}.header-actions{gap:12px}.menu-toggle{width:36px;height:36px;padding:9px}.hero-inner{padding-top:48px}.eyebrow{font-size:9px;letter-spacing:1.1px;margin-bottom:22px}h1{font-size:clamp(35px,9.4vw,45px);letter-spacing:-1.7px}.hero-description{font-size:14px;line-height:1.9}.hero-description br{display:none}.button{min-height:48px;padding:12px 16px;font-size:11px;gap:17px}.hero-note{font-size:10px;margin-top:20px;margin-bottom:36px}.hero-rule{flex-wrap:wrap;font-size:10px;gap:14px;padding-block:20px}.hero-rule>span{gap:12px}.section{padding-block:48px}.section-intro{font-size:13px}h2{font-size:30px;letter-spacing:-1px}.services-grid{grid-template-columns:1fr}.service{padding:26px}.service h3{font-size:22px}.service p{font-size:13px}.service-top{margin-bottom:25px}.selected-grid>.work-card:first-child{display:block}.selected-grid>.work-card:first-child .card-caption{padding-top:16px}.selected-grid .media.portrait{max-width:170px}.card-caption h3{font-size:15px}.card-caption>p:not(.eyebrow){font-size:11px}.card-caption .eyebrow{font-size:7px;letter-spacing:.8px}.media-format{font-size:8px;top:12px;left:12px}.media-bottom{font-size:7px;bottom:12px;left:12px}.placeholder-center{padding:18px 12px;font-size:11px;gap:10px}.placeholder-center .icon{width:24px;height:24px}.section-bottom{flex-direction:column;align-items:start;margin-top:28px;padding-top:20px;gap:12px}.about-lead{font-size:17px}.process-grid li{grid-template-columns:22px 70px minmax(0,1fr);gap:10px}.process-grid h3{font-size:14px}.process-grid p{font-size:11px}.contact-invitation>.shell{padding-block:44px}.contact-invitation p:not(.eyebrow){font-size:13px}.page-heading{padding-top:42px}.page-heading h1{font-size:38px;letter-spacing:-1.5px}.subheading{align-items:start;gap:12px;margin-bottom:26px}.subheading h2{font-size:24px}.subheading>span{font-size:8px;padding-top:7px;white-space:nowrap}.featured-ad{grid-template-columns:1fr;gap:20px;margin-bottom:34px}.feature-copy h3{font-size:23px}.feature-copy>p:not(.eyebrow){font-size:12px;margin-bottom:15px}.feature-copy .eyebrow{margin-bottom:10px}.portrait-grid{gap:26px 18px}.portrait-grid .media.portrait{max-width:170px}.website-grid{grid-template-columns:1fr;gap:30px}.website-grid .card-caption h3{font-size:17px}.work-social h2{font-size:22px}.work-social p{font-size:12px}.contact-options{grid-template-columns:1fr}.contact-option{padding:24px}.contact-content{padding-top:38px}.contact-copy>p{font-size:14px}.footer{padding-top:36px}.footer-top{grid-template-columns:1fr 1fr;gap:28px}.footer-top>div:first-child{grid-column:1/-1}.footer-note{grid-column:auto;justify-self:end;font-size:11px}.footer .brand{font-size:19px}.footer-bottom{font-size:9px}.player-header h2{font-size:16px}.video-dialog{padding:15px}}
@media(max-width:350px){.brand{font-size:15px;gap:4px}.brand img{width:32px;height:22px}.header-actions{gap:8px}.menu-toggle{width:32px;padding:8px}.button{gap:12px;padding-inline:14px}.hero h1{font-size:35px}.process-grid li{grid-template-columns:20px 62px minmax(0,1fr);gap:8px}.subheading h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.button:hover{transform:none}}

.media-trigger .placeholder-center{position:relative;z-index:1;width:auto;background:var(--card);border:1px solid var(--line);padding:10px 16px;border-radius:4px}.media.website img{width:100%;height:100%;object-fit:contain}

/* Header refinement: compact spacing and clearer branding, shared across all pages. */
.header .shell{width:min(1200px,calc(100% - 64px))}
.header-inner{height:82px;gap:24px}
.header .brand{font-size:22px;gap:10px}
.header .brand img{width:66px;height:44px}
.header .nav{font-size:14px;gap:22px}
.header-actions{gap:20px}
.header .header-project{min-height:44px;padding:11px 17px;font-size:12px;gap:12px;border-radius:7px}
@media(max-width:1150px){.header .shell{width:calc(100% - 48px)}.header-inner{gap:18px}.header .brand{font-size:20px;gap:8px}.header .brand img{width:54px;height:36px}.header .nav{font-size:13px;gap:18px}.header-actions{gap:16px}.header .header-project{padding-inline:14px;gap:10px}}
@media(max-width:1000px){.header-inner{height:76px}.header .nav{top:76px;gap:0}.header .nav a{font-size:16px}.header-actions{gap:20px}.header .nav .mobile-project{margin-top:8px;padding:12px 16px;border-radius:7px;font-size:14px;min-height:46px;justify-content:center}}
@media(max-width:760px){.header .shell{width:calc(100% - 32px)}.header-inner{height:72px}.header .nav{top:72px}.header .brand{font-size:19px}.header .brand img{width:51px;height:34px}.header-actions{gap:16px}}
@media(max-width:480px){.header .shell{width:calc(100% - 24px)}.header-inner{height:68px;gap:10px}.header .nav{top:68px}.header .brand{font-size:17px;gap:6px}.header .brand img{width:39px;height:26px}.header-actions{gap:10px}}
@media(max-width:350px){.header .brand{font-size:16px;gap:4px}.header .brand img{width:34.5px;height:23px}.header-actions{gap:8px}}

/* Equal outer columns keep desktop navigation centered in the top bar. */
@media(min-width:1001px){
  .header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
  .header .brand{justify-self:start}
  .header .nav{margin:0;justify-self:center;font-size:16px;gap:24px}
  .header-actions{justify-self:end}
}
.header .menu-toggle{background:transparent;border-color:var(--accent);color:var(--accent)}
.header .menu-toggle span{background:currentColor}

/* Native copper buttons: no image downloads or outer glow. */
.button.project-button,.header .header-project,.header .nav .mobile-project{
  background:linear-gradient(135deg,#D8783E 0%,#AF5027 20%,#A44824 50%,#542414 100%);
  border:1px solid #EBA16F;
  color:#FFF6E8;
  box-shadow:inset 0 1px 1px rgba(255,210,170,.35);
  border-radius:8px;
}
.button.project-button:hover,.header .header-project:hover,.header .header-project[aria-current=page],.header .nav .mobile-project:hover{
  background:linear-gradient(135deg,#D8783E 0%,#AF5027 20%,#A44824 50%,#542414 100%);
  border-color:#F3B78F;
  color:#FFF6E8;
  box-shadow:inset 0 1px 1px rgba(255,210,170,.45);
}
.button.work-button,.button.work-button:hover{background:transparent;border-color:var(--accent);color:var(--text);border-radius:8px}
.hero .button-row .button{min-width:0;max-width:100%;min-height:46px;padding:10px 16px;font-size:14px}

/* Alternate-theme icon is visible; the button's accessible name describes its action. */
.header .theme-switch{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:44px;height:44px;min-height:44px;padding:0;
  border:1px solid var(--accent);border-radius:50%;
  background:transparent;color:var(--accent);
  transition:color .3s ease,border-color .3s ease,transform .2s ease;
}
.theme-switch span{display:flex;align-items:center;justify-content:center}
.theme-switch .icon{width:20px;height:20px;stroke-width:1.6}
.theme-switch .theme-moon,[data-theme=light] .theme-switch .theme-sun{display:none}
[data-theme=light] .theme-switch .theme-moon{display:flex}
.theme-switch:hover{transform:rotate(8deg)}

/* Only JavaScript-enhanced reveals are pending. CSS also restores visibility if
   the script/observer stops, so no content can remain hidden indefinitely. */
.reveal-pending{opacity:0;transform:translate3d(0,26px,0);animation:reveal-safety 1ms 1800ms forwards}
@keyframes reveal-safety{to{opacity:1;transform:none}}
body,.header,.nav,.footer,.work-band,.service,.contact-option,.contact-invitation,
.media,.hero-rule,.service-tags,.process-grid li,.footer-bottom,.page-heading,
.section-bottom,.about,.pending-contact,.menu-toggle,.format-chip,.player-close,.video-dialog{
  transition:background-color .3s ease,color .3s ease,border-color .3s ease,transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s ease;
}
a,.eyebrow,h1 span,.section-intro,.hero-description,.hero-note,.page-description,
.card-caption p,.service p,.process-grid p,.contact-copy p,.footer p,.footer-note,
.contact-invitation p,.work-social p,.feature-copy p,.social-placeholder small{
  transition:color .3s ease;
}
.button{transition:color .3s ease,border-color .25s ease,transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s ease}
.work-card{transition:transform .3s cubic-bezier(.22,1,.36,1)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .service:hover,.contact-option:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 8px 22px rgba(0,0,0,.08)}
  .work-card:hover{transform:translateY(-3px)}
  .work-card:hover .media{border-color:var(--accent);box-shadow:0 8px 22px rgba(0,0,0,.08)}
  .featured-ad .media:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 8px 22px rgba(0,0,0,.08)}
}
@media(prefers-reduced-motion:reduce){
  .reveal-pending{opacity:1;transform:none;animation:none!important}
  .theme-switch:hover,.button:hover,.service:hover,.contact-option:hover,.work-card:hover{transform:none}
}

/* Allow grid and flex content to shrink to the actual screen width. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.shell{max-width:100%}
.section-heading>*,.about>*,.services-grid>*,.selected-grid>*,.portrait-grid>*,
.website-grid>*,.featured-ad>*,.contact-content>*,.contact-options>*,.footer-top>*{min-width:0}
.hero-rule>span{flex-wrap:wrap}
.social-placeholder{max-width:100%;min-width:0}
.social-placeholder>span{min-width:0;overflow-wrap:anywhere}
.media img,.video-dialog video{max-width:100%}
@media(max-width:1000px){
  .header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;height:auto;min-height:76px;padding-block:8px;gap:12px}
  .header .brand{min-width:0;max-width:100%;justify-self:start}
  .header .brand span{min-width:0;overflow-wrap:anywhere}
  .header-actions{margin-left:0;justify-self:end}
  .header .nav{top:100%;width:100%;max-width:100%;margin:0;white-space:normal;max-height:calc(100dvh - 80px);overflow-y:auto}
  .header .menu-toggle{flex:none;width:44px;height:44px;padding:12px}
}
@media(max-width:760px){
  .header-inner{min-height:72px}
  .services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-top{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
  .footer .brand{max-width:100%}
  .footer .brand span{min-width:0;overflow-wrap:anywhere}
}
@media(max-width:480px){
  .header-inner{min-height:68px}
  .hero .button-row .button{padding-inline:12px}
  .services-grid{grid-template-columns:minmax(0,1fr)}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-rule{align-items:flex-start}
  .footer-bottom{flex-wrap:wrap;gap:12px}
  .subheading{flex-wrap:wrap}
}
@media(max-width:380px){
  .hero .button-row{flex-direction:column;align-items:stretch;gap:10px}
  .hero .button-row .button{width:100%}
}

:root{--header-height:83px}
/* Preserve the existing hero typography and button sizing. */
#home-hero .hero-inner{width:min(1680px,86.6%);padding-top:var(--header-height);padding-bottom:0;justify-content:center}
#home-hero .hero-copy{width:58%;max-width:760px;min-width:0;padding-block:24px}
#home-hero .eyebrow{font-size:clamp(10px,.72vw,14px);margin-bottom:clamp(24px,2.14vw,40px)}
#home-hero h1{font-size:clamp(42px,min(4.9vw,11svh),92px);line-height:1.08;margin-bottom:clamp(20px,1.7vw,32px)}
#home-hero .hero-description{font-size:clamp(16px,1.25vw,24px);line-height:1.75;max-width:740px;margin-bottom:clamp(24px,2.14vw,40px)}
#home-hero .button-row{gap:clamp(12px,1.2vw,22px)}
#home-hero .button-row .button{font-size:clamp(14px,.95vw,18px);min-height:clamp(46px,3.3vw,64px);padding:12px clamp(16px,1.35vw,26px)}
@media(min-width:1001px) and (max-height:650px){
  #home-hero .hero-copy{padding-block:16px}
  #home-hero .eyebrow{font-size:11px;margin-bottom:18px}
  #home-hero h1{margin-bottom:20px}
  #home-hero .hero-description{font-size:16px;margin-bottom:24px}
  #home-hero .button-row .button{font-size:14px;min-height:46px;padding:10px 16px}
}
@media(max-width:1000px){
  #home-hero .hero-inner{width:calc(100% - 64px)}
  #home-hero .hero-copy{width:62%}
}
@media(max-width:760px){
  #home-hero .hero-inner{width:calc(100% - 40px);padding-top:calc(var(--header-height) + 16px);padding-bottom:24px}
  #home-hero .hero-copy{width:100%;max-width:600px;padding-block:16px}
  #home-hero .eyebrow{font-size:10px;margin-bottom:24px}
  #home-hero h1{font-size:clamp(38px,7.9vw,58px);margin-bottom:24px}
  #home-hero .hero-description{font-size:16px;margin-bottom:28px}
  #home-hero .button-row .button{font-size:14px;min-height:46px;padding:10px 16px}
}
@media(max-width:480px){
  #home-hero .hero-inner{width:calc(100% - 32px)}
  #home-hero h1{font-size:clamp(35px,9.4vw,45px)}
  #home-hero .hero-description{font-size:14px}
  #home-hero .button-row .button{padding-inline:12px}
}

/* Preserve the previously approved supporting type sizes. */
#home-hero .hero-description{font-size:calc(clamp(16px,1.25vw,24px) + 1.5px)}
@media(min-width:1001px){#home-hero .hero-copy{margin-left:-3.5vw}}
@media(min-width:1001px) and (max-height:650px){#home-hero .hero-description{font-size:17.5px}}
@media(min-width:761px) and (max-width:1000px){#home-hero .hero-copy{margin-left:-8px}}
@media(max-width:760px){
  #home-hero .hero-description{font-size:17.5px}
}
@media(max-width:480px){#home-hero .hero-description{font-size:15.5px}}

/* Keep section alignment after removing editorial counters and labels. */
.section-heading>div,.about>div{grid-column:-2/-1}
.service-top{justify-content:flex-end}
.process-grid h3{margin-top:0}
.section-bottom{justify-content:flex-end}
.card-caption .website-link{margin-top:16px}
.website-link:disabled{opacity:.65;cursor:not-allowed;transform:none}
.footer-bottom .back-to-top{display:inline-flex;align-items:center;justify-content:center;flex:none;gap:0;width:28.6px;height:28.6px;border:1px solid var(--accent);border-radius:50%;background:transparent;color:var(--accent)}
.footer-bottom .back-to-top .icon{width:13px;height:13px;stroke-width:1.6}
@media(max-width:760px){.process-grid li{grid-template-columns:90px minmax(0,1fr)}}
@media(max-width:480px){.process-grid li{grid-template-columns:70px minmax(0,1fr)}}
@media(max-width:350px){.process-grid li{grid-template-columns:62px minmax(0,1fr)}}

/* Homepage: centered About copy and compact, grouped selected work. */
#about{display:block;text-align:center}
#about>div{width:100%}
#about .about-lead,#about .section-intro{max-width:960px;margin-inline:auto}
.home-work-groups{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.home-work-groups section,.home-work-groups article{min-width:0}
.home-work-label{font-size:18px;line-height:1.4;font-weight:550;letter-spacing:-.3px;margin-bottom:22px}
.home-website-group>.work-card{max-width:360px}
.media.website.selected-website{aspect-ratio:1/1;max-width:360px}
.home-ads-grid{display:grid;grid-template-columns:repeat(2,minmax(0,200px));gap:20px;align-items:start;max-width:420px}
.home-ads-grid .media.portrait{max-width:none}
@media(max-width:1000px){.home-work-groups{gap:32px}.home-ads-grid{gap:16px}}
@media(max-width:760px){
  .home-work-groups{grid-template-columns:minmax(0,1fr);gap:36px}
  .home-website-group>.work-card,.media.website.selected-website{max-width:320px}
  .home-ads-grid{width:100%;max-width:416px}
}

/* Fixed artwork and a precisely registered, transparent lighting layer. */
body[data-page=home] #main{margin-top:0}
#home-hero{background:#000;min-height:calc(100svh - var(--header-height));isolation:isolate}
#home-hero:after{display:none}
#home-hero .hero-inner{min-height:calc(100svh - var(--header-height));display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);align-items:center;gap:clamp(24px,3vw,48px);padding-block:32px}
#home-hero .hero-copy{width:100%;max-width:760px;margin-left:0;min-width:0}
.hero-illustration{margin:0;min-width:0;width:100%;align-self:center}
.hero-art-frame{position:relative;width:100%;aspect-ratio:2/1;background:#000;overflow:hidden;isolation:isolate}
.hero-artwork{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:contain}
.copper-lighting{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
.hero-art-frame,.hero-artwork,.copper-lighting{transform:none!important;animation:none!important;transition:none!important}
.hero-animation-controls{display:flex;justify-content:flex-end;min-height:36px;padding-top:8px}
.hero-motion-toggle{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:3px 8px;border:1px solid var(--line);border-radius:5px;background:transparent;color:var(--muted);font-size:11px;line-height:1.4}
.hero-motion-toggle[hidden]{display:none}
.hero-motion-toggle:hover{border-color:var(--accent);color:var(--accent)}
.hero-motion-toggle .icon{width:14px;height:14px}
.motion-play{display:none}
.hero-motion-toggle[aria-pressed=true] .motion-play{display:inline-flex}
.hero-motion-toggle[aria-pressed=true] .motion-pause{display:none}
.copper-lighting .light-trace,.copper-lighting .light-pulse{opacity:0;animation-duration:8s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused}
.copper-lighting .light-trace{stroke-dasharray:240 760;stroke-dashoffset:1000}
[data-lighting-state=running] .light-trace,[data-lighting-state=running] .light-pulse{animation-play-state:running}
.light-left-back{animation-name:copper-left-back}
.light-left-front{animation-name:copper-left-front}
.light-chevron-left-1{animation-name:copper-chevron-left-1}
.light-chevron-left-2{animation-name:copper-chevron-left-2}
.light-logo{animation-name:copper-logo}
.light-chevron-right-1{animation-name:copper-chevron-right-1}
.light-chevron-right-2{animation-name:copper-chevron-right-2}
.light-landscape{animation-name:copper-landscape}
.light-portrait{animation-name:copper-portrait}
.light-right-back{animation-name:copper-right-back}
.light-right-front{animation-name:copper-right-front}
@keyframes copper-left-back{0%{opacity:0;stroke-dashoffset:1000}3%{opacity:.95}13%{opacity:.95;stroke-dashoffset:0}17%{opacity:0;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:1000}}
@keyframes copper-left-front{0%,9%{opacity:0;stroke-dashoffset:1000}12%{opacity:.95}24%{opacity:.95;stroke-dashoffset:0}27%{opacity:0;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:1000}}
@keyframes copper-chevron-left-1{0%,23%{opacity:0}27%{opacity:.88}32%{opacity:0}100%{opacity:0}}
@keyframes copper-chevron-left-2{0%,27%{opacity:0}31%{opacity:.88}36%{opacity:0}100%{opacity:0}}
@keyframes copper-logo{0%,29%{opacity:0}35%{opacity:.8}41%{opacity:.3}47%,100%{opacity:0}}
@keyframes copper-chevron-right-1{0%,37%{opacity:0}40%{opacity:.88}44%{opacity:0}100%{opacity:0}}
@keyframes copper-chevron-right-2{0%,40%{opacity:0}43%{opacity:.88}47%{opacity:0}100%{opacity:0}}
@keyframes copper-landscape{0%,43%{opacity:0;stroke-dashoffset:1000}45%{opacity:.95}52.5%{opacity:.95;stroke-dashoffset:0}55%{opacity:0;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:1000}}
@keyframes copper-portrait{0%,52%{opacity:0;stroke-dashoffset:1000}54%{opacity:.95}65%{opacity:.95;stroke-dashoffset:0}68%{opacity:0;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:1000}}
@keyframes copper-right-back{0%,64%{opacity:0;stroke-dashoffset:1000}67%{opacity:.95}77%{opacity:.95;stroke-dashoffset:0}85%{opacity:0;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:1000}}
@keyframes copper-right-front{0%,74%{opacity:0;stroke-dashoffset:1000}77%{opacity:.95}88%{opacity:.85;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:1000}}
[data-theme=light] #home-hero{background:var(--bg)}
[data-theme=light] .hero-art-frame{border-radius:8px}
#services .section-heading{display:block;text-align:center}
#services .section-intro{max-width:none;margin-inline:auto}
@media(max-width:1000px){
  #home-hero .hero-inner{grid-template-columns:minmax(0,1fr);gap:16px;padding-block:32px}
  #home-hero .hero-copy{width:100%;max-width:760px;margin-left:0}
  .hero-illustration{max-width:900px}
}
@media(max-width:760px){#home-hero .hero-inner{padding-block:24px;gap:16px}}
@media(prefers-reduced-motion:reduce){.copper-lighting,.hero-motion-toggle{display:none!important}}

/* Permanent desktop enlargement: preserve copy width and enlarge the shared
   image/overlay frame by approximately 25%, using previously empty margins. */
@media(min-width:1001px){
  #home-hero .hero-inner{width:min(1900px,calc(100% - 48px));grid-template-columns:minmax(0,min(724px,36.9vw)) minmax(0,1fr);gap:24px}
}
.copper-lighting .light-pulse:not(.light-logo){fill:#FFAC58;fill-opacity:.18}

/* Add breathing room to the complete desktop copy group without moving art. */
@media(min-width:1001px){#home-hero .hero-copy{padding-left:28px}}

/* Permit only the lighting's paint to extend beyond the artwork's black edge.
   No frame dimensions, transforms, or layout positions change. */
.hero-art-frame,.copper-lighting{overflow:visible}
.hero-artwork{border-radius:inherit}

/* Service cards: compact heading rows, readable lists, and one subtle border light. */
#services .services-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
#services .service{position:relative;display:flex;flex-direction:column;min-width:0;padding:28px;overflow:visible}
#services .service:hover{transform:none;border-color:var(--line);box-shadow:none}
#services .service-heading{display:flex;align-items:center;gap:10px;min-width:0;margin-bottom:16px}
#services .service-heading>.icon{width:26px;height:26px;flex:none;color:var(--accent)}
#services .service-heading>h3{margin:0;line-height:1.3;min-width:0}
#services .service-description{max-width:none;margin-bottom:22px;font-size:14px}
#services .service-list{list-style:none;padding:20px 0 0;margin:0 0 24px;border-top:1px solid var(--line);display:grid;gap:12px;font-size:14px;line-height:1.65}
#services .service-list>li{display:flex;align-items:flex-start;gap:10px;min-width:0}
#services .service-list>li>.icon{width:14px;height:14px;margin-top:5px;flex:none;color:var(--accent);stroke-width:1.6}
#services .service-list>li>div{min-width:0;overflow-wrap:break-word}
#services .service-list small{display:block;margin-top:4px;font-size:13px;line-height:1.6;color:var(--muted)}
#services .service-note{max-width:none;margin-top:auto;margin-bottom:0;font-size:14px;line-height:1.75;color:var(--muted)}
#services .service-border{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);overflow:visible;pointer-events:none;color:var(--accent);opacity:0}
#services .service[data-border-ready=true] .service-border{opacity:1}
#services .service-border-trace{opacity:.22;stroke-dasharray:none;stroke-dashoffset:0;animation:service-border-pulse 4.5s ease-in-out infinite;animation-play-state:paused}
#services .service:nth-child(2) .service-border-trace{animation-delay:-.6s}
#services .service[data-border-ready=true][data-border-running=true] .service-border-trace{animation-play-state:running}
@keyframes service-border-pulse{0%,100%{opacity:.22}50%{opacity:.55}}
@media(max-width:760px){#services .services-grid{grid-template-columns:minmax(0,1fr)}#services .service{padding:24px}}
@media(prefers-reduced-motion:reduce){#services .service-border{display:none}#services .service-border-trace{animation:none!important}}

/* Keep both fixed image layers mounted and decoded. Only select a ready layer;
   the single lighting overlay stays mounted and retains its animation phase. */
.hero-artwork-light{position:absolute;inset:0;opacity:0}
.hero-artwork-dark{opacity:1}
[data-theme=light] .hero-art-frame:not([data-artwork-theme]) .hero-artwork-dark,
.hero-art-frame[data-artwork-theme=light] .hero-artwork-dark{opacity:0}
[data-theme=light] .hero-art-frame:not([data-artwork-theme]) .hero-artwork-light,
.hero-art-frame[data-artwork-theme=light] .hero-artwork-light{opacity:1}
[data-theme=light] .hero-art-frame{background:#fff}

/* Homepage shared selected-work action. */
.selected-work-actions{display:flex;justify-content:center;align-items:center;margin-top:24px;border-top:1px solid var(--line);padding-top:20px}
.selected-work-actions .button{min-height:44px;padding:9px 16px}
.process .section-heading{display:block;text-align:center}

/* Framed workflow cards: stationary content and a restrained full-border halo. */
.process{--process-border:rgba(234,164,119,.48);--process-halo:rgba(213,112,54,.12);--process-hover-halo:rgba(226,130,67,.26)}
[data-theme=light] .process{--process-border:rgba(183,69,18,.48);--process-halo:rgba(183,69,18,.07);--process-hover-halo:rgba(183,69,18,.16)}
.process .process-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;align-items:stretch}
.process .process-grid>li{display:flex;flex-direction:column;gap:0;align-items:stretch;min-width:0;padding:22px;border:1px solid var(--process-border);border-radius:12px;background:var(--card);box-shadow:0 0 8px var(--process-halo);transform:none;transition:border-color .28s ease,box-shadow .28s ease,background-color .3s ease,color .3s ease}
.process .process-grid>li::before{content:none;display:none}
.process .process-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.process .process-number{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--process-border);border-radius:7px;color:var(--accent);font-size:11px;font-weight:600;line-height:1}
.process .process-card-top>.icon{width:24px;height:24px;color:var(--accent);flex:none}
.process .process-grid h3{font-size:17px;margin:0 0 10px}
.process .process-grid p{max-width:none;font-size:14px;line-height:1.75;overflow-wrap:break-word}
@media(max-width:1100px) and (min-width:761px){.process .process-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.process .process-grid{grid-template-columns:minmax(0,1fr);gap:16px}.process .process-grid>li{padding:24px}}
@media(hover:hover) and (pointer:fine){.process .process-grid>li:hover{border-color:var(--accent);box-shadow:0 0 14px var(--process-hover-halo),inset 0 0 4px var(--process-halo);transform:none}}
@media(prefers-reduced-motion:reduce){.process .process-grid>li{transition:none}}

/* Our Work social profiles: theme-button sized circles with no hover movement. */
.work-social{--social-highlight:#ffc49c}
[data-theme=light] .work-social{--social-highlight:#963609}
.work-social-links{display:flex;align-items:center;gap:12px;flex:none;max-width:100%;padding:0}
.work-social-link{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;min-height:44px;padding:0;border:1px solid var(--accent);border-radius:50%;background:transparent;color:var(--accent);transform:none;transition:color .25s ease,border-color .25s ease}
.work-social-link .platform-icon{display:block;width:20px;height:20px;flex:none}
.work-social-link:focus-visible{outline:3px solid var(--focus);outline-offset:5px;color:var(--social-highlight);border-color:var(--social-highlight)}
.social-tooltip{position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);z-index:2;padding:4px 8px;border:1px solid var(--line);border-radius:4px;background:var(--card);color:var(--text);font-size:11px;line-height:1.4;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.work-social-link:focus-visible .social-tooltip{opacity:1;visibility:visible}
@media(hover:hover) and (pointer:fine){.work-social-link:hover{color:var(--social-highlight);border-color:var(--social-highlight);transform:none}.work-social-link:hover .social-tooltip{opacity:1;visibility:visible}}
@media(max-width:760px){.work-social-links{margin-top:24px}}
@media(prefers-reduced-motion:reduce){.work-social-link,.social-tooltip{transition:none}}

/* Reduce only the homepage selected-work bottom space by 60%. */
[data-page=home] .work-band>.section{padding-bottom:32px}
@media(max-width:1000px){[data-page=home] .work-band>.section{padding-bottom:26px}}
@media(max-width:480px){[data-page=home] .work-band>.section{padding-bottom:19.2px}}

/* Contact actions: compact work button and stationary Instagram enquiry card. */
.contact-copy .work-button{min-height:44px;padding:9px 16px}
.contact-options .contact-option{display:block;transform:none;transition:background-color .3s ease,color .3s ease,border-color .28s ease,box-shadow .28s ease}
.contact-options .contact-option p{margin-bottom:0}
.contact-options .contact-option:not(a):hover{transform:none;border-color:var(--line);box-shadow:none;cursor:default}
.contact-options .contact-instagram{border-color:rgba(234,164,119,.48);box-shadow:0 0 8px rgba(213,112,54,.1)}
[data-theme=light] .contact-options .contact-instagram{border-color:rgba(183,69,18,.48);box-shadow:0 0 8px rgba(183,69,18,.07)}
.contact-options .contact-instagram:focus-visible{outline:3px solid var(--focus);outline-offset:5px;border-color:var(--accent);box-shadow:0 0 14px rgba(226,130,67,.22);transform:none}
@media(hover:hover) and (pointer:fine){.contact-options .contact-instagram:hover{border-color:var(--accent);box-shadow:0 0 14px rgba(226,130,67,.22);transform:none}[data-theme=light] .contact-options .contact-instagram:hover{box-shadow:0 0 14px rgba(183,69,18,.14)}}

/* Shared footer: brand, navigation, social profiles, and contact details. */
.footer{--social-highlight:#ffc49c}
[data-theme=light] .footer{--social-highlight:#963609}
.footer .footer-top{grid-template-columns:minmax(0,1.2fr) minmax(0,.7fr) minmax(268px,1.1fr) minmax(0,.8fr);gap:32px}
.footer nav{font-size:14.4px}
.footer-social h3,.footer-contact h3{font-size:14px;line-height:1.6;font-weight:600;letter-spacing:0;margin:0 0 16px;color:var(--text)}
.footer .work-social-links{margin:0;gap:12px;padding-bottom:20px}
.footer .work-social-link:focus-visible{color:var(--social-highlight);border-color:var(--social-highlight)}
.footer-email{display:flex;flex-direction:column;margin-top:18px;font-size:14px;color:var(--muted);line-height:1.6}
.footer-email-space{display:block;min-height:24px}
@media(hover:hover) and (pointer:fine){.footer .work-social-link:hover{color:var(--social-highlight);border-color:var(--social-highlight);transform:none}}
@media(max-width:1000px){.footer .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}}
@media(max-width:620px){.footer .footer-top{grid-template-columns:minmax(0,1fr);gap:28px}.footer .footer-top>div:first-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.contact-options .contact-option{transition:none}}

/* Keep the approved header logo independent of theme/reveal animation state. */
.header,.header .brand,.header .brand img{opacity:1;visibility:visible;animation:none;transform:none}
.hero-artwork-static{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:contain}
body[data-page=contact]>.footer{border-top:1px solid var(--line)}

/* Real ad facades: compact ratio-preserving thumbnails, no player until click. */
.youtube-preview{min-width:0}
.youtube-media{background:#000}
.youtube-thumbnail{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.youtube-play{display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;padding:0;border:1px solid #eba16f;border-radius:50%;color:#fff6e8;background:rgba(164,72,36,.94);cursor:pointer;transition:background-color .2s,border-color .2s}
.youtube-play[hidden]{display:none}
.youtube-play:hover{background:#c54e14;border-color:#ffc49c}
.youtube-fallback{display:inline-block;margin-top:9px;font-size:12px;line-height:1.5;color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.youtube-stage{position:relative;width:100%;aspect-ratio:16/9;min-height:200px;background:#000;margin-inline:auto}
.youtube-stage.portrait{width:clamp(200px,calc((100dvh - 210px)*.5625),320px);max-width:100%;aspect-ratio:9/16}
.youtube-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.youtube-player-fallback{font-size:13px;color:var(--muted);line-height:1.6;margin:14px 0 0}
.youtube-player-fallback a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
@media(prefers-reduced-motion:reduce){.youtube-play{transition:none}}

/* Supplied email: selectable address and an independent copy control. */
.email-control{position:relative;min-width:0}
.email-address-box{display:flex;align-items:center;gap:8px;min-width:0;min-height:44px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.email-address{flex:1;min-width:0;font-size:13px;line-height:1.5;overflow-wrap:anywhere;color:var(--text);user-select:text}
.email-copy{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;padding:6px;border:1px solid var(--accent);border-radius:6px;background:transparent;color:var(--accent);transition:background-color .2s,border-color .2s}
.email-copy[hidden]{display:none}
.email-copy:hover{background:var(--bg)}
.email-copy .icon{display:block;width:18px;height:18px}
.email-copy .copy-check{display:none}
[data-copy-state=copied] .copy-symbol{display:none}
[data-copy-state=copied] .copy-check{display:inline-flex}
.email-copy-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
[data-copy-state=error] .email-copy-status{position:static;display:block;width:auto;height:auto;margin:8px 0 0;overflow:visible;clip-path:none;white-space:normal;font-size:12px;line-height:1.5;color:var(--accent)}
.footer .footer-top{grid-template-columns:minmax(0,1.1fr) minmax(0,.55fr) minmax(268px,1fr) minmax(312px,1.25fr)}
.footer-email{margin-top:10px}
.footer-email-control{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:10px;padding-bottom:20px}
.footer-email-control .email-copy-status{grid-column:1/-1}
.contact-options .contact-email{position:relative;border-color:rgba(234,164,119,.48);box-shadow:0 0 8px rgba(213,112,54,.1)}
[data-theme=light] .contact-options .contact-email{border-color:rgba(183,69,18,.48);box-shadow:0 0 8px rgba(183,69,18,.07)}
.email-card-content{display:block}
.email-card-content>.icon{color:var(--accent);width:25px;height:25px;margin-bottom:18px}
.contact-email .email-control{position:relative;z-index:1;margin-top:20px}
.contact-options .contact-option.contact-email:focus-within{border-color:var(--accent);box-shadow:0 0 14px rgba(226,130,67,.22);transform:none}
@media(hover:hover) and (pointer:fine){.contact-options .contact-option.contact-email:hover{border-color:var(--accent);box-shadow:0 0 14px rgba(226,130,67,.22);transform:none}[data-theme=light] .contact-options .contact-option.contact-email:hover{box-shadow:0 0 14px rgba(183,69,18,.14)}}
@media(max-width:1100px){.footer .footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.footer .footer-top{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.email-copy{transition:none}}

.email-circle,.contact-email{cursor:default}
.footer-instagram-handle{min-width:0;font-size:13px;line-height:1.5;color:var(--text);overflow-wrap:anywhere}

/* Supplied full website thumbnails stay uncropped and inactive until linked. */
.media.website.website-preview-ready{aspect-ratio:auto;display:block;max-width:100%;background:var(--card)}
.website-preview-ready img{display:block;width:100%;height:auto;object-fit:contain}
@media(hover:hover) and (pointer:fine){.website-preview-ready:hover{border-color:var(--accent);box-shadow:0 0 12px rgba(197,78,20,.18)}}
.hero-art-frame[data-artwork-ready=false] .copper-lighting{visibility:hidden}

/* Fit intrinsic content to the viewport; contain only exterior lighting paint. */
html{overflow-x:clip}
body{min-width:0}
.home-website-group>.work-card,.home-website-group .media.website.selected-website{width:100%;max-width:none}
.home-work-groups{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.footer-contact>.work-social-links{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px}
.instagram-control{width:100%;min-width:0}
.footer .brand{min-width:0;max-width:100%}
.footer .brand span{min-width:0;overflow-wrap:anywhere}
@media(max-width:1000px){
 #home-hero .hero-inner{min-height:0;align-content:start;row-gap:12px}
 #home-hero .hero-copy{padding-bottom:0}
 .hero-illustration{align-self:start}
 .home-ads-grid{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
}
@media(max-width:760px){
 .home-work-groups{grid-template-columns:minmax(0,1fr)}
 #home-hero{min-height:0}
 #home-hero .hero-inner{row-gap:12px}
 .home-website-group>.work-card{max-width:540px}
 .work-social-links{flex-wrap:wrap}
}

/* Homepage work introduction uses the whole row with centered text. */
[data-page=home] .work-band .section-heading{display:block;text-align:center}
[data-page=home] .work-band .section-intro{max-width:none;margin-inline:auto}
.contact-options .contact-instagram{position:relative;cursor:pointer}
.contact-instagram-card-link{position:absolute;inset:0;border-radius:inherit;z-index:1}
.contact-instagram-copy{margin-top:20px}
.contact-instagram-copy .email-copy{position:relative;z-index:2}
.contact-options .contact-instagram:focus-within{outline:3px solid var(--focus);outline-offset:5px;border-color:var(--accent);box-shadow:0 0 14px rgba(226,130,67,.22)}
.contact-options .contact-option.contact-instagram:hover{border-color:var(--accent);box-shadow:0 0 14px rgba(226,130,67,.22);cursor:pointer}
.website-preview-ready:focus-visible{outline:3px solid var(--focus);outline-offset:5px}

/* Softer light surfaces; dark mode and the approved layout are unchanged. */
:root[data-theme=light]{--bg:#f8f7f5;--card:#fff;--band:#f3f2ef;--header:rgba(248,247,245,.98);--line:#dedbd6;--media-gradient:linear-gradient(135deg,#fff4eb,#fff 70%);--invitation-gradient:linear-gradient(120deg,#f9eee5,#f8f7f5 75%)}
[data-theme=light] .hero-art-frame{background:var(--bg)}
/* Blend the image's white paper into the surrounding surface, without changing
   its source, dimensions or the separately rendered lighting layer. */
[data-theme=light] .hero-artwork-light{mix-blend-mode:multiply}
