/* Deliberately scoped to the existing mobile breakpoint; tablet/desktop are untouched. */
@media(max-width:760px){
 .canon-home-view .canon-why h2.canon-display,
 .canon-home-view .canon-buy h2.canon-display{font-size:31px;max-width:none;white-space:nowrap}
 .canon-home-view .canon-why h2 br,
 .canon-home-view .canon-buy h2 br{display:none}

 .canon-hero--home h1{font-size:clamp(44px,13.53vw,79.2px)}
 .canon-hero--home .canon-hero__copy p{font-size:clamp(13px,3.35vw,20.5px)}
 .canon-hero--home .button{font-size:11px;padding:11px 14px;min-height:44px}

 /* Retain the original image scale/top edge and remove only empty floor below it. */
 .catalog-persistent > .canon-hero{aspect-ratio:auto;height:calc(177.6236vw - 75px)}
 .catalog-persistent > .canon-hero .canon-hero__picture{bottom:auto;height:177.6236vw}

 /* The photograph shares the intro row; the phone stays above the readable steps.
    Dynamic viewport height budgets the introduction rather than shrinking all text.
    Native scrolling remains available for exceptional short viewports or text zoom. */
 .pedidos-dialog{max-height:calc(100dvh - 32px)}
 .pedidos-shell{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(252px,1fr) auto auto;gap:10px;min-height:0;height:min(680px,calc(100dvh - 32px));padding:20px 16px 16px}
 .pedidos-content{display:contents}
 .pedidos-intro{grid-area:1/1;min-height:0;padding-left:0;position:relative}
 .pedidos-photo{position:absolute;inset:0;grid-area:auto;margin:0;pointer-events:none}
 /* Restore the supplied portrait photograph as ONE uninterrupted visual.
    Cover the entire shell, including steps and CTA, with one proportional image. */
 .pedidos-photo{overflow:hidden}
 .pedidos-photo img{position:absolute;top:calc(100% - 264px - 132cqw);left:0;right:auto;width:100%;height:calc(264px + 132cqw);max-width:none;object-fit:cover;object-position:center top;mask-image:none;-webkit-mask-image:none}
 .pedidos-intro h2{font-size:clamp(26px,8.1cqw,30px);padding-right:12px}
 .pedidos-brand{margin-top:12px;gap:3px}
 .pedidos-brand__word{width:40cqw}
 .pedidos-brand__market{width:26cqw}
 .pedidos-summary{width:32cqw;font-size:12px;line-height:1.2;margin-top:12px}
 .pedidos-steps{grid-area:2/1;gap:6px}
 .pedidos-step{grid-template-columns:28px minmax(0,1fr);gap:8px}
 .pedidos-step__number{width:28px;height:28px;font-size:18px}
 .pedidos-step__body{grid-template-columns:24px minmax(0,1fr);gap:7px;min-height:0;padding:6px 8px}
 .pedidos-step__icon{width:24px;height:24px}
 .pedidos-step__body h3{font-size:13px;line-height:1.2;margin-bottom:2px;letter-spacing:-.025em}
 .pedidos-step__body p{font-size:12px;line-height:1.22;letter-spacing:-.025em}
 .pedidos-step__body br{display:none}
 .pedidos-cta{grid-area:3/1;margin-top:0;min-height:44px;font-size:14px}

 /* Only real controls receive a compact, rounded keyboard focus treatment. */
 :is(a,button,input,select,textarea,[role="button"]){-webkit-tap-highlight-color:transparent}
 :is(a,button,input,select,textarea,[role="button"]):focus-visible,
 .product-dialog :is(button,[role="tabpanel"]):focus-visible,
 .footer .social-icon:focus-visible{outline:0;box-shadow:0 0 0 3px rgb(234 123 16 / .55)}
 .product-card:has(.product-link:focus-visible){outline:0;box-shadow:0 0 0 3px rgb(234 123 16 / .55)}
}
