/* Small-screen composition shared by the public pages. */
.mobile-nav{display:none}
img{max-width:100%}
.masthead,.opening>*,.section-head>*,.footer-top>*,.footer-bottom>*{min-width:0}
.article-body,.document,.integration-grid,.footer-top,.footer-bottom{overflow-wrap:anywhere}
a,button,summary{-webkit-tap-highlight-color:rgba(0,109,82,.15)}
@media(max-width:700px){
  html{scroll-padding-top:20px}
  .wrap{width:calc(100% - 32px)}
  .masthead{flex-direction:row;align-items:center;gap:16px;padding-block:18px;position:relative}
  .wordmark{font-size:23px}.wordmark span{font-size:10px;letter-spacing:.1em;margin-top:6px}
  .masthead>nav{display:none}
  .mobile-nav{display:block;flex:none}
  .mobile-nav summary{min-height:44px;display:flex;align-items:center;padding:8px 13px;border:1px solid var(--line);font-size:14px;font-weight:650;cursor:pointer;list-style:none}
  .mobile-nav summary::-webkit-details-marker{display:none}
  .mobile-nav summary::after{content:'+';font-size:20px;margin-left:12px}.mobile-nav[open] summary::after{content:'−'}
  .mobile-nav[open]>nav{display:flex;position:absolute;top:calc(100% - 1px);left:0;right:0;z-index:5;flex-direction:column;align-items:stretch;gap:0;background:#fff;border:1px solid var(--line);padding:10px;box-shadow:0 10px 20px #003c2f12}
  .mobile-nav nav a{padding:13px 12px;min-height:48px;font-size:16px}
  .mobile-nav nav .mobile-download{background:var(--forest);color:white;margin-top:6px}
  .mobile-nav summary:focus-visible{outline:3px solid #ac7b19;outline-offset:3px}
  .opening{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:20px 12px;padding-block:28px 36px;align-items:center}
  .opening>div{display:contents}
  .opening .kicker{grid-column:1/-1;margin:0;font-size:11px;letter-spacing:.12em}
  .opening h1{grid-column:1;grid-row:2;font-size:clamp(32px,8.9vw,46px);line-height:1.08;letter-spacing:-.04em}
  .opening h1 em{letter-spacing:-.035em}
  .opening .brand-stage{grid-column:2;grid-row:2;align-self:center;border:0;background:transparent;max-width:100%;width:100%}
  .opening .brand-stage img{width:100%;height:auto;max-height:none}
  .opening .brand-stage figcaption{display:none}
  .opening .intro,.opening .hero-product,.opening .actions{grid-column:1/-1;margin:0}
  .opening .intro{font-size:17px;line-height:1.55}
  .opening .hero-product{font-size:16px;line-height:1.6}
  .opening .actions{gap:15px}
  .cta{min-height:50px;font-size:15px;line-height:1.45;padding:14px 18px;text-align:center;justify-content:center}
  .opening .cta,.closing .cta{width:100%}
  .text-link{display:inline-block;line-height:1.6;padding-block:8px;font-size:15px}
  h2{font-size:clamp(30px,8.4vw,40px);line-height:1.12;letter-spacing:-.035em}
  .manifesto-band .wrap{gap:20px;padding-block:30px}.manifesto-band p:first-child{font-size:26px}
  .app-section{padding-block:44px;gap:30px}.feature-list li{gap:15px;padding-block:18px}
  .app-figure{padding:24px 18px 20px}.phone{max-width:210px}
  .section-head{margin-bottom:28px}.section-head>div:last-child{margin-top:20px}
  .diary-detail{padding-bottom:44px}.coach-section,.formats-section,.journal-section,.integrations-section,.club-code{padding-block:44px}
  .detail-columns,.coach-grid,.format-grid{gap:24px}.detail-columns article,.coach-grid article{padding-top:18px}
  .detail-columns h3,.coach-grid h3,.format-grid h3{font-size:22px;margin-block:12px 10px}
  .feature-footnote{margin-top:25px;padding-top:17px}
  .story-grid{gap:26px}.story{padding-top:18px}.story-number{display:none}.story h3{font-size:28px;margin-top:13px}.story p{margin-bottom:16px}
  .journal-intro{padding-block:32px}.journal-intro h1{font-size:42px;line-height:1.1;letter-spacing:-.04em}.journal-intro p:last-child{font-size:17px}
  .journal-list{padding-bottom:44px}.integration-grid{gap:20px}.integration-grid article{padding:22px}
  .faq-section{padding-top:44px;gap:22px}.faq-list details{padding-block:17px}.faq-list summary{min-height:44px;line-height:1.5}
  .closing{padding-block:44px}.closing h2{margin-bottom:24px}.section-jumps{gap:10px 20px}.section-jumps a{padding-block:8px}
  .footer-top{padding-block:30px;gap:16px}.footer-bottom{padding-block:22px;gap:16px}.footer-bottom nav{gap:8px 20px}.footer-bottom nav a{padding-block:9px;font-size:14px}
  .article-wrap{padding-block:30px 44px}.article-wrap h1{font-size:38px;line-height:1.12;letter-spacing:-.035em}.article-deck{font-size:19px;margin-top:20px}.article-body{font-size:17px;line-height:1.8}.article-body h2{font-size:28px;line-height:1.25}.article-body ul,.article-body ol{padding-left:22px}.takeaway{padding:8px 18px}
  .nav{width:calc(100% - 32px);gap:16px}.navlinks{gap:8px 18px}.navlinks a{padding-block:8px}
  .hero{padding:32px 0 38px}.hero-inner{width:calc(100% - 32px)}.hero h1{font-size:40px;line-height:1.1}.hero p{font-size:17px}.page{width:calc(100% - 32px);padding-block:24px 40px}.document{padding:22px 20px;border-radius:10px}.document h2{font-size:23px;line-height:1.3}.document p{line-height:1.7}.note{padding:15px}.button{overflow-wrap:anywhere}
  #feedback-form input,#feedback-form select,#feedback-form textarea{font-size:16px;min-height:48px}#feedback-form .form-actions button{width:100%}.footer-inner{width:100%}
}
@media(max-width:350px){.opening{grid-template-columns:minmax(0,1fr) 76px;gap:18px 10px}.opening h1{font-size:32px}.wordmark{font-size:21px}.wordmark span{font-size:9px}.article-wrap h1{font-size:33px}.document{padding:20px 16px}}
