/* Mobile layout only. Every rule is gated at 760px; desktop styles stay intact. */
@media screen and (max-width: 760px) {
  body[data-canary-mobile] { font-size: 16px; line-height: 1.65; }
  body[data-canary-mobile] :is(main, section, article, form, .field) { min-width: 0; }
  body[data-canary-mobile] :is(h1, h2, h3, p, li, label, small) { overflow-wrap: break-word; }
  body[data-canary-mobile] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    min-height: 52px; max-width: 100%; font-size: 16px; line-height: 1.5;
  }
  body[data-canary-mobile] .field label { font-size: 14px; line-height: 1.5; margin-bottom: 8px; }
  body[data-canary-mobile] :is(.btn, .menu-toggle, .x) { min-height: 48px; font-size: 15px; line-height: 1.4; }
  body[data-canary-mobile] :is(.btn, .cta) { white-space: normal; text-align: center; }
  body[data-canary-mobile] :is(.notice, .help, .secure) { font-size: 14px; line-height: 1.6; }
  body[data-canary-mobile] :is(.form-grid, .formgrid) { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  body[data-canary-mobile] :is(.form-grid, .formgrid) .full { grid-column: 1 / -1; }

  /* Public homepage: consistent gutters, readable cards and a compact header. */
  body[data-canary-mobile="home"] .container { width: calc(100% - 40px); }
  body[data-canary-mobile="home"] .header-meta {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px;
    height: auto; min-height: 36px; padding: 8px 16px; font-size: 12px; line-height: 1.5;
  }
  body[data-canary-mobile="home"] .header-meta-whatsapp { font-size: 13px; padding: 0; }
  body[data-canary-mobile="home"] .header-meta-route { font-size: 12px; }
  body[data-canary-mobile="home"] .topbar .container.nav {
    display: grid; grid-template-columns: minmax(0, 1fr) 48px;
    grid-template-areas: "brand toggle" "actions actions";
    width: calc(100% - 40px); height: auto; min-height: 0; padding: 12px 0 16px; gap: 12px;
  }
  body[data-canary-mobile="home"] .nav > .brand { grid-area: brand; min-width: 0; }
  body[data-canary-mobile="home"] .nav .brand img { width: min(190px, 100%); max-width: 100%; height: auto; }
  body[data-canary-mobile="home"] .menu-toggle { grid-area: toggle; width: 48px; height: 48px; display: block; }
  body[data-canary-mobile="home"] .nav-actions {
    grid-area: actions; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: 100%;
  }
  body[data-canary-mobile="home"] .nav-actions :is(.btn-outline, .btn-primary) {
    display: flex; align-items: center; justify-content: center; width: 100%; padding: 12px 8px; font-size: 14px;
  }
  body[data-canary-mobile="home"] .mobile-panel {
    position: absolute; inset: auto 0 auto; top: 100%; max-height: calc(100dvh - 180px);
    overflow-y: auto; padding: 12px 20px 20px;
  }
  body[data-canary-mobile="home"] .mobile-panel.open { gap: 4px; }
  body[data-canary-mobile="home"] .mobile-panel a { display: flex; align-items: center; min-height: 48px; padding: 12px; font-size: 16px; }
  body[data-canary-mobile="home"] .hero { min-height: 0; padding: 44px 0 52px; }
  body[data-canary-mobile="home"] .hero-copy { padding: 0; }
  body[data-canary-mobile="home"] .hero-copy h1 { font-size: clamp(2rem, 7.5vw, 2.65rem); line-height: 1.14; letter-spacing: -.035em; margin-bottom: 24px; }
  body[data-canary-mobile="home"] .hero-lede { font-size: 16px; line-height: 1.75; }
  body[data-canary-mobile="home"] .hero-note { font-size: 15px; line-height: 1.65; margin-top: 20px; }
  body[data-canary-mobile="home"] .hero-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 28px; }
  body[data-canary-mobile="home"] .hero-actions .btn { width: 100%; justify-content: center; padding: 14px 18px; }
  body[data-canary-mobile="home"] .hero-benefits { display: grid; gap: 10px; margin-top: 24px; }
  body[data-canary-mobile="home"] .hero-benefits span { font-size: 14px; line-height: 1.6; }
  body[data-canary-mobile="home"] .section { padding: 64px 0; }
  body[data-canary-mobile="home"] .section-head { margin-bottom: 28px; }
  body[data-canary-mobile="home"] :is(.section-head h2, .plans-heading h2, .customs h2, .about-grid h2, .final-cta h2) {
    font-size: clamp(1.75rem, 6.8vw, 2.15rem); line-height: 1.2; letter-spacing: -.025em;
  }
  body[data-canary-mobile="home"] :is(.section-head p, .plans-heading-copy > p:not(.kicker), .service-card p, .mode-card p, .step-card p, .plan-card p, .plan-card li, .customs p) { font-size: 16px; line-height: 1.75; }
  body[data-canary-mobile="home"] :is(.kicker, .faq-badge, .plan-tag, .plan-overline) { font-size: 13px; line-height: 1.5; }
  body[data-canary-mobile="home"] :is(.services, .mode-grid, .how-grid, .hub-proof-grid, .customs, .about-grid, .final-cta, .plans-grid) {
    grid-template-columns: minmax(0, 1fr); gap: 24px;
  }
  body[data-canary-mobile="home"] .services:before { display: none; }
  body[data-canary-mobile="home"] :is(.service-card, .mode-card, .customs-card, .plan-card) { padding: 24px; border-radius: 18px; min-width: 0; }
  body[data-canary-mobile="home"] :is(.service-card h3, .mode-card h3) { font-size: 21px; line-height: 1.4; }
  body[data-canary-mobile="home"] .step-cards { gap: 16px; }
  body[data-canary-mobile="home"] .step-card { padding: 20px; gap: 16px; }
  body[data-canary-mobile="home"] .step-card h3 { font-size: 18px; line-height: 1.4; }
  body[data-canary-mobile="home"] .plans-heading { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  body[data-canary-mobile="home"] .plans-summary { gap: 10px; }
  body[data-canary-mobile="home"] .plans-summary span { font-size: 14px; line-height: 1.5; }
  body[data-canary-mobile="home"] .plan-card.featured { transform: none; }
  body[data-canary-mobile="home"] .plan-card h3 { font-size: 28px; line-height: 1.25; }
  body[data-canary-mobile="home"] .plan-price { font-size: 32px; line-height: 1.3; overflow-wrap: break-word; }
  body[data-canary-mobile="home"] .plan-price small { display: block; font-size: 16px; margin-top: 6px; }
  body[data-canary-mobile="home"] :is(.plan-credit, .plans-terms) { font-size: 14px; line-height: 1.7; }
  body[data-canary-mobile="home"] .plan-card .btn { width: 100%; min-height: 52px; margin-top: 24px; }
  body[data-canary-mobile="home"] .hub-photo-main { min-height: 0; aspect-ratio: 4 / 3; }
  body[data-canary-mobile="home"] .faq-heading-row { flex-wrap: wrap; gap: 12px; }
  body[data-canary-mobile="home"] .faq details { padding: 0 20px; margin-bottom: 16px; }
  body[data-canary-mobile="home"] .faq summary { font-size: 16px; line-height: 1.6; padding: 20px 0; gap: 16px; }
  body[data-canary-mobile="home"] .faq details p { font-size: 16px; line-height: 1.75; padding-bottom: 24px; }
  body[data-canary-mobile="home"] #contact-form { padding: 24px 20px !important; gap: 22px !important; }
  body[data-canary-mobile="home"] #contact-form :is(input, select, textarea) { font-size: 16px; min-height: 52px; }
  body[data-canary-mobile="home"] .footer { padding: 48px 0 28px; }
  body[data-canary-mobile="home"] .footer-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  body[data-canary-mobile="home"] .footer-grid h4 { font-size: 17px; margin-bottom: 12px; }
  body[data-canary-mobile="home"] .footer-grid a:not(.brand) { display: flex; align-items: center; min-height: 44px; font-size: 15px; }
  body[data-canary-mobile="home"] :is(.footer p, .footer-bottom) { font-size: 14px; line-height: 1.7; }

  /* Calculator: compact spacing with readable fields and normal document flow. */
  body[data-canary-mobile="home"] #calculadora { margin-top: 0; padding: 28px 0 40px; scroll-margin-top: 200px; }
  body[data-canary-mobile="home"] #calculadora .calculator-product-container { width: calc(100% - 24px); }
  body[data-canary-mobile="home"] #calculadora .calc-product-heading { padding: 18px 16px; gap: 12px; margin-bottom: 14px; border-radius: 18px; }
  body[data-canary-mobile="home"] #calculadora .calc-product-heading h2 { font-size: 25px; line-height: 1.25; }
  body[data-canary-mobile="home"] #calculadora .calc-trust-strip { display: flex; flex-wrap: wrap; gap: 6px; }
  body[data-canary-mobile="home"] #calculadora .calc-trust-strip span { grid-column: auto; font-size: 14px; line-height: 1.5; padding: 6px 9px; }
  body[data-canary-mobile="home"] #calculadora .calc-workspace { grid-template-columns: minmax(0, 1fr); }
  body[data-canary-mobile="home"] #calculadora .calc-console-header { min-height: 72px; padding: 14px 16px; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  body[data-canary-mobile="home"] #calculadora .calc-console-header img { width: min(160px, 100%); }
  body[data-canary-mobile="home"] #calculadora .calc-live-status { font-size: 14px; white-space: normal; justify-self: start; }
  body[data-canary-mobile="home"] #calculadora .calc-product-form { padding: 18px 16px; grid-template-columns: minmax(0, 1fr); gap: 16px; }
  body[data-canary-mobile="home"] #calculadora .calc-form-section-title { margin-top: 4px; padding-bottom: 10px; }
  body[data-canary-mobile="home"] #calculadora .calc-shipment-choice { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  body[data-canary-mobile="home"] #calculadora .calc-shipment-choice .btn { min-height: 76px; padding: 12px; }
  body[data-canary-mobile="home"] #calculadora .dims { gap: 8px; }
  body[data-canary-mobile="home"] #calculadora .calc-result { margin: 0 10px 12px; padding: 18px 16px; border-radius: 16px; }
  body[data-canary-mobile="home"] #calculadora .calc-lines li { gap: 12px; padding: 10px 0; }
  body[data-canary-mobile="home"] #calculadora .calc-lines b { max-width: 55%; }
  body[data-canary-mobile="home"] #calculadora .calc-workspace > #calculator-journey {
    position: static; inset: auto; display: grid; margin: 0; padding: 16px;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 0 12px;
    background: #081c2e; border-bottom: 1px solid #49677c;
  }
  body[data-canary-mobile="home"] #calculadora .journey-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; font-size: 14px; }
  body[data-canary-mobile="home"] #calculadora .journey-heading .video-control { min-height: 44px; font-size: 14px; padding: 8px; }
  body[data-canary-mobile="home"] #calculadora .calc-workspace > #calculator-journey .process-video-card { grid-row: 2; width: 100%; }
  body[data-canary-mobile="home"] #calculadora .calc-workspace > #calculator-journey .journey-copy { margin-top: 0; }
  body[data-canary-mobile="home"] #calculadora .journey-copy strong { font-size: 16px; line-height: 1.4; }
  body[data-canary-mobile="home"] #calculadora .journey-copy p { font-size: 14px; line-height: 1.5; }
  body[data-canary-mobile="home"] #calculadora .calc-workspace > #calculator-journey .journey-progress { margin-top: 12px; grid-column: 1 / -1; }
  body[data-canary-mobile="home"] #calculadora .journey-progress li { font-size: 12px; line-height: 1.5; }
  body[data-canary-mobile="home"] #calculadora .journey-note { grid-column: 1 / -1; margin-top: 10px; font-size: 12px; line-height: 1.5; }
  body[data-canary-mobile="home"] #calculadora .journey-logo img { width: min(65px, 100%); }

  /* Authentication and customer portal. */
  body[data-canary-mobile="auth"] .top { height: auto; min-height: 76px; padding: 16px 20px; gap: 16px; }
  body[data-canary-mobile="auth"] .top .brand img { height: auto; max-width: 180px; width: 100%; }
  body[data-canary-mobile="auth"] .auth-shell { padding: 32px 20px 48px; }
  body[data-canary-mobile="auth"] .auth-card { padding: 28px 20px; border-radius: 20px; }
  body[data-canary-mobile="auth"] .auth-card h1 { font-size: 28px; line-height: 1.25; margin: 16px 0; }
  body[data-canary-mobile="auth"] .auth-tabs a { min-height: 48px; font-size: 14px; }
  body[data-canary-mobile="auth"] .lead { font-size: 16px; line-height: 1.7; margin-bottom: 28px; }
  body[data-canary-mobile="auth"] .field { margin: 22px 0; }
  body[data-canary-mobile="auth"] .auth-card .form-grid .field { margin: 0; }
  body[data-canary-mobile="auth"] :is(.required-flow, .destination-summary, .choice-grid, .auth-journey) { gap: 16px; }
  body[data-canary-mobile="auth"] :is(.switch, .required-step, .auth-journey, .auth-journey > div) { font-size: 14px; line-height: 1.6; }
  body[data-canary-mobile="auth"] .auth-card .btn { min-height: 52px; margin-top: 20px; }
  body[data-canary-mobile="portal"] .shell { display: block; }
  body[data-canary-mobile="portal"] .main { padding-bottom: 0; }
  body[data-canary-mobile="portal"] .topbar { min-height: 72px; height: auto; padding: 12px 20px; gap: 12px; }
  body[data-canary-mobile="portal"] .toplinks { display: none; }
  body[data-canary-mobile="portal"] .lang button { min-height: 44px; min-width: 40px; font-size: 14px; }
  body[data-canary-mobile="portal"] :is(.bell, #logout, .logout) { min-height: 44px; min-width: 44px; }
  body[data-canary-mobile="portal"] .content { padding: 28px 20px calc(128px + env(safe-area-inset-bottom, 0px)); }
  body[data-canary-mobile="portal"] .sidebar {
    position: fixed; inset: auto 0 0; width: 100%; height: auto;
    padding: 10px 8px calc(10px + env(safe-area-inset-bottom, 0px)); border-right: 0; border-top: 1px solid #315771;
  }
  body[data-canary-mobile="portal"] .sidebar .nav { display: flex; gap: 8px; overflow-x: auto; justify-content: flex-start; }
  body[data-canary-mobile="portal"] .navbtn { flex: 0 0 108px; min-width: 108px; min-height: 76px; padding: 10px 8px; gap: 6px; flex-direction: column; }
  body[data-canary-mobile="portal"] .navbtn span { display: block; font-size: 12px; line-height: 1.4; white-space: normal; }
  body[data-canary-mobile="portal"] :is(.portal-priority, .ref-hero, .ref-grid, .dashboard, .overview-layout, .overview-right, .delivery-columns, .consolidation-card) { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  body[data-canary-mobile="portal"] :is(.panel, .ref-block, .payment-spotlight, .priority-steps, .nextcard, .paycard) { padding: 24px 20px; border-radius: 18px; margin-bottom: 24px; }
  body[data-canary-mobile="portal"] :is(h1, .ref-title) { font-size: 28px; line-height: 1.25; }
  body[data-canary-mobile="portal"] :is(.panel-head h2, .ref-block h3) { font-size: 21px; line-height: 1.4; }
  body[data-canary-mobile="portal"] :is(.ref-sub, .ref-card .meta, .ref-card .title, .next-main b, .next-main span, .notice-item b, .notice-item small) { font-size: 15px; line-height: 1.65; }
  body[data-canary-mobile="portal"] :is(.stats, .ref-stats, .consolidation-info) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  body[data-canary-mobile="portal"] :is(.stat, .ref-stat) { padding: 18px 14px; border-radius: 16px; }
  body[data-canary-mobile="portal"] :is(.stat small, .stat span, .ref-stat .name, .ref-stat .help) { font-size: 14px; line-height: 1.5; }
  body[data-canary-mobile="portal"] :is(.products, .ref-products, .ref-products.transit, .payment-facts) { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body[data-canary-mobile="portal"] .ref-card { padding: 18px; gap: 14px; }
  body[data-canary-mobile="portal"] .product-body { padding: 20px; }
  body[data-canary-mobile="portal"] .pill { font-size: 12px; line-height: 1.5; white-space: normal; }
  body[data-canary-mobile="portal"] :is(.flow, .purchase-progress) { overflow-x: auto; padding-bottom: 12px; gap: 12px; }
  body[data-canary-mobile="portal"] .flow { grid-template-columns: repeat(8, 104px); }
  body[data-canary-mobile="portal"] .step b { font-size: 14px; line-height: 1.5; }
  body[data-canary-mobile="portal"] .step small { font-size: 12px; line-height: 1.5; }
  body[data-canary-mobile="portal"] .cta-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  body[data-canary-mobile="portal"] .cta-row .btn { width: 100%; min-height: 52px; }
  body[data-canary-mobile="portal"] .login { padding: 32px 20px; }
  body[data-canary-mobile="portal"] .loginbox { width: 100%; padding: 28px 20px; border-radius: 20px; }
  body[data-canary-mobile="portal"] .loginbox .brand { display: flex; max-width: 100%; }
  body[data-canary-mobile="portal"] .loginbox .brand-logo-full { max-width: 100%; height: auto; }
  body[data-canary-mobile="portal"] .login-actions { flex-direction: column; align-items: stretch; gap: 18px; }
  body[data-canary-mobile="portal"] .login-actions .btn { width: 100%; min-height: 52px; }
  body[data-canary-mobile="portal"] .login-actions a { margin-left: 0; font-size: 14px; text-align: center; padding: 8px 0; }
  body[data-canary-mobile="portal"] .modal { padding: 12px; }
  body[data-canary-mobile="portal"] .modalbox { width: 100%; max-height: calc(100dvh - 24px); padding: 24px 20px; }
  body[data-canary-mobile="portal"] .modal .formgrid { max-height: none; overflow: visible; padding: 0; gap: 20px; }
  body[data-canary-mobile="portal"] .x { min-width: 48px; flex-shrink: 0; }
  body[data-canary-mobile="portal"] .toast { left: 20px; right: 20px; bottom: calc(120px + env(safe-area-inset-bottom, 0px)); max-width: none; font-size: 14px; }

  /* The original staff CRM also keeps all navigation accessible on a phone. */
  body[data-canary-mobile="crm"] .top { height: auto; min-height: 76px; padding: 16px 20px; flex-wrap: wrap; gap: 16px; }
  body[data-canary-mobile="crm"] .top img { height: auto; width: 180px; max-width: 100%; }
  body[data-canary-mobile="crm"] .tools { width: 100%; flex-wrap: wrap; gap: 12px; }
  body[data-canary-mobile="crm"] .tools .alt { display: inline-flex; align-items: center; justify-content: center; }
  body[data-canary-mobile="crm"] #syncInfo { width: 100%; font-size: 13px; }
  body[data-canary-mobile="crm"] .layout { grid-template-columns: minmax(0, 1fr); }
  body[data-canary-mobile="crm"] .side { display: block; padding: 16px 20px; border-right: 0; border-bottom: 1px solid #31516a; }
  body[data-canary-mobile="crm"] .side :is(.who, .panel) { display: none; }
  body[data-canary-mobile="crm"] .nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body[data-canary-mobile="crm"] .nav button { min-height: 48px; padding: 12px; font-size: 14px; }
  body[data-canary-mobile="crm"] .main { padding: 28px 20px 48px; }
  body[data-canary-mobile="crm"] .head { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; }
  body[data-canary-mobile="crm"] .head h1 { font-size: 28px; line-height: 1.25; }
  body[data-canary-mobile="crm"] :is(.grid, .detail-grid, .form, .meta-layout, .meta-chat-layout) { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  body[data-canary-mobile="crm"] :is(.stats, .meta-stats) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  body[data-canary-mobile="crm"] .stat { padding: 18px 14px; }
  body[data-canary-mobile="crm"] .stat small { font-size: 14px; line-height: 1.5; }
  body[data-canary-mobile="crm"] .panel { padding: 24px 20px; margin-bottom: 24px; }
  body[data-canary-mobile="crm"] .panel h2 { font-size: 20px; line-height: 1.4; }
  body[data-canary-mobile="crm"] :is(.quick, .button-row, .dialog-actions) { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  body[data-canary-mobile="crm"] .quick button { padding: 20px; }
  body[data-canary-mobile="crm"] :is(.quick small, .table, .detail b, .event small, .meta-note) { font-size: 14px; line-height: 1.6; }
  body[data-canary-mobile="crm"] :is(.table th, .detail small, .pill) { font-size: 12px; line-height: 1.5; }
  body[data-canary-mobile="crm"] .table-wrap { max-width: 100%; overflow-x: auto; }
  body[data-canary-mobile="crm"] .table td { padding: 14px 10px; }
  body[data-canary-mobile="crm"] .search { height: 52px; margin-bottom: 20px; }
  body[data-canary-mobile="crm"] .modal { padding: 12px; }
  body[data-canary-mobile="crm"] .dialog { max-height: calc(100dvh - 24px); padding: 24px 20px; }

  /* Information, payment, tracking, island landing pages and legal documents. */
  body[data-canary-mobile="info"] .nav { min-height: 84px; width: calc(100% - 40px); gap: 16px; }
  body[data-canary-mobile="info"] .nav img { width: min(170px, 42vw); height: auto; }
  body[data-canary-mobile="info"] .nav .cta { font-size: 14px; padding: 12px; min-height: 48px; }
  body[data-canary-mobile="info"] .hero { padding: 52px 20px 44px; }
  body[data-canary-mobile="info"] h1 { font-size: 34px; line-height: 1.15; letter-spacing: -.025em; }
  body[data-canary-mobile="info"] .lead { font-size: 17px; line-height: 1.75; }
  body[data-canary-mobile="info"] .content { padding: 48px 20px 64px; }
  body[data-canary-mobile="info"] .content h2 { font-size: 25px; line-height: 1.35; margin-bottom: 18px; }
  body[data-canary-mobile="info"] :is(.card, .lead-form) { padding: 24px 20px; margin: 28px 0; }
  body[data-canary-mobile="info"] .actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
  body[data-canary-mobile="info"] .actions .btn { justify-content: center; min-height: 52px; }
  body[data-canary-mobile="info"] .steps { padding-left: 20px; gap: 18px; }
  body[data-canary-mobile="info"] .steps li { padding: 20px; }
  body[data-canary-mobile="info"] .footer { font-size: 14px; line-height: 1.7; padding: 32px 20px; }
  body[data-canary-mobile="tracking"] .top { padding: 16px 20px; min-height: 76px; height: auto; }
  body[data-canary-mobile="tracking"] .top img { height: auto; width: 180px; max-width: 100%; }
  body[data-canary-mobile="tracking"] .wrap { width: calc(100% - 40px); margin: 40px auto 64px; }
  body[data-canary-mobile="tracking"] .card { padding: 28px 20px; }
  body[data-canary-mobile="tracking"] h1 { font-size: 28px; line-height: 1.3; }
  body[data-canary-mobile="tracking"] form { display: grid; gap: 16px; margin: 28px 0; }
  body[data-canary-mobile="tracking"] .btn { min-height: 52px; }
  body[data-canary-mobile="tracking"] .event { padding-bottom: 28px; }
  body[data-canary-mobile="payment"] header { padding: 32px 20px; }
  body[data-canary-mobile="payment"] header h1 { font-size: 28px; line-height: 1.3; }
  body[data-canary-mobile="payment"] main { padding: 32px 20px 48px; }
  body[data-canary-mobile="payment"] .card { padding: 24px 20px; margin-bottom: 24px; border-radius: 16px; }
  body[data-canary-mobile="payment"] :is(.nota, .aviso, .ref, footer) { font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
  body[data-canary-mobile="payment"] :is(label, .btn) { font-size: 16px; }
  body[data-canary-mobile="payment"] .btn { width: 100%; min-height: 52px; padding: 14px 18px; margin-top: 12px; }
  body[data-canary-mobile="payment"] .metodos span { font-size: 13px; padding: 8px 12px; }
  body[data-canary-mobile="payment"] footer { padding: 0 20px 40px; }
  body[data-canary-mobile="document"] { font-weight: 400; }
  body[data-canary-mobile="document"] :is(.legal-hero, .lp-hero) { padding: 44px 20px 36px; }
  body[data-canary-mobile="document"] :is(main, main.lp) { padding: 40px 20px 64px; }
  body[data-canary-mobile="document"] :is(.legal-hero h1, .lp-hero h1) { font-size: 30px; line-height: 1.25; }
  body[data-canary-mobile="document"] :is(.legal-hero a.back, .lp-hero .kick) { font-size: 13px; line-height: 1.6; letter-spacing: .04em; }
  body[data-canary-mobile="document"] .lp-cta { display: block; text-align: center; font-size: 14px; line-height: 1.6; letter-spacing: .02em; padding: 14px 18px; min-height: 52px; margin: 20px 0 0; }
  body[data-canary-mobile="document"] .lp-cta.ghost { margin-left: 0; }
  body[data-canary-mobile="document"] :is(.datos, .box, .cierre, .aviso) { padding: 24px 20px; border-radius: 12px; }
  body[data-canary-mobile="document"] h2 { margin-top: 36px; font-size: 24px; line-height: 1.4; }
  body[data-canary-mobile="document"] h3 { font-size: 18px; line-height: 1.5; }
  body[data-canary-mobile="document"] table { display: block; max-width: 100%; overflow-x: auto; font-size: 14px; }
  body[data-canary-mobile="document"] th { font-size: 12px; letter-spacing: .03em; }
  body[data-canary-mobile="document"] .links-rel a { min-height: 44px; font-size: 14px; padding: 10px 14px; }
  body[data-canary-mobile="document"] .legal-foot { padding: 28px 20px 48px; font-size: 14px; }
  body[data-canary-mobile="document"] .legal-foot a { padding: 8px 0; }
}

@media screen and (max-width: 380px) {
  body[data-canary-mobile="home"] #calculadora .dims { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  body[data-canary-mobile="portal"] :is(.stats, .ref-stats, .consolidation-info) { grid-template-columns: minmax(0, 1fr); }
  body[data-canary-mobile="crm"] :is(.stats, .meta-stats, .nav) { grid-template-columns: minmax(0, 1fr); }
}
