@media(max-width:1050px){
  .main-nav{
    position:fixed;top:78px;left:0;right:0;display:grid;gap:0;padding:14px 22px;
    background:var(--bg);border-bottom:1px solid var(--line);
    transform:translateY(-140%);opacity:0;visibility:hidden;transition:.25s;
  }
  .main-nav.open{transform:none;opacity:1;visibility:visible}
  .main-nav a{padding:13px 4px;border-bottom:1px solid var(--line)}
  .main-nav a:after{display:none}
  .menu-toggle{display:block}
  .menu-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-toggle.active span:nth-child(2){opacity:0}
  .menu-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .method-card__body{grid-template-columns:170px 1fr}
  .method-character{width:180px}
  .method-result{left:164px}
}
@media(max-width:820px){
  .container{width:min(var(--container),calc(100% - 26px))}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{text-align:center;padding-bottom:18px}
  .hero-copy p{margin-left:auto;margin-right:auto}
  .hero-visual{height:455px;max-width:610px;width:100%;margin:auto}
  .hero-character{left:50%;transform:translateX(-50%)}
  .cards-grid{grid-template-columns:1fr}
  .approach-panel{grid-template-columns:210px 1fr}
  .approach-copy{padding-right:20px}
  .principles-grid{grid-template-columns:1fr;gap:10px}
  .principles-grid article,.principles-grid article:first-child{padding:0;border:0}
  .results-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .site-header{height:70px}
  .main-nav{top:70px}
  .brand strong{font-size:1rem}
  .brand span{font-size:.68rem}
  .language-toggle{display:none}
  .hero h1{font-size:2.55rem}
  .hero-copy{padding-top:42px}
  .hero-visual{height:390px}
  .hero-character{height:375px}
  .plant{width:95px;height:180px}
  .stem{height:165px}
  .leaf{width:42px;height:70px}
  .method-card{padding:20px 16px 0;min-height:560px}
  .method-card__heading{gap:12px}
  .method-icon{width:54px;height:54px;font-size:1.35rem}
  .method-card h2{font-size:2rem}
  .method-card h3{font-size:.84rem}
  .method-card__body{grid-template-columns:1fr;min-height:425px}
  .method-character{position:absolute;left:0;bottom:0;width:158px;height:290px}
  .method-list{padding:25px 0 105px 130px;gap:13px}
  .method-list li{font-size:.75rem;padding-left:24px}
  .method-result{left:126px;right:7px;min-height:88px;padding:9px}
  .method-result>span{display:none}
  .method-result p{font-size:.67rem}
  .approach-panel{grid-template-columns:1fr}
  .approach-character{height:155px}
  .approach-character img{height:155px}
  .approach-copy{padding:20px}
  .approach-copy h2,.approach-copy>p{text-align:center}
  .results-grid{grid-template-columns:1fr}
  .results-grid article{justify-content:center}
  .footer-inner{grid-template-columns:1fr;text-align:center;gap:9px}
  .footer-inner>div{justify-content:center}
  .footer-inner small{text-align:center}
}

@media(max-width:1000px){
  .method-card{grid-template-columns:200px minmax(0,1fr) 275px}
  .method-card__body{grid-template-columns:200px minmax(0,1fr)}
  .method-character{width:190px}
}
@media(max-width:780px){
  .method-card{grid-template-columns:190px 1fr;grid-template-rows:auto auto;padding-bottom:12px}
  .method-card__heading{grid-column:2;grid-row:1;margin:0 8px}
  .method-card__body{grid-column:1/3;grid-row:1/2;grid-template-columns:190px 1fr}
  .method-result{grid-column:1/3;grid-row:2;min-height:auto;margin-top:8px}
}
@media(max-width:560px){
  .theme-sun,.theme-moon{display:none}
  .method-card{display:block;padding:16px}
  .method-card__heading{margin:0 0 12px 65px;min-height:58px}
  .method-card__heading .method-icon{left:16px;top:16px}
  .method-card__body{display:block;min-height:auto}
  .method-character{position:static;width:180px;height:190px;margin:0 auto}
  .method-list{padding:14px 0 8px}
  .method-result{margin-top:10px}
}
