:root{--ink:#082647;--red:#015498;--pink:#ffffff;--yellow:#f2f5f9;--purple:#082647;--blue:#f2f5f9;--coral:#ffffff;--accent:#015498;--muted:#65788a}
body{background:#ffffff}.hero{background:#082647;color:#ffffff}.navigation{background:#fffffff0;border:1px solid #cecad3;border-radius:12px;box-shadow:0 4px 18px #14121a0d}.brand-icon{background:#082647;color:#ffffff}.nav-cta{background:#082647;color:#ffffff}.hero h1{color:#ffffff;text-shadow:1px 1px 0 #426180,2px 2px 0 #426180,3px 3px 0 #426180;letter-spacing:-5px}.hero .cursor{color:#91bee7}.hero .eyebrow{color:#94c4ee}.hero-description span,.full-name,.hero-bottom{color:#c4d2df}.hero .stats{border-color:#55515c}.stats span,.sample-note{color:#b8c9d9}.stats strong{color:#ffffff}.button,.hero-actions .button{border:1px solid #082647;border-radius:8px;box-shadow:0 4px 0 #082647;transition:transform .2s,box-shadow .2s}.pink,.hero-actions .pink{background:#015498;color:#fff;border-color:#015498;box-shadow:0 4px 0 #003e89}.hero .glass{background:transparent;color:#ffffff;border-color:#79737e;box-shadow:none}.button:hover,.hero-actions .button:hover{transform:translateY(-3px);box-shadow:0 7px 0 #003e89}.hero .glass:hover{box-shadow:none;background:#103555}.hero-art{padding:0 8px 12px}.portrait,.portrait:hover,.motion-paused .portrait,.motion-paused .portrait:hover{transform:none;border:1px solid #6c6574;border-radius:20px;background:#173753;box-shadow:9px 10px 0 #193e61;overflow:hidden}.portrait>img{filter:grayscale(1);opacity:.8;aspect-ratio:640/690;object-fit:cover}.portrait video{width:100%;aspect-ratio:640/690;object-fit:cover;display:block;background:#082647}.art-label{color:#fff;background:#082647d9;padding:5px 9px;border-radius:4px;font-size:9px;bottom:112px}.available{background:#e5eff8;color:#082647;border:1px solid #8f859c;box-shadow:none;border-radius:30px;font-size:9px;transform:none;left:-6px;top:20px}.available>span{background:#015498}.welcome{background:#ffffff;color:#082647;border:1px solid #aaa3b1;border-radius:10px;box-shadow:none}.play{background:#015498;color:#fff}.about,.contact{background:#ffffff}.work,.process{background:#f2f5f9}.services{background:#082647;border-block:0;color:#ffffff}.section h2,.work h2,.process h2,.contact h2,.services h2{color:#082647;text-shadow:none}.services h2{color:#ffffff}.about h2 .serif{color:#015498;text-shadow:none}.service-star{color:#4684bd;font-size:92px}.accordion{border-color:#66606e}.accordion-content>span{color:#91bee7}.project-card{border:1px solid #b8c7d5;box-shadow:0 5px 0 #d5dfe9;border-radius:14px;background:#ffffff}.project-card:hover{box-shadow:0 11px 20px #08264718}.thumbnail{border-bottom:1px solid #c5d2df;background:#e7edf3}.thumbnail img{filter:grayscale(.85)}.project-info{background:#ffffff}.circle-arrow,.project-card:nth-child(n) .circle-arrow{background:#e5eff8;border:1px solid #abc3db;color:#003e89;box-shadow:none}.category{color:#536b82}.project-info p{color:#536b82}.process-card,.process-card:nth-child(n){background:#ffffff;border:1px solid #becbd8;box-shadow:0 5px 0 #d5dfe9;rotate:0deg}.process-card b{color:#015498}.process-card>span{color:#536b82}.tools-banner{background:#082647;color:#c4d2df;border-block:1px solid #345470}.tools-banner button{background:#e5eff8;color:#082647;border:0}.contact-arrow{color:#015498}.contact-bottom a{border-color:#abc3db}footer{background:#f2f5f9;border-top:1px solid #c5d2df}.footer-brand-dot{color:#015498}.assistant p,.assistant-close{background:#ffffff;border:1px solid #91839f}.assistant{filter:drop-shadow(0 4px 6px #08264720)}#back-top{background:#e5eff8;border:1px solid #abc3db}.scroll-progress{background:#015498}dialog{background:#ffffff;border:1px solid #b8c7d5}.dialog-close{background:#e5eff8;border:1px solid #b8c7d5}input,select,textarea{background:#f7f9fc;border:1px solid #9db1c6}#project-gallery img{filter:grayscale(.85);border:1px solid #b8c7d5}.work-sculpture{width:260px;flex:0 0 260px;margin:-25px 15px -30px 20px;align-self:center;pointer-events:auto}.work-sculpture canvas{display:block;width:100%;height:auto;aspect-ratio:640/690}.section-heading{align-items:center}.section-aside{display:none}
@media(max-width:700px){.hero h1{letter-spacing:-3px}.portrait,.portrait:hover{box-shadow:6px 7px 0 #193e61}.work-sculpture{width:145px;flex-basis:145px;margin:-20px -15px -10px 0}.work .section-heading{gap:4px}.work .section-heading h2{font-size:35px}.work .section-heading>div:first-child{min-width:0;flex:1}.work .eyebrow{font-size:8px;letter-spacing:1.2px}.project-card,.project-card:hover{box-shadow:0 5px 0 #d5dfe9}.hero-art{width:90%}.available{font-size:8px;left:-10px;top:15px}.process-card{box-shadow:0 4px 0 #d5dfe9}.contact h2{text-shadow:none}.nav-links{background:#ffffff;border:1px solid #b8c7d5;box-shadow:0 5px 12px #08264718}}
@media(max-width:380px){.work-sculpture{width:110px;flex-basis:110px}.work .section-heading h2{font-size:31px}}

/* Supplied logo is displayed through a crop window; original pixels are preserved. */
.brand-logo{position:relative;display:block;width:210px;height:56px;overflow:hidden;background:#fff;border-radius:4px;flex-shrink:0}.brand-logo img{position:absolute;width:340px!important;height:340px!important;max-width:none;left:-65px;top:-140px}.navigation{background:#fffffff2}.hero .stats strong{color:#fff}.hero .stats{border-color:#46637f}.hero .button:focus-visible{outline-color:#9dcaf1}.hero h1{color:#fff}.hero .cursor{color:#91bee7}.portrait .art-label{background:#082647e8}.welcome{background:#fff}.services .accordion{border-color:#45627d}.assistant img{filter:hue-rotate(320deg) saturate(.8)}.footer-inner .brand-logo{border:1px solid #d7e0e9}.work-sculpture canvas{filter:none}@media(max-width:700px){.brand-logo{width:177px;height:49px}.brand-logo img{width:290px!important;height:290px!important;left:-55px;top:-119px}.navigation{padding:10px 13px}.nav-links{background:#fff}.hero h1{font-size:clamp(64px,14vw,86px)}}

/* Transparent logo and full-colour artwork — final clarity pass. */
.brand-logo,.footer-inner .brand-logo{width:220px;height:58px;background:transparent;border:0;border-radius:0;overflow:hidden}
.brand-logo img{width:250px!important;height:100px!important;left:-14px;top:-23px;object-fit:contain}
.portrait>img{filter:none;opacity:1}.portrait,.portrait:hover{background:#e5f1ff;border:2px solid #015498;box-shadow:9px 10px 0 #015498}
.thumbnail img,#project-gallery img{filter:none}.thumbnail{border-color:#b0c9e4}.project-card{border:2px solid #8eb2d9;box-shadow:0 5px 0 #b8d1eb}.project-card:hover{border-color:#015498;box-shadow:0 9px 0 #8eb2d9}.project-info{background:#fff}.project-info p{color:#304c69}.category{color:#015498}.work{background:#eaf3ff}.work h2{color:#082647}.process{background:#f3f8ff}.contact{background:#fff}.circle-arrow,.project-card:nth-child(n) .circle-arrow{background:#015498;color:#fff;border:1px solid #003e89}.hero .art-label{background:#082647;color:#fff}.welcome{background:#fff;border-color:#015498}.work-sculpture canvas{filter:none}.hero .available{background:#fff;border-color:#91b8df}.footer-inner{background:transparent}
@media(max-width:700px){.brand-logo,.footer-inner .brand-logo{width:180px;height:48px}.brand-logo img{width:205px!important;height:82px!important;left:-12px;top:-19px}.portrait,.portrait:hover{box-shadow:6px 7px 0 #015498}.project-card,.project-card:hover{box-shadow:0 5px 0 #b8d1eb}}

/* Restore gentle pointer tilt to the personal photo/video frame. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .portrait,.portrait:hover{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .2s ease,box-shadow .2s ease}
  .motion-paused .portrait,.motion-paused .portrait:hover{transform:none}
}

/* Keep the full contact address compact and aligned at every width. */
.contact-bottom{flex-wrap:wrap;gap:24px}
.contact-bottom>div{min-width:0;max-width:100%}
#contact-email{display:inline-block;max-width:100%;font-size:1rem;line-height:1.5;letter-spacing:-.025em;overflow-wrap:anywhere}


/* Responsive refinements: tablet, phone and touch input. */
@media(max-width:1100px){
.hero-grid>*,.about-grid>*,.service-grid>*,.project-grid>*{min-width:0}
input,select,textarea{font-size:1rem}
.dialog-close,#back-top,.tools-banner button{min-width:44px;min-height:44px}
}
@media(max-width:1100px) and (min-width:701px){
  .container{width:calc(100% - 64px)}
  .section{padding:80px 0}
  .hero{padding-top:150px}
  .hero-grid{grid-template-columns:1.1fr 1fr;gap:32px}
  .hero h1{font-size:clamp(48px,6.3vw,70px);letter-spacing:-3px;min-height:0}
  .hero-actions{flex-wrap:wrap}
  .stats{gap:16px}.stats strong{font-size:34px}
  .about-grid,.service-grid{gap:32px}
  .project-grid{gap:24px}
  .project-info{padding:22px 65px 24px 20px}
  .project-info h3{font-size:24px}
  .circle-arrow{right:15px;width:38px;height:38px}
  .work-sculpture{width:180px;flex-basis:180px;margin:0 0 0 16px}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .accordion h3 button{font-size:24px;gap:14px}
  .contact h2{font-size:clamp(64px,8vw,88px)}
  .footer-inner{flex-wrap:wrap}
}
@media(max-width:900px){
  .nav-wrap{inset:12px 0 auto;padding:0 16px}
  .navigation{min-height:68px;padding:8px 16px}
  .menu-toggle{display:block;border:1px solid #8eb2d9;background:#e5f1ff;border-radius:8px;width:44px;height:44px;font-size:23px;flex-shrink:0}
  .nav-links{display:none;position:absolute;top:82px;left:16px;right:16px;background:#fff;border:1px solid #b8c7d5;border-radius:13px;padding:16px;box-shadow:0 8px 22px #08264720;max-height:calc(100dvh - 110px);overflow-y:auto}
  .nav-links.open{display:flex;flex-direction:column;align-items:stretch;gap:6px}
  .nav-links>a{padding:12px;font-size:16px;min-height:48px}
  .nav-cta{justify-content:space-between}
}
@media(max-width:700px){
  .container{width:calc(100% - 40px)}
  .hero{padding-top:128px}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .hero h1{font-size:clamp(46px,11.5vw,72px);letter-spacing:-2.5px;min-height:0;line-height:1.1}
  .hero .eyebrow{font-size:11px;letter-spacing:1.2px}
  .full-name{font-size:11px;letter-spacing:.7px}
  .hero-actions{flex-wrap:wrap;gap:12px}
  .hero-actions .button{flex:1 1 140px;min-height:48px;gap:12px;padding:14px 16px}
  .stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .stats strong{font-size:32px}.stats span{font-size:12px;line-height:1.5}
  .sample-note,.concept-note{font-size:12px}
  .hero-art{width:100%;max-width:410px;padding:0 8px 10px}
  .available{left:0;font-size:10px;padding:8px 12px}
  .welcome{left:10px;right:10px;bottom:10px;padding:10px;gap:8px;font-size:14px}
  .play{flex:0 0 40px}.welcome small{font-size:11px}
  .art-label{left:12px;font-size:9px;letter-spacing:.7px}
  .hero-bottom{flex-wrap:wrap;font-size:10px;letter-spacing:.4px;gap:10px}
  .section{padding:60px 0}
  .section h2{font-size:clamp(36px,8.8vw,48px);letter-spacing:-1.8px}
  .work .section-heading{align-items:flex-start;gap:8px}
  .work .section-heading h2{font-size:clamp(32px,7.4vw,44px)}
  .work-sculpture{width:110px;flex-basis:110px;margin:0 -10px 0 0}
  .work .eyebrow,.eyebrow{font-size:11px;letter-spacing:1px}
  .project-grid{grid-template-columns:minmax(0,1fr);gap:26px}
  .project-info p,.process-card p{font-size:14px}
  .category{font-size:11px;letter-spacing:1px}
  .accordion h3 button{font-size:23px;min-height:64px;gap:14px}
  .accordion-content{padding-left:25px}
  .accordion-content>span{font-size:10px}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .process-card{padding:18px}.process-card h3{font-size:24px}
  .contact h2{font-size:clamp(48px,11vw,72px);padding-right:40px}
  .contact-arrow{font-size:1em;right:0}
  .contact-bottom{width:100%;gap:24px}
  .contact-bottom>.button{width:100%;min-height:48px}
  .footer-inner{align-items:flex-start;gap:24px;padding-bottom:70px}
  .footer-inner p{font-size:12px}
  .assistant{right:12px;bottom:max(12px,env(safe-area-inset-bottom))}
  .assistant p{display:none}
  .assistant-close{width:32px;height:32px;top:-15px;left:-12px}
  #back-top{right:20px;bottom:110px}
  dialog{padding:48px 20px 24px;width:calc(100% - 24px);max-height:calc(100dvh - 24px);overflow-y:auto}
  dialog h2{font-size:32px;letter-spacing:-1px}
  dialog .button{width:100%;gap:12px}
  form label{font-size:14px}
}
@media(max-width:380px){
  .container{width:calc(100% - 32px)}
  .process-grid{grid-template-columns:minmax(0,1fr)}
  .work .section-heading{flex-direction:column}
  .work-sculpture{align-self:flex-end;margin:-8px 0 0;width:120px;flex-basis:auto}
  .project-info h3{font-size:24px}
}
@media(max-width:1100px) and (hover:none),(max-width:1100px) and (pointer:coarse){
  .project-card,.project-card:hover,.portrait,.portrait:hover{transform:none}
  .project-card:hover img{transform:none}
}