/* Shared responsive layout for home, counseling and subscriptions. */
html{-webkit-text-size-adjust:100%;scroll-padding-top:110px}
body{overflow-wrap:break-word}
img{max-width:100%;height:auto}
header{gap:24px;padding-inline:max(5%,calc((100% - 1440px)/2))}
.brand,#language{flex-shrink:0}
#language{min-width:44px;min-height:44px}
nav{gap:clamp(14px,2vw,32px);min-width:0}
nav a{display:flex;align-items:center;min-height:44px;white-space:nowrap}
.button,.copy,.reset,.preview-button,#home-link{min-height:44px;align-content:center}
.button{text-align:center;justify-content:center}
p,li{word-break:normal;overflow-wrap:anywhere}
h1,h2,h3{text-wrap:balance;overflow-wrap:anywhere}
.split>*,.split-inner>*,.three-grid>*,.systems>*,.book-section>*,.subscription-grid>*,.two-fields>*{min-width:0}
.hero{padding-inline:max(7%,calc((100% - 1320px)/2));min-height:620px}
.hero h1{font-size:clamp(48px,7.2vw,104px);letter-spacing:-.045em}
.hero-bottom{gap:24px;flex-wrap:wrap}
footer{padding-inline:max(7%,calc((100% - 1320px)/2))}
#counsel-app{width:100%;padding-inline:clamp(20px,5vw,64px)}
#subscribe-app{width:100%;padding-inline:clamp(20px,5vw,48px)}
input,select,textarea{min-height:48px;font-size:16px}
.subscription-grid input,.subscription-grid select{font-size:16px;min-width:0}
.subscription-grid input[type=checkbox]{height:22px;min-height:22px;margin-top:4px}
.form-actions{flex-wrap:wrap}
.field-caption{flex-wrap:wrap;gap:6px}
.book-preview{display:inline-flex;align-items:center;min-height:44px}
@media(min-width:1600px){.hero{min-height:700px}.growing-village{align-items:center}}
@media(max-width:1100px){
 header:has(nav){height:auto;display:grid;grid-template-columns:1fr auto;gap:8px 20px;padding:16px 5% 0}
 header:has(nav) .brand{grid-column:1;grid-row:1}
 header:has(nav) #language{grid-column:2;grid-row:1}
 header nav{grid-column:1/-1;grid-row:2;width:100%;overflow-x:auto;overscroll-behavior-x:contain;gap:24px;padding:0 0 8px;scrollbar-width:thin}
 header nav a{display:flex!important;flex-shrink:0;font-size:14px}
 html{scroll-padding-top:145px}
 .hero{min-height:570px}
 .counsel-layout{gap:28px}
}
@media(max-width:760px){
 header{padding-inline:20px;gap:16px}
 header:has(nav){padding-inline:20px}
 .hero{padding:42px 6% 24px;min-height:0}
 .hero h1{font-size:clamp(42px,9vw,64px);margin-top:28px;line-height:1.2}
 .hero p{max-width:100%}
 .hero-bottom{margin-top:42px;font-size:12px}
 section:not(.hero){padding:56px 6%}
 h2{font-size:clamp(28px,6.7vw,42px);letter-spacing:-.035em}
 .book-section h2,.village-story h2{font-size:clamp(28px,6.7vw,40px)}
 .book-section{gap:24px}.book-cover{width:min(180px,55%)}
 .book-actions{gap:8px 20px}
 .book-actions .button,.book-preview{margin-top:8px}
 .three-grid,.systems,.wisdom-grid{margin-top:28px}
 .subscription-heading h1,.counsel-title h1{font-size:clamp(30px,7.5vw,46px);letter-spacing:-.03em;line-height:1.3}
 .subscription-heading p{font-size:16px}
 .subscription-grid{grid-template-columns:minmax(0,1fr);gap:24px}
 .schedule-card{padding:22px}.schedule-card strong{font-size:36px}
 .reading{margin-top:32px;padding-top:30px!important}
 footer{padding:32px 6%}
}
@media(max-width:480px){
 header .brand{font-size:22px}.brand span{font-size:10px}
 header #home-link{margin-left:auto;margin-right:0;font-size:14px}
 header nav{gap:20px}
 .hero h1{font-size:clamp(38px,10vw,48px)}
 .hero-bottom{display:block}.hero-bottom span{display:block;margin-top:8px}
 .wisdom-grid,.systems{grid-template-columns:1fr}
 .wisdom-grid p,.systems p{font-size:15px}
 .wallet{padding:20px 16px}.wallet code{font-size:15px}
 .badge{white-space:normal}
 summary{gap:14px;font-size:18px}details p{margin-left:0;margin-right:0}
 .form-actions{align-items:stretch;gap:12px}.form-actions .button{width:100%}
 .subscription-grid .button{width:100%;white-space:normal}
 .pillars{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .pillars article{padding:18px 10px}
 .topic-badge{max-width:100%;overflow-wrap:anywhere}
 .element-row{grid-template-columns:75px minmax(0,1fr) 24px;gap:8px}
 .preview-mail{padding:18px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}