/* Preserve the tree-guide composition while allowing available-width reflow. */
.guide-header{height:auto;min-height:82px;flex-wrap:wrap;gap:16px 24px;padding-block:12px}.guide-header nav{min-width:0;flex-wrap:wrap;gap:14px 20px}.guide-header nav a{white-space:normal}.guide-lang{flex:none;margin-left:auto}.guide-cards a{min-width:0;grid-template-columns:minmax(35px,60px) minmax(0,1fr);height:auto;min-height:184px}.guide-cards strong,.guide-card-desc,.guide-more{overflow-wrap:anywhere}.guide-icon{max-width:100%}
@media(max-width:760px){.guide-header{min-height:70px;gap:7px}.guide-header nav{gap:12px 20px;overflow:visible}.guide-cards a{grid-template-columns:1fr;min-height:190px}.guide-icon{grid-row:auto}}
@media(max-width:390px){.guide-cards a{grid-template-columns:55px minmax(0,1fr);min-height:140px}.guide-icon{grid-row:1/4}}

/* Layout zoom changes the container width, so apply the incumbent mobile composition there too. */
body:has(.guide-header) main{container-type:inline-size}
@container(max-width:900px){.guide-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-cards a{grid-template-columns:55px minmax(0,1fr);min-height:160px}.guide-icon{grid-row:1/4}.guide-facts ul{grid-template-columns:1fr}.guide-facts li{border-right:0;border-bottom:1px solid rgba(255,255,255,.25);padding:15px 0}.guide-hero{height:auto;min-height:610px}.guide-photo{top:0;width:100%;height:260px;object-position:center}.guide-hero:before{background:linear-gradient(0deg,#fff 0%,#fff 54%,rgba(255,255,255,.08) 85%)}.guide-hero-content{padding:225px 20px 32px}.guide-hero h1{font-size:clamp(38px,8cqw,53px);line-height:1.02}.guide-hero h1 br,.guide-lede br{display:none}.guide-lede{font-size:17px}}
@container(max-width:430px){.guide-cards{grid-template-columns:1fr}}