/* Keep the service statement and its endline as one emphatic thought. */
.depth-hero{row-gap:10px}
.depth-hero .hero-foreground{padding-top:0}
.depth-hero .hero-backtype{margin-bottom:-8px}
.solution-intro{display:grid;grid-template-columns:1.12fr 1fr;gap:6%;align-items:center;padding-block:62px}
.solution-intro h2{font-size:clamp(44px,5.3vw,78px);line-height:.97;letter-spacing:-.025em;text-wrap:balance;margin:0}
.solution-intro>div>p{font-size:19px;line-height:1.6;max-width:44ch;margin:0 0 20px}
.solution-intro>div>p:last-child{margin-bottom:0}
#rhythm-title,#woning-title{scroll-margin-top:18px}
#rhythm-title:focus,#woning-title:focus{outline:none}
#rhythm-title:focus-visible,#woning-title:focus-visible{outline:2px solid var(--navy);outline-offset:8px}
.pricing .plans article:not(.is-selected){background:var(--cream)}
footer[data-surface="light"]{background:var(--cream-light)}
@media(max-width:800px){
 .depth-hero{row-gap:0}
 .depth-hero .hero-foreground{margin-top:12px}
 .solution-intro{grid-template-columns:1fr;gap:24px;padding-block:48px}
 .solution-intro h2{font-size:clamp(42px,9vw,64px)}
 .solution-intro>div>p{font-size:17px;max-width:50ch}
}
@media(max-width:560px){
 header{display:flex;flex-wrap:nowrap;height:84px;padding-block:9px;gap:8px}
 header>.logo{flex-shrink:0}
 header .logo img{width:100px}
 header .menu-toggle{order:2;margin-left:4px;gap:5px;flex-shrink:0}
 header .header-socials{order:1;margin-left:auto;gap:0;flex-shrink:0}
 header .social-button{width:32px;height:44px;padding:6px}
 header .social-button svg{width:20px;height:20px}
 header nav{top:100%}
 .solution-intro h2{font-size:clamp(40px,10.8vw,56px)}
 /* Frequency + name + price carry the choice; secondary slogans stay on larger screens. */
 .formula-heading h2{font-size:42px;line-height:1;margin-bottom:12px}
 .formula-heading>p{font-size:15px;line-height:1.4;margin-top:0}
 .formula-heading{margin-bottom:12px}
 .plan-feedback{font-size:17px;line-height:1.3;margin-bottom:33px}
 .pricing .plans{gap:32px;grid-template-columns:minmax(0,1fr)}
 .pricing .plans article{display:grid;grid-template-columns:minmax(0,1fr) 86px;grid-template-rows:auto auto auto;column-gap:12px;row-gap:6px;padding:14px 16px;min-height:154px;align-items:center}
 .plans article>.label{grid-column:1;grid-row:1;font-size:12px;line-height:1.2;letter-spacing:.4px;align-self:end}
 .plans article>h3{grid-column:1;grid-row:2;font-size:29px;line-height:1.02;margin:0;align-self:start}
 .plans article>p{display:none}
 .plans article>.price{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:1px;margin:0;padding:0}
 .plans .price>.amount{font-size:44px;line-height:1;white-space:nowrap}
 .plans .price-from{font-size:11px;line-height:1.3;margin-bottom:1px}
 .plans .price>span:last-child{font-size:12px;padding:0;line-height:1.25}
 .plans article>.button[data-plan]{grid-column:1/-1;grid-row:3;min-height:48px;font-size:24px;line-height:1.05;padding:10px 66px 10px 19px;margin-top:5px}
 .plans .button[data-plan]>.button-pictogram{width:65px;height:65px;right:-2px}
 .plans .plan-tag{font-size:11px;height:24px;top:-25px;display:flex;justify-content:center;align-items:center;letter-spacing:.7px}
 .plans .plan-radio{grid-column:1;grid-row:1}
 .plans .plan-card-hitarea{margin:0}
}

/* Larger brand lettering for navigation; social glyphs stay visually secondary. */
header nav{font-size:32px;gap:26px}
header .header-socials{gap:0}
header .social-button{width:34px;padding:7px}
header .social-button svg,footer .social-button svg{width:21px;height:21px}
@media(max-width:1100px) and (min-width:801px){header nav{font-size:26px;gap:18px}header .social-button{width:32px;padding:6px}}
@media(max-width:800px){header nav{font-size:30px;gap:22px}header .social-button{width:32px;padding:6px}header .social-button svg{width:20px;height:20px}}
