/* Release layouts: the approved desktop composition stays unchanged above 850px. */
@media(max-width:850px){
 body[data-direction=cool] .site-header{inset:8px 12px auto;margin:0}
 body[data-direction=cool] .site-header .header-inner{height:60px}
 body[data-direction=cool] main [id]{scroll-margin-top:90px}
 [data-direction=cool] .welcome-scene{height:820px;min-height:0;max-height:none}
 [data-direction=cool] .laptop-welcome .welcome-art{left:12%;top:19%;width:83%;height:44%;transform:none}
 [data-direction=cool] .laptop-welcome .welcome-orbit{left:32%;top:27%;width:38vw;height:38vw;transform:none}
 [data-direction=cool] .welcome-brand-title{left:5%;bottom:24%;width:62%;transform:none}
 [data-direction=cool] .laptop-welcome .laptop-slogan{left:5%;top:110px;max-width:55%;font-size:30px}
 [data-direction=cool] .laptop-welcome .welcome-aside{top:110px;right:5%;font-size:12px}
 [data-direction=cool] .welcome-cross{font-size:28px;margin-bottom:10px}
 [data-direction=cool] .laptop-project{right:5%;bottom:9%;width:230px;padding:20px}
 [data-direction=cool] .welcome-bottom{left:5%;right:auto;bottom:50px;width:42%;display:block}
 [data-direction=cool] .welcome-bottom>a{display:inline-flex;margin-top:15px}
 [data-direction=cool] .cool-hero.direction-introduction{margin-top:0;padding-top:30px}
 [data-direction=cool] .direction-introduction h2#intro-title{font-size:clamp(38px,6.8vw,60px)}
 [data-direction=cool] .business-chapters{height:auto;display:block;margin-top:30px;border-radius:20px}
 [data-direction=cool] .business-chapters .color-chapter{width:100%;display:block;transition:none}
 [data-direction=cool] .business-chapters .chapter-toggle{position:relative;width:100%;min-height:66px;padding:18px 22px;flex-direction:row;justify-content:flex-start;gap:18px}
 [data-direction=cool] .business-chapters .chapter-name{writing-mode:horizontal-tb;transform:none;font-size:21px;white-space:normal;text-align:left}
 [data-direction=cool] .business-chapters .chapter-arrow{margin-left:auto}
 [data-direction=cool] .business-chapters .chapter-content{height:auto;min-width:0;padding:5px 22px 25px}
 [data-direction=cool] .business-example{grid-template-columns:1.2fr 1fr;gap:22px}
 [data-direction=cool] .business-example-label{margin-bottom:12px}
 [data-direction=cool] .business-example-copy h3{font-size:24px;margin-bottom:12px}
 [data-direction=cool] .business-example-copy>p:last-child{font-size:14px}
 [data-direction=cool] .why-site,[data-direction=cool] .starting{padding:35px 28px;margin-block:40px}
 [data-direction=cool] .first-impression{grid-template-columns:1fr;gap:20px}
 [data-direction=cool] .first-impression>p{font-size:32px;margin:0;padding-left:0;border:0}
 [data-direction=cool] .why-note{margin-left:0}
 [data-direction=cool] .work .section-head{display:block}
 [data-direction=cool] .work .section-intro{max-width:550px;margin-top:20px;padding-top:0}
 [data-direction=cool] .notary-catalog-card{gap:28px;padding:28px;margin-top:45px}
 [data-direction=cool] .catalog-copy h3{font-size:32px}
 [data-direction=cool] .process-image{min-height:0}
 [data-direction=cool] .subscription{padding:35px 28px;gap:25px;margin-top:40px}
 [data-direction=cool] .subscription h3{font-size:40px}
 [data-direction=cool] .subscription>p{font-size:16px}
 [data-direction=cool] .footer-identity .footer-signature{max-width:none}
 [data-direction=cool] .review-rail{display:none}
 body:not([data-direction]) .header{gap:16px}
 body:not([data-direction]) .header .desktop-nav{display:none}
 body:not([data-direction]) .header .menu-toggle{display:block;min-width:44px;min-height:44px}
 body:not([data-direction]) .subscription .text-link{min-width:0;width:100%}
}
@media(max-width:600px){
 [data-direction=cool] .welcome-scene{height:850px}
 [data-direction=cool] .laptop-welcome .laptop-slogan{top:515px;left:6%;max-width:90%;font-size:27px}
 [data-direction=cool] .laptop-welcome .welcome-art{left:0;top:105px;width:100%;height:300px}
 [data-direction=cool] .laptop-welcome .welcome-orbit{left:25%;top:180px;width:55vw;height:55vw}
 [data-direction=cool] .welcome-brand-title{left:6%;top:405px;bottom:auto;width:88%}
 [data-direction=cool] .laptop-welcome .welcome-aside{left:6%;right:auto;top:90px;font-size:11px;line-height:1.4}
 [data-direction=cool] .welcome-aside .welcome-cross{display:none}
 [data-direction=cool] .welcome-aside br{display:initial}
 [data-direction=cool] .laptop-project{left:6%;right:6%;bottom:94px;width:auto;padding:17px 20px;gap:8px;transform:rotate(-2deg)}
 [data-direction=cool] .laptop-project strong{font-size:23px}
 [data-direction=cool] .laptop-project>span{font-size:11px}
 [data-direction=cool] .welcome-bottom{bottom:23px;left:6%;right:6%;width:auto;display:flex;gap:15px;padding:0;font-size:10px}
 [data-direction=cool] .welcome-bottom>a{margin:0;flex-shrink:0}
 [data-direction=cool] .welcome-bottom>p{font-size:10px;max-width:140px}
 [data-direction=cool] .welcome-scroll{gap:10px;font-size:10px;max-width:46%}
 [data-direction=cool] .welcome-scroll-icon{width:34px;height:34px;font-size:18px;flex-shrink:0}
 [data-direction=cool] .cool-hero .direction-action{flex-direction:column;gap:14px}
 [data-direction=cool] .cool-hero .direction-promise{text-align:center}
 [data-direction=cool] .business-example{grid-template-columns:1fr;gap:20px}
 [data-direction=cool] .business-example .direction-mockup{max-width:100%}
 [data-direction=cool] .hero-baseline{flex-wrap:wrap;gap:14px}
 [data-direction=cool] .why-site,[data-direction=cool] .starting{padding:30px 22px}
 [data-direction=cool] .work .section-head h2{font-size:38px}
 [data-direction=cool] .case-toolbar{flex-wrap:wrap;gap:15px}
 [data-direction=cool] .case-identity{flex-wrap:wrap;gap:5px 15px}
 [data-direction=cool] .case-identity strong{font-size:23px}
 [data-direction=cool] .range-control,[data-direction=cool] .case-lenses,[data-direction=cool] .case-meta{margin-inline:16px}
 [data-direction=cool] .range-control input{flex:1;min-width:90px}
 [data-direction=cool] .notary-catalog-card{grid-template-columns:1fr;padding:24px 20px;gap:20px}
 [data-direction=cool] .catalog-copy h3{font-size:34px;margin:14px 0}
 [data-direction=cool] .catalog-preview{padding:5px}
 [data-direction=cool] .subscription{grid-template-columns:1fr;padding:32px 24px}
 [data-direction=cool] .subscription>div{grid-row:auto}
 [data-direction=cool] .subscription .text-link{grid-column:auto;margin-top:0}
 [data-direction=cool] .intent-switch{flex-direction:column}
 [data-direction=cool] .faq h2{font-size:34px}
 [data-direction=cool] .faq-list summary{font-size:16px;gap:16px}
 [data-direction=cool] .footer-identity{width:min(100%,375px)}
 [data-direction=cool] .footer-identity .footer-signature{width:auto;font-size:7.455cqw}
 [data-direction=cool] .contact-form input,[data-direction=cool] .contact-form textarea,[data-direction=cool] .contact-form select{font-size:16px}
 body:not([data-direction]) .mix,body:not([data-direction]) .subscription{margin-inline:12px}
 body:not([data-direction]) .header-cta{font-size:11px;padding:10px 12px;gap:8px}
 body:not([data-direction]) .header .wordmark{width:100px}
 body:not([data-direction]) .preview-dialog{border-radius:0}
 body:not([data-direction]) .footer .footer-top{grid-template-columns:minmax(0,1fr)}
 body:not([data-direction]) .footer .footer-logo{width:min(100%,375px)}
 body:not([data-direction]) .contact-form input,body:not([data-direction]) .contact-form select{font-size:16px}
}
@media(max-width:1100px){
 .site-header .desktop-nav{display:none}
 .site-header .menu-toggle{display:flex;min-width:44px;min-height:44px;align-items:center;justify-content:center}
 body[data-direction=cool] .site-header .menu-toggle{flex-direction:column}
 body[data-direction=cool] .site-header .menu-toggle span{width:24px;flex-shrink:0}
 .release-language{white-space:nowrap;flex-shrink:0}
}
@media(max-width:600px){
 .site-header .header-cta{display:none}
 .site-header .header-actions{gap:16px}
 .release-language{font-size:12px}
}
