/* MOBILE-FIRST REFINEMENT — compact sections, deliberate contrast, clear actions. */
:root{--pale:#edf5f6;--line:#d5e3e6}
.section{padding-block:76px}.eyebrow{font-size:.75rem;letter-spacing:.12em;margin-bottom:15px}
.hero{padding-block:64px 60px}.hero-description{font-size:1.0625rem;line-height:1.65}
.section-heading{margin-bottom:30px}.section-heading h2{font-size:clamp(2rem,4vw,3.2rem)}
.section-heading .text-link{flex-shrink:0}.button{border-radius:8px}
.work-section{background:var(--pale)}.home-work{border-block:1px solid var(--line)}
.project-stage{padding:30px 24px 20px;border-radius:12px}.project-info{padding:18px 0 0}
.project-info h3{font-size:1.4rem;margin-bottom:8px}.project-info>p{line-height:1.55;margin-bottom:10px}
.project-open{display:none}.project-meta{margin-bottom:8px}.project-info .text-link{font-size:.875rem}
.carousel-tools,.mobile-all-work{display:none}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.feature-card{padding:24px;border:1px solid var(--line);border-radius:12px;background:#f5f9fa}
.feature-card:nth-child(2){background:#102a43;color:white;border-color:#102a43}
.feature-card:nth-child(2) p{color:#cad9e1}.feature-card:nth-child(2) .feature-icon{color:#82e4dd}
.feature-icon{font-size:1.35rem;color:var(--teal);display:block;margin-bottom:22px}
.feature-card h3{font-size:1.2rem;letter-spacing:-.03em;margin-bottom:10px;line-height:1.2}
.feature-card p{font-size:.9375rem;line-height:1.55;margin:0}
.brand-moment{padding-block:58px}.brand-moment h2{font-size:clamp(2rem,4vw,3.3rem)}
.brand-art{max-height:260px}.brand-art-caption{font-size:.75rem}
.process-grid{gap:18px}.process-grid li{border:1px solid var(--line);border-top:3px solid var(--teal);padding:22px;border-radius:0 0 10px 10px}
.process-grid h3{font-size:1.2rem;margin:15px 0 9px}.process-grid p{line-height:1.5}
.founder-section{background:#e7f2f2;padding-block:50px}
.founder-inner{gap:50px;align-items:center}.founder-inner h2{font-size:clamp(2rem,4vw,3.2rem)}
.founder-statement{font-size:1.3rem;line-height:1.45;margin-bottom:20px}
.founder-signature{margin-bottom:12px}.founder-signature small{font-size:.8125rem}
.faq-layout{gap:60px}summary{padding-block:18px}details p{padding-bottom:18px}
.closing-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:40px;background:var(--navy);color:#fff;border-radius:16px;margin-bottom:56px}
.closing-cta .eyebrow{color:#82e4dd}.closing-cta h2{font-size:clamp(1.8rem,3vw,2.6rem);margin:0}
.closing-cta .button{flex-shrink:0}
.site-footer{padding-top:0}.footer-top{padding-block:15px 30px}.footer-links{display:flex;gap:24px}.footer-links a{min-height:44px;display:flex;align-items:center;font-size:.875rem}
.contact-dock{display:none}
/* About: editorial opening with a strong studio panel rather than empty space. */
.about-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center;padding-block:64px}
.about-hero h1,.portfolio-intro h1{font-size:clamp(3rem,5.5vw,4.75rem);line-height:1.03;margin-bottom:24px}
.about-hero p{max-width:550px}.page-lead{font-size:1.2rem;color:var(--navy);font-weight:600}
.studio-panel{background:var(--navy);color:white;border-radius:16px;padding:38px}
.studio-panel>.eyebrow{color:#91dcd7;display:block}
.studio-statement{font-size:clamp(2.4rem,4vw,3.5rem);line-height:1.14;letter-spacing:-.055em;color:white;font-weight:600;margin:30px 0}
.studio-statement em{color:#82e4dd}.studio-signoff{border-top:1px solid #ffffff30;padding-top:22px;display:flex;align-items:center;gap:12px}
.studio-signoff .initial-avatar{background:#ffffff17}.studio-signoff small{display:block;font-size:.8125rem;color:#bed0dc}
.story-section{background:var(--pale)}.story-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:60px}.story-grid p:last-child{margin-bottom:0}
.collaboration-panel{padding:36px;background:#e7f2f2;border-radius:16px;display:grid;grid-template-columns:1fr 1.2fr;gap:35px;margin-bottom:56px}
.collaboration-panel h2{font-size:2.3rem}.commitment-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.commitment-grid h3{font-size:1.1rem;margin-bottom:8px}.commitment-grid p{font-size:.9375rem;margin:0;line-height:1.55}
/* Portfolio: two columns, including mobile. */
.portfolio-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;padding-block:54px 40px}
.portfolio-intro h1{margin:0}.portfolio-intro>p{max-width:310px;margin:0}
.portfolio-work{padding-block:40px 48px}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.demo-note{font-size:.8125rem;margin:25px 0 0;max-width:650px}.portfolio-page .closing-cta{margin-top:48px}
/* Contact: one compact heading, business details, and the actual form. */
.contact-heading{padding-block:42px 28px}.contact-heading h1{font-size:clamp(2.6rem,5vw,4rem);margin:0 0 14px}.contact-heading p:last-child{margin:0}
.contact-layout{display:grid;grid-template-columns:.85fr 1.2fr;gap:26px;align-items:stretch;margin-bottom:60px}
.contact-aside{background:var(--navy);color:white;border-radius:14px;padding:32px;display:flex;flex-direction:column}
.contact-aside .eyebrow{color:#82e4dd}.contact-aside h2{font-size:2.6rem}.contact-aside p{color:#c6d7e0}
.contact-aside .contact-details{margin:10px 0 30px;font-size:.9375rem}.contact-aside .contact-details a{font-size:.9375rem}
.contact-person{display:flex;align-items:center;gap:12px;margin-top:auto;font-size:.875rem}.contact-person .initial-avatar{background:#ffffff1c}
.contact-form{border:1px solid var(--line);border-radius:14px;padding:28px;background:#f6f9fa}
.contact-form label{font-size:.875rem}.contact-form input,.contact-form textarea{margin-bottom:15px}
.contact-form .button{width:100%}.privacy-note{font-size:.75rem}
.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.custom-logo{width:190px;aspect-ratio:4/1;display:flex;align-items:center}
.custom-logo img{position:static;width:auto;max-width:100%;max-height:100%;object-fit:contain}
.custom-mark{filter:none;mix-blend-mode:normal}.custom-mark img{position:static;width:100%;height:100%;object-fit:contain}
.config-notice{padding:16px;border:1px solid #bd653c;background:#fff6ef}
@media(max-width:1050px){.about-hero{gap:32px}.feature-card{padding:20px}.contact-layout{grid-template-columns:.8fr 1.2fr}.contact-aside{padding:24px}.contact-aside h2{font-size:2rem}}
@media(max-width:800px){
 body{padding-bottom:calc(80px + env(safe-area-inset-bottom))}.container{width:calc(100% - 40px)}
 .header-inner{min-height:70px}.site-header nav{top:70px}.logo-window{width:155px}
 .section{padding-block:40px}.eyebrow{font-size:.75rem;letter-spacing:.09em;margin-bottom:12px}
 .desktop-only{display:none!important}.hero{display:block;padding-block:36px 34px}
 .hero h1{font-size:clamp(2.8rem,11.5vw,4.3rem);line-height:1.02;margin-bottom:18px}
 .hero-description{font-size:1rem;line-height:1.6;margin-bottom:22px}.hero-actions .button{width:auto;min-height:50px;padding-inline:18px}
 .section-heading{display:flex;align-items:flex-end;gap:14px;margin-bottom:24px}.section-heading h2{font-size:1.9rem}
 .section-heading .text-link{font-size:.8125rem;gap:4px;white-space:nowrap}
 .home-work .container{width:100%;padding-left:20px}.home-work .section-heading{padding-right:20px}
 .home-work .carousel{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:0;padding:0 20px 8px 0;scrollbar-width:none;overscroll-behavior-x:contain}
 .carousel::-webkit-scrollbar{display:none}.carousel .project-card{flex:0 0 86%;scroll-snap-align:start}
 .carousel .project-stage{padding:25px 19px 17px}.carousel .project-info h3{font-size:1.2rem}.carousel .project-info>p{font-size:.875rem;line-height:1.45}
 .carousel .project-meta{font-size:.75rem;gap:4px}.carousel .project-info{padding-top:14px}
 .carousel-tools{display:flex;align-items:center;gap:25px;padding-right:20px;margin-top:16px}
 .carousel-progress{height:3px;background:#c8dbdf;flex:1;overflow:hidden;border-radius:2px}.carousel-progress span{height:100%;display:block;background:var(--teal);width:50%}
 .carousel-buttons{display:flex;gap:10px;align-items:center}.carousel-buttons button{width:44px;height:44px;border:1px solid #bdcfd4;background:white;color:var(--navy);border-radius:50%;font-size:1.2rem}
 .carousel-buttons button:disabled{opacity:.4;cursor:default}.carousel-buttons span{font-size:.8125rem;min-width:28px}
 .mobile-all-work{display:inline-flex;margin-top:10px;font-size:.875rem}
 .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.feature-card{padding:18px 15px}
 .feature-icon{margin-bottom:14px}.feature-card h3{font-size:1.0625rem;margin-bottom:8px}.feature-card p{font-size:.875rem;line-height:1.45}
 .brand-moment{padding-block:36px}.brand-moment-inner{gap:12px}.brand-moment h2{font-size:2rem;margin-bottom:15px}.brand-moment p{font-size:.9375rem}
 .brand-art{max-width:280px;aspect-ratio:2.15}.floating-mark{width:52%}.brand-art-caption{font-size:.75rem;letter-spacing:.15em}
 .process-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.process-grid li{padding:16px 13px}.process-grid span{font-size:.75rem;letter-spacing:.04em}.process-grid h3{font-size:1.05rem;margin:12px 0 8px}.process-grid p{font-size:.875rem;line-height:1.4}
 .process-section .section-heading{align-items:flex-start}.process-section .section-heading>.text-link{display:none}
 .founder-section{padding-block:34px}.founder-inner{gap:12px}.founder-inner h2{font-size:2rem;margin-bottom:12px}.founder-statement{font-size:1.1rem;margin-bottom:15px}
 .faq-layout{gap:8px}.faq-layout h2 br{display:none}.faq-layout h2{font-size:1.9rem;margin-bottom:10px}summary{font-size:.9375rem;padding-block:16px}details p{font-size:.875rem}
 .closing-cta{padding:25px;display:block;border-radius:12px;margin-bottom:34px}.closing-cta h2{font-size:1.8rem;margin-bottom:22px}.closing-cta .eyebrow{font-size:.75rem}
 .footer-top{gap:16px;display:grid;grid-template-columns:1fr 1fr;padding-bottom:16px}.footer-top p{font-size:.8125rem}.footer-links{grid-column:1/-1;justify-content:space-between;gap:10px}.footer-bottom{padding-block:14px;font-size:.75rem}
 .contact-dock{display:flex;position:fixed;bottom:0;left:0;right:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#ffffffed;border-top:1px solid var(--line);box-shadow:0 -4px 20px #102a430d;gap:8px;z-index:30}
 .contact-dock a{display:flex;justify-content:center;align-items:center;min-height:48px;border-radius:7px;font-size:.875rem;font-weight:600;padding:10px 14px;background:#edf5f6}
 .contact-dock .dock-primary{flex:1;background:var(--teal);color:white;gap:20px}.contact-page .contact-dock{display:none}.contact-page{padding-bottom:0}
 .about-hero{grid-template-columns:1fr;padding-block:34px;gap:24px}.about-hero h1{font-size:2.8rem;margin-bottom:18px}.about-hero p{font-size:.9375rem;line-height:1.6}.about-hero .page-lead{font-size:1.0625rem}
 .studio-panel{padding:25px;border-radius:12px}.studio-statement{font-size:2.8rem;margin:22px 0}.studio-signoff{padding-top:16px}
 .story-grid{grid-template-columns:1fr;gap:8px}.story-grid h2{font-size:2rem;margin-bottom:12px}.story-grid p{font-size:.9375rem}
 .collaboration-panel{grid-template-columns:1fr;padding:24px;gap:12px;margin-bottom:34px}.collaboration-panel h2{font-size:2rem;margin-bottom:12px}.commitment-grid{gap:20px 14px}.commitment-grid h3{font-size:1rem}.commitment-grid p{font-size:.875rem}
 .portfolio-intro{display:block;padding-block:32px 28px}.portfolio-intro h1{font-size:2.8rem;margin-bottom:18px}.portfolio-intro>p{font-size:.9375rem;max-width:350px}
 .portfolio-work{padding-block:26px}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
 .portfolio-grid .project-stage{padding:18px 10px 13px;border-radius:9px}.portfolio-grid .laptop{padding:3px 3px 5px;border-radius:4px}.portfolio-grid .phone{padding:2px;border-radius:6px}.portfolio-grid .phone .device-screen{border-radius:3px}.portfolio-grid .phone:before{display:none}
 .portfolio-grid .project-info{padding-top:12px}.portfolio-grid h3{font-size:1rem;line-height:1.2;margin-bottom:6px}.portfolio-grid .project-info>p{display:none}.portfolio-grid .project-meta{font-size:.75rem;gap:2px;line-height:1.4}.portfolio-grid .project-meta span+span:before{display:none}.portfolio-grid .project-meta span{display:block;width:100%}
 .portfolio-grid .text-link{font-size:.8125rem;min-height:44px}.portfolio-page .closing-cta{margin-top:32px}
 .contact-heading{padding-block:30px 24px}.contact-heading h1{font-size:2.8rem}.contact-heading p:last-child{font-size:.9375rem}
 .contact-layout{grid-template-columns:1fr;gap:16px;margin-bottom:35px}.contact-aside{padding:22px;border-radius:12px}.contact-aside h2{font-size:1.6rem;margin-bottom:10px}.contact-aside h2 br{display:none}.contact-aside>p:not(.eyebrow){display:none}.contact-aside .eyebrow{margin-bottom:10px}.contact-aside .contact-details{margin:5px 0 15px}.contact-aside .contact-details a{min-height:32px}.contact-person{font-size:.8125rem}
 .contact-form{padding:20px;order:0}.contact-aside{order:1}.form-row{grid-template-columns:1fr;gap:0}.contact-form input{min-height:46px}.contact-form textarea{min-height:100px}
 .custom-logo{width:155px}
}
@media(max-width:360px){.container{width:calc(100% - 32px)}.hero h1{font-size:2.65rem}.section-heading h2{font-size:1.7rem}.section-heading .text-link{font-size:.75rem}.feature-card{padding:15px 12px}.contact-dock a{padding-inline:10px}.footer-top{grid-template-columns:1fr}.footer-links{grid-column:auto}.portfolio-grid{gap:20px 10px}}
/* Enlarged text can wrap without forcing the viewport wider. */
body{overflow-wrap:anywhere}.section-heading{flex-wrap:wrap}.footer-links{flex-wrap:wrap}.footer-top>*{min-width:0}.site-header .brand{flex-shrink:1;min-width:0}.site-header .logo-window{max-width:100%}
@media(max-width:800px){.section-heading .text-link{white-space:normal}.footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:360px){.footer-top{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.carousel{scroll-behavior:auto}}