/* Public design tokens follow the home page's graphite glass cards. */
:root{--public-surface:rgba(26,27,27,.62);--public-border:1px solid rgba(255,255,255,.08);--public-radius:32px;--public-text:#f5f8f8;--public-muted:#b0bab7;--public-inset:inset 0 1px 0 rgba(255,255,255,.05);--public-control:rgba(255,255,255,.1)}
body{color:var(--public-text);font-family:Fixel,Arial,sans-serif}
main.page h1{font-size:clamp(32px,4vw,46px);line-height:1.1;letter-spacing:-.045em;font-weight:600}
main.page>.lead{color:var(--public-muted);font-size:14px;line-height:1.65}
body:not(.home-page) main.page{padding-top:48px}
main.page .card,main.page .review-card,main.page .empty,
main.page .pricing-panel .price-blocks,main.page .pricing-panel .price-summary,
body .site-footer{border:var(--public-border);border-radius:var(--public-radius);background:var(--public-surface);box-shadow:var(--public-inset);backdrop-filter:blur(40px) saturate(130%);-webkit-backdrop-filter:blur(40px) saturate(130%)}
main.page .empty{color:var(--public-muted)}
main.page .price-block{border-top:var(--public-border)}
main.page .price-discuss,main.page .details-arrow,main.page .details{border:var(--public-border);border-radius:16px;background:var(--public-control);color:var(--public-text);backdrop-filter:blur(8px)}
main.page .price-discuss:hover,main.page .details-arrow:hover,main.page .details:hover{background:rgba(255,255,255,.18);color:#fff}
main.page .price-reset{border:var(--public-border);border-radius:16px}
.pricing-panel .price-blocks input{border-radius:7px}
.home-page .installment-art{object-fit:cover;object-position:center}
.home-page .installment-card{background:#171b1c}
body .site-footer__links a{border-radius:12px}
@media(min-width:600px){
 body .site-footer__brand{gap:8px}
 body .site-footer__brand b{font-size:10px;letter-spacing:.04em}
 body .site-footer__brand small{display:none}
 body .site-footer__mark,body .site-footer__mark img{width:28px;height:28px;flex-basis:28px}
 body .site-footer__links{gap:0}
 body .site-footer__links a{padding:8px 6px;font-size:10px}
}
@media(max-width:599px){
 body:not(.home-page) main.page{padding-top:32px}
 .home-page .invite-list{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .home-page .invite-list .css-k02z6t{width:100%;max-width:none;min-width:0}
 .home-page .installment-art{object-fit:cover;object-position:60% center}
 body .site-footer{border-radius:24px}
}
/* Every public page uses the original compact home-page column. */
.pricing-panel .price-builder{grid-template-columns:minmax(0,1fr)}
.pricing-panel .price-summary{position:static}
.pricing-types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.pricing-type{font-size:13px;min-height:48px}
main.page .grid:not(.pricing-panels),main.page .reviews-grid{grid-template-columns:minmax(0,1fr)}

/* Shared interaction and readability fixes discovered during the public audit. */
body .contact-modal,body.home-page .contact-modal,body:has(.price-builder) .contact-modal{z-index:7000}
body .contact-dialog{box-sizing:border-box;max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain}
body .contact-close{cursor:pointer;min-width:40px;min-height:40px}
body .public-sidebar .contact-nav-button{flex:none;width:48px;height:48px;border-radius:16px;color:#dce2e1}
body .public-sidebar .contact-nav-button svg{width:20px;height:20px}
body .contact-close:focus-visible,body .contact-options a:focus-visible,body .contact-nav-button:focus-visible,body .site-footer a:focus-visible{outline:2px solid #fff;outline-offset:3px}
body .site-footer__meta,body .site-footer__brand small,body .site-footer a{color:#b0bab7}
main.page .lead,main.page .meta time,main.page .field label{color:#b0bab7}
main.page .form{grid-template-columns:minmax(0,1fr);gap:12px}
main.page .form .send{min-height:44px;margin-top:0}
main.page .hero .copy{max-width:calc(100% - 44px);left:22px;right:22px}
main.page h1,main.page h2,main.page .comment p,main.page .meta{overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){body .css-k02z6t,body .hero-copy,body .portfolio-link,body .css-2lxut8,body .card{animation:none!important;transition:none!important}}
main.page .article-grid{grid-template-columns:minmax(0,1fr)}
main.page .article-card,main.page .social,main.page .cta,main.page .faq details{border:var(--public-border);border-radius:var(--public-radius);background:var(--public-surface);box-shadow:var(--public-inset)}
body .name-modal{z-index:7000}body .name-dialog{max-height:calc(100dvh - 32px);overflow:auto}
main.project-demo>.back{position:static;display:inline-flex;min-height:44px;align-items:center;padding:10px 16px;background:var(--public-control);color:#fff;border:var(--public-border);border-radius:16px}
main.project-demo>.hero{min-height:420px;height:clamp(420px,65svh,560px);padding:24px;border-radius:32px;margin-top:16px}
main.project-demo .copy{width:100%;max-width:100%}
main.project-demo .copy h1{font-family:Fixel,Arial,sans-serif;max-width:100%}

/* The footer is one component, including on the home page. */
html body:is(.home-page,:not(.home-page)) .public-scroll>.site-footer{padding:12px 18px;gap:12px;grid-template-columns:minmax(0,1fr) auto;border:var(--public-border);border-radius:32px;background:var(--public-surface);box-shadow:var(--public-inset);backdrop-filter:blur(40px) saturate(130%);-webkit-backdrop-filter:blur(40px) saturate(130%)}
.public-scroll .site-footer .site-footer__brand{gap:8px}
.public-scroll .site-footer .site-footer__brand b{font-size:10px;letter-spacing:.04em}
.public-scroll .site-footer .site-footer__brand small{display:none}
.public-scroll .site-footer .site-footer__mark,.public-scroll .site-footer .site-footer__mark img{width:28px;height:28px;flex-basis:28px}
.public-scroll .site-footer .site-footer__links{display:flex;flex-wrap:nowrap;gap:0}
.public-scroll .site-footer .site-footer__links a{padding:8px 6px;font-size:10px}
.public-scroll .site-footer .site-footer__meta{display:flex;flex-wrap:nowrap;padding-top:8px;gap:12px;font-size:9px;letter-spacing:.04em}
@media(min-width:600px) and (max-height:800px){.public-scroll .site-footer .site-footer__meta{padding-top:6px}}
@media(max-width:599px){
 html body:is(.home-page,:not(.home-page)) .public-scroll>.site-footer{padding:19px 17px;gap:17px;grid-template-columns:minmax(0,1fr);border-radius:24px}
 .public-scroll .site-footer .site-footer__brand{gap:11px}
 .public-scroll .site-footer .site-footer__brand b{font-size:11px;letter-spacing:.11em}
 .public-scroll .site-footer .site-footer__brand small{display:block}
 .public-scroll .site-footer .site-footer__mark,.public-scroll .site-footer .site-footer__mark img{width:38px;height:38px;flex-basis:38px}
 .public-scroll .site-footer .site-footer__links{display:grid;grid-template-columns:1fr 1fr;gap:5px}
 .public-scroll .site-footer .site-footer__links a{padding:9px 0;font-size:11px}
 .public-scroll .site-footer .site-footer__meta{flex-wrap:wrap;gap:10px 14px;padding-top:15px}
}
.portfolio-empty{grid-column:1/-1;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:40px 32px;border:var(--public-border);border-radius:32px;background:var(--public-surface);box-shadow:var(--public-inset);backdrop-filter:blur(40px);text-align:center}
.portfolio-empty::before{content:'';position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 50% 0,rgba(220,229,225,.1),transparent 65%);pointer-events:none}
.portfolio-empty-icon{width:84px;height:84px;display:grid;place-items:center;margin-bottom:22px;border:1px solid #ffffff14;border-radius:26px;background:linear-gradient(145deg,#414644,#1d211f);box-shadow:inset 0 1px 0 #ffffff20,0 12px 28px #0003}
.portfolio-empty-icon svg{width:54px;height:54px;stroke:#cdd5d1;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.portfolio-empty-label{color:#b0bab7;font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.portfolio-empty h2{font-size:26px;line-height:1.2;letter-spacing:-.035em;margin:12px 0}
.portfolio-empty p{max-width:360px;color:#b0bab7;font-size:13px;line-height:1.7;margin:0}
.portfolio-empty button{display:flex;align-items:center;justify-content:center;gap:24px;min-height:44px;margin-top:26px;padding:12px 18px;border:var(--public-border);border-radius:16px;background:var(--public-control);color:#fff;font:600 12px Fixel,Arial;cursor:pointer}
.portfolio-empty button:hover{background:#ffffff26}.portfolio-empty button:focus-visible{outline:2px solid #fff;outline-offset:4px}
@media(max-width:599px){.portfolio-empty{padding:32px 20px}.portfolio-empty h2{font-size:23px}}