/* Responsive layout. No viewport-wide elements or forced overflow hiding. */
@media (min-width: 1700px) { .hero h1 { font-size: 100px; } }
@media (max-width: 1199px) {
 .scene-title { display: none; }
 .scene-top > span:first-child { visibility: hidden; }
 .header-inner { gap: 22px; }
 .main-nav { gap: 23px; }
 .country { padding-right: 19px; }
 .hero-copy { grid-template-columns: 1fr 245px; gap: 25px; }
 .hero h1 { font-size: 6.7vw; }
 .hero-description p { font-size: 13px; }
 .hero-scene { height: 350px; }
 .scene-greeting { font-size: 55px; }
 .scene-title { font-size: 15px; }
 .format-rail .format-note { display: none; }
 .solution-body { padding: 24px 21px; }
 .solution-visual { height: 185px; }
 .solution h3 { font-size: 22px; }
 .media-visual { padding: 22px; }
 .media-visual > img { height: 126px; }
 .region-copy { padding: 35px; }
 .region-poster { padding: 35px; }
 .dev-grid, .faq-layout { gap: 38px; }
}
@media (max-width: 960px) {
 .header-inner { min-height: 87px; flex-wrap: wrap; padding-block: 20px; row-gap: 18px; }
 .brand { margin-right: auto; }
 .country { order: 1; padding-right: 0; border-right: 0; }
 .main-nav { order: 3; flex-basis: 100%; justify-content: space-between; border-top: 1px solid var(--line); padding-top: 16px; }
 .js .menu-toggle { display: inline-flex; align-items: center; gap: 9px; justify-content: center; order: 2; border: 1px solid var(--line); padding: 10px 14px; border-radius: 22px; background: transparent; font-size: 12px; }
 .menu-symbol { width: 14px; display: inline-flex; flex-direction: column; gap: 4px; }
 .menu-symbol span { height: 1px; background: var(--wine); width: 14px; display: block; transition: transform .2s; }
 .menu-toggle[aria-expanded='true'] .menu-symbol span:first-child { transform: translateY(2.5px) rotate(45deg); }
 .menu-toggle[aria-expanded='true'] .menu-symbol span:last-child { transform: translateY(-2.5px) rotate(-45deg); }
 .js .main-nav { display: none; }
 .js .main-nav.is-open { display: flex; }
 .hero { padding-top: 35px; }
 .hero-copy { grid-template-columns: 1fr; gap: 25px; margin-top: 26px; }
 .hero h1 { font-size: 9.1vw; }
 .hero-description { display: flex; justify-content: space-between; align-items: start; gap: 34px; }
 .hero-description p { font-size: 14px; max-width: 355px; }
 .hero-actions { margin: 0; gap: 7px; flex-shrink: 0; }
 .hero-scene { height: 355px; }
 .scene-greeting { right: 30px; font-size: 50px; }
 .scene-title { font-size: 14px; }
 .solutions-grid { gap: 13px; }
 .solution-visual { height: 160px; }
 .solution-body { padding: 23px 18px; }
 .solution h3 { font-size: 20px; }
 .solution p { font-size: 12px; }
 .file-visual { padding: 18px; }
 .file-stack { width: 95%; padding: 9px 11px; }
 .media-visual { padding: 15px; gap: 5px; }
 .media-visual > img { height: 110px; border-width: 4px; }
 .section-heading { gap: 32px; }
 .section-heading > p { max-width: 280px; font-size: 13px; }
 .region-layout { min-height: 440px; }
 .region-poster, .region-copy { padding: 29px; }
 .region-word { font-size: 73px; }
 .city-list { gap: 10px 17px; font-size: 10px; }
 .region-copy h2 { font-size: 35px; }
 .region-copy > p { font-size: 13px; }
 .process-top h2 { font-size: 29px; }
 .process-top .eyebrow { font-size: 9px; }
 .dev-grid { grid-template-columns: 1fr 1.1fr; gap: 30px; }
 .dev-copy h2 { font-size: 40px; }
 .dev-copy > p { font-size: 13px; }
 .code-panel pre { font-size: 11px; }
 .faq-layout { grid-template-columns: .65fr 1.35fr; }
 .faq-heading h2 { font-size: 37px; }
}
@media (max-width: 700px) {
 .scene-top > span:first-child { visibility: hidden; }
 .hero-topline .region-note { display: none; }
 .hero-copy { gap: 24px; }
 .hero h1 { font-size: 10.8vw; }
 .hero h1 .serif { white-space: normal; max-width: 600px; font-size: 1em; }
 .hero-description { display: block; }
 .hero-description p { max-width: 390px; }
 .hero-actions { margin-top: 20px; flex-direction: row; gap: 20px; align-items: center; flex-wrap: wrap; }
 .hero-scene { height: 330px; }
 .scene-title { display: none; }
 .scene-greeting { top: 60px; font-size: 50px; }
 .scene-greeting small { font-size: 8px; }
 .scene-art { object-position: 39% center; }
 .region-stamp { width: 105px; height: 105px; top: 43%; left: 33%; }
 .delivery-ticket { left: 22px; bottom: 29px; width: 239px; padding: 12px 16px; gap: 13px; }
 .ticket-value { font-size: 15px; }
 .scene-top { left: 24px; right: 24px; top: 21px; font-size: 8px; }
 .scene-footer { font-size: 7px; right: 22px; bottom: 15px; }
 .hero-meta { font-size: 8px; }
 .hero-meta span:last-child { display: none; }
 .format-rail { margin-top: 28px; }
 .format-rail a, .format-rail a:first-child { padding: 18px 12px; gap: 9px; }
 .format-rail .format-name { font-size: 12px; }
 .format-rail .format-no { font-size: 8px; }
 .section-heading { display: block; margin-top: 22px; margin-bottom: 30px; }
 .section-heading h2 { font-size: 42px; }
 .section-heading > p { margin-top: 20px; max-width: 410px; font-size: 14px; }
 .solutions-grid { grid-template-columns: 1fr; gap: 22px; }
 .solution { display: grid; grid-template-columns: .9fr 1.1fr; min-height: 285px; }
 .solution-visual { height: 100%; }
 .solution-body { padding: 24px 20px; }
 .solution h3 { font-size: 22px; }
 .solution p { font-size: 12px; margin-bottom: 14px; }
 .solution-link { padding-top: 14px; font-size: 11px; }
 .media-visual { display: flex; flex-direction: column; gap: 6px; justify-content: center; padding: 22px; }
 .media-visual > img { width: 100%; height: 98px; }
 .file-visual { padding: 17px; }
 .file-stack { padding: 9px 8px; }
 .file-stack > div { font-size: 8px; gap: 6px; }
 .file-stack small { font-size: 7px; }
 .file-stack img { width: 13px; height: 13px; }
 .region-layout { grid-template-columns: 1fr; }
 .region-poster { min-height: 364px; padding: 33px; }
 .region-word { font-size: 82px; margin-block: 32px; }
 .region-copy { padding: 37px 33px; }
 .region-copy h2 { font-size: 40px; }
 .region-copy > p { font-size: 14px; }
 .city-list { font-size: 11px; gap: 10px 22px; }
 .process { padding-block: 47px; }
 .process-top { display: block; }
 .process-top .eyebrow { display: block; margin-top: 19px; }
 .process-top h2 { font-size: 32px; }
 .process-steps { grid-template-columns: 1fr; gap: 28px; }
 .process-step { display: grid; grid-template-columns: 28px 1fr; column-gap: 18px; padding-top: 21px; }
 .process-num { grid-row: span 2; margin-top: 7px; }
 .process-step h3 { font-size: 19px; }
 .process-step p { max-width: 400px; }
 .dev-grid { grid-template-columns: 1fr; gap: 32px; margin-top: 24px; }
 .dev-copy h2 { font-size: 44px; }
 .dev-copy > p { font-size: 14px; max-width: 450px; }
 .dev-note { max-width: 440px; }
 .code-panel pre { font-size: 12px; }
 .faq-layout { grid-template-columns: 1fr; gap: 20px; padding-top: 38px; }
 .faq-heading h2 { font-size: 40px; }
 .faq-heading p { max-width: 390px; }
 .faq-list summary { font-size: 14px; padding-block: 21px; }
 .footer { padding-top: 35px; }
 .footer-top { align-items: flex-start; flex-direction: column; gap: 27px; padding-bottom: 29px; }
 .footer-heading { font-size: 44px; }
 .footer-wordmark { padding-top: 29px; padding-bottom: 25px; gap: 20px; }
 .footer-wordmark .wordmark { font-size: 12.5vw; }
 .footer-wordmark .footer-monogram { width: 45px; }
 .footer-bottom { flex-wrap: wrap; gap: 19px; }
 .footer-bottom nav { flex-basis: 100%; gap: 22px; }
}
@media (max-width: 420px) {
 :root { --gutter: 20px; }
 .header-inner { gap: 16px; min-height: 79px; padding-block: 18px; }
 .brand img { width: 33px; height: 33px; }
 .brand-name { font-size: 21px; }
 .brand { gap: 9px; }
 .brand-region { font-size: 8px; }
 .country { display: none; }
 .js .menu-toggle { padding: 10px 12px; }
 .main-nav, .js .main-nav.is-open { align-items: stretch; flex-direction: column; gap: 4px; }
 .main-nav > a { padding: 10px 3px; }
 .main-nav .nav-main { justify-content: space-between; margin-top: 8px; padding: 12px 16px; }
 .hero { padding-top: 28px; }
 .eyebrow { font-size: 9px; }
 .hero h1 { font-size: 47px; }
 .hero h1 .serif { font-size: 45px; line-height: 1.02; letter-spacing: -.055em; }
 .hero-copy { margin-top: 23px; margin-bottom: 26px; }
 .hero-description p { font-size: 13px; }
 .hero-actions { gap: 10px 21px; }
 .button { padding: 14px 19px; font-size: 12px; gap: 20px; }
 .text-link { font-size: 11px; }
 .hero-scene { height: 338px; }
 .scene-greeting { right: 21px; top: 65px; font-size: 43px; }
 .scene-greeting small { margin-top: 12px; max-width: 130px; margin-left: auto; }
 .region-stamp { left: 26%; top: 47%; width: 93px; height: 93px; padding: 5px; }
 .scene-top { left: 19px; right: 19px; letter-spacing: .09em; font-size: 7px; }
 .delivery-ticket { left: 20px; bottom: 38px; width: 222px; gap: 12px; padding: 12px 14px; }
 .delivery-ticket img { width: 26px; height: 26px; }
 .ticket-label { font-size: 7px; }
 .ticket-value { font-size: 14px; }
 .scene-footer { left: 23px; right: auto; bottom: 13px; font-size: 7px; }
 .format-rail a, .format-rail a:first-child { gap: 6px; padding-inline: 9px; }
 .format-rail .format-name { font-size: 11px; }
 .section-heading h2 { font-size: 39px; }
 .section-heading > p { font-size: 13px; }
 .solution { display: flex; min-height: 0; }
 .solution-visual { height: 187px; }
 .solution-body { padding: 26px 23px; }
 .solution h3 { font-size: 26px; }
 .solution p { font-size: 13px; }
 .media-visual { display: grid; grid-template-columns: 1fr 1fr; padding: 23px; gap: 7px; }
 .media-visual > img { height: 125px; }
 .file-visual { padding: 26px 45px; }
 .file-stack > div { font-size: 10px; gap: 14px; }
 .file-stack { padding: 10px 17px; }
 .file-stack small { font-size: 9px; }
 .file-stack img { width: 15px; height: 15px; }
 .region-poster { min-height: 347px; padding: 27px; }
 .region-word { font-size: 78px; }
 .city-list { gap: 10px 17px; font-size: 10px; }
 .region-copy { padding: 31px 26px; }
 .region-copy h2 { font-size: 36px; }
 .region-copy > p { font-size: 13px; }
 .region-data > div { font-size: 11px; gap: 13px; }
 .dev-copy h2 { font-size: 41px; }
 .code-toolbar { padding-inline: 18px; }
 .code-tabs { padding-inline: 17px; gap: 6px; }
 .code-tabs a { font-size: 10px; padding: 9px 11px; }
 .code-panel { padding: 21px 17px 0; }
 .code-panel pre { font-size: 10px; }
 .code-panel-footer { gap: 8px; font-size: 9px; }
 .code-copy { font-size: 10px; gap: 6px; padding: 8px 10px; }
 .code-disclaimer { padding-inline: 17px; }
 .footer-heading { font-size: 37px; }
 .footer-wordmark .wordmark { font-size: 12vw; }
 .footer-wordmark .footer-monogram { width: 34px; }
 .footer-wordmark { gap: 15px; }
 .footer-bottom { font-size: 8px; }
 .footer-bottom nav { gap: 18px; }
 .credits-page h1 { font-size: 37px; }
}
@media (max-width: 350px) {
 :root { --gutter: 17px; }
 .brand-name { font-size: 19px; }
 .hero h1 { font-size: 42px; }
 .hero h1 .serif { font-size: 41px; }
 .hero-actions { gap: 6px; }
 .hero-actions .text-link { padding-left: 5px; }
 .hero-scene { height: 310px; }
 .scene-greeting { font-size: 37px; right: 20px; }
 .region-stamp { width: 79px; height: 79px; top: 46%; }
 .delivery-ticket { width: 215px; bottom: 35px; }
 .format-rail .format-no { display: none; }
 .format-rail a, .format-rail a:first-child { padding-inline: 8px; }
 .city-list { font-size: 9px; }
 .region-copy { padding-inline: 22px; }
 .region-data > div { font-size: 10px; }
 .code-panel pre { font-size: 9px; }
 .code-panel-footer { align-items: flex-start; }
 .footer-heading { font-size: 34px; }
}
