/* Phone layout; desktop styling stays in each page. */
@media (max-width:760px){
  header{padding:20px 20px 16px;gap:18px;align-items:center}
  header .exact-brand{align-self:center}
  header nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;min-width:0;gap:4px 8px;align-items:start}
  header nav>a:not(.button),header nav .nav-menu summary{display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 0;font-size:13px;white-space:nowrap}
  header nav>.button{grid-column:1/-1;justify-content:center;min-height:44px;margin-top:6px;font-size:14px}
  .nav-menu{min-width:0}
  .nav-dropdown{min-width:190px;max-width:calc(100vw - 40px)}
  .nav-dropdown a{min-height:44px;white-space:normal}
  .hero{padding:36px 20px 40px;gap:28px}
  h1{font-size:clamp(42px,11vw,60px);letter-spacing:-1.5px;line-height:1.08;margin:18px 0 22px}
  h2{font-size:32px;line-height:1.15;letter-spacing:-.7px}
  h3{font-size:25px;line-height:1.2}
  .hero p,.page-hero p{font-size:16px;line-height:1.65}
  .hero-photo{min-height:0;height:clamp(340px,110vw,480px)}
  .section{padding:36px 20px}
  .page-hero{padding:36px 20px 22px}
  .page-hero h1{font-size:clamp(38px,10vw,52px)}
  .page-content{padding:12px 20px 40px}
  .cards{grid-template-columns:minmax(0,1fr);gap:14px;margin:24px 0 0}
  .cards .panel{padding:22px;gap:0}
  .cards .panel h3{font-size:25px;margin:0 0 12px}
  .cards .panel p{font-size:15px;line-height:1.6;margin:0 0 12px}
  .cards .panel>a:not(.button){display:flex;align-items:center;min-height:44px;font-size:15px;text-underline-offset:4px}
  .panel{padding:22px;min-width:0}
  .panel h2{font-size:29px}
  .info-grid,.about,.faq-inner,.event,.wreath-gallery,.season-photo-section{grid-template-columns:minmax(0,1fr);gap:24px}
  .hero>*,.info-grid>*,.about>*,.cards>*{min-width:0}
  .button{min-height:44px;max-width:100%;align-items:center;justify-content:center;line-height:1.4;text-align:center}
  .event-info{padding:22px}
  .event-photo,.photo-overlay{min-height:350px}
  .event-art .poster{font-size:36px}
  .poster em{font-size:46px}
  .ticket-choice strong{flex-wrap:wrap;gap:4px 12px}
  .booking{flex-wrap:wrap}
  .ribbon{padding:16px 20px;font-size:10px;line-height:1.8;letter-spacing:1px}
  .stand-gallery,.flower-photos{padding-left:20px;padding-right:20px;grid-template-columns:minmax(0,1fr);gap:20px}
  .stand-gallery figure{grid-column:auto!important}
  .family-story .story-portrait img{max-height:460px}
  .faq-inner{padding:36px 20px}
  form input,form select,form textarea{font-size:16px;min-height:44px}
  footer{padding:30px 20px;gap:24px}
  footer>div{min-width:0;max-width:100%}
  footer a[href^="mailto:"]{overflow-wrap:anywhere}
  .footer-links{gap:0}
  .footer-links a{display:flex;align-items:center;min-height:44px}
}
@media (max-width:360px){
  header,.hero,.section,.page-hero,.page-content,footer{padding-left:16px;padding-right:16px}
  header nav>a:not(.button),header nav .nav-menu summary{font-size:12px}
  .exact-name{width:210px;height:48px}
  .exact-name img{width:248px;left:-22px;top:-15px}
  .exact-symbol{width:52px}
}