/* The supplied logo photograph is the brand asset in both page locations. */
.header .official-logo{width:92px;height:92px;max-height:none;aspect-ratio:1;object-fit:cover}
.footer .brand{background:transparent;padding:0}
.footer .official-logo{width:88px;height:88px;max-height:none;aspect-ratio:1;object-fit:cover}

@media(max-width:580px){
  html{max-width:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{min-width:0}
  .shell{padding-inline:12px}
  .header{height:82px;gap:16px}
  .header .brand{flex:none}
  .header .official-logo{width:62px;height:62px}
  .nav{min-width:0;gap:8px}
  .lang{min-width:76px;min-height:44px;padding:10px 12px;font-size:13px}
  .announcement{padding:9px 12px;font-size:10px;line-height:1.5;letter-spacing:.08em}
  .hero{padding:35px 5px 33px}
  .hero .eyebrow{font-size:10px;line-height:1.5;letter-spacing:.2em}
  .hero h1{font-size:clamp(40px,11.5vw,54px);line-height:1.02;margin-block:16px}
  .hero p{font-size:14px;line-height:1.7}
  .hero-rule{font-size:14px;gap:10px;margin-top:23px}
  .hero-rule:before,.hero-rule:after{width:26px;flex:none}
  .section-kicker h2{font-size:28px}
  .section-kicker span{font-size:10px;line-height:1.5;letter-spacing:.1em}
  .builder{min-width:0;grid-template-columns:minmax(0,1fr)}
  .preview{padding:15px 12px 18px;min-height:0;border-inline:0}
  .rtl .preview{border-inline:0}
  .preview-label{font-size:9px;line-height:1.5;letter-spacing:.12em;gap:12px}
  .preview-label span:last-child{flex:none}
  .product-view-controls{margin-top:12px;padding-bottom:9px;gap:7px}
  .view-choice{min-width:84px;min-height:44px;font-size:13px}
  .preview .product-stage{position:relative;top:auto;min-height:0;padding-top:14px;gap:12px;justify-content:flex-start}
  .product-stage>.product-svg{display:block;width:100%;height:auto;max-width:460px;max-height:none;aspect-ratio:1;flex:none}
  .selected-details{width:100%;max-width:400px;gap:3px 6px;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
  .selected-details>span{max-width:100%}
  .selected-color-dot{flex:none;width:12px;height:12px}
  .customizer{padding:23px 12px 5px;min-width:0}
  .step{grid-template-columns:20px minmax(0,1fr);gap:8px;margin-bottom:24px}
  .rtl .step{grid-template-columns:minmax(0,1fr) 20px}
  .step-no{font-size:16px}
  .step-title{gap:8px;flex-wrap:wrap;margin-bottom:11px}
  .step-title h3{font-size:12px;line-height:1.45;letter-spacing:.1em}
  .step-title small{font-size:11px;line-height:1.4}
  .product-types{gap:7px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .type-button{min-width:0;min-height:82px;padding:9px 7px;gap:7px;align-items:center}
  .type-button>span:last-child{min-width:0}
  .rtl .type-button{text-align:right}
  .type-icon{width:34px;height:42px}
  .type-name{display:block;font-size:15px;line-height:1.25}
  .type-description{font-size:11px;line-height:1.4;overflow-wrap:break-word}
  .swatches{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 7px}
  .swatch{min-width:44px;min-height:66px;padding:4px 2px;font-size:11px;line-height:1.3}
  .swatch-dot{width:40px;max-width:100%;height:35px;margin-bottom:7px}
  .swatch-name{min-height:27px}
  .hardware-type-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .hardware-type-choice{min-height:150px;flex-direction:column;justify-content:flex-start;gap:8px;padding:11px 8px;text-align:center}
  .rtl .hardware-type-choice{text-align:center}
  .hardware-stock-thumb{width:48px;height:66px}
  .hardware-type-choice strong{font-size:15px;line-height:1.25}
  .hardware-type-choice small{font-size:11px;line-height:1.4;margin-top:4px}
  .hardware-choice{min-height:52px;padding:9px 8px;font-size:16px;gap:8px}
  .letter-grid-wrap{max-height:none;overflow:visible;padding:2px}
  .letter-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
  .letter-choice{min-height:44px;padding:1px;aspect-ratio:1}
  .letter-choice-label{font-size:11px;min-width:15px}
  input.field,textarea.field,select,.checkout-form select{min-width:0;max-width:100%;min-height:48px;font-size:16px;line-height:1.4}
  .field{padding:12px}
  .engraving-finish-title{font-size:12px;line-height:1.45;margin-top:17px}
  .engraving-location-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .engraving-location-choice{min-height:62px;gap:7px;padding:9px 7px;font-size:12px;line-height:1.4}
  .engraving-location-choice svg{width:28px;height:28px}
  .engraving-location-choice span{min-width:0;overflow-wrap:break-word}
  .engraving-finish-choice{min-height:52px;font-size:12px;line-height:1.4;padding:10px 7px}
  .engraving-placement-note,.custom-note,.fineprint,.selection-summary{font-size:12px;line-height:1.6;overflow-wrap:anywhere}
  .summary{align-items:flex-start;flex-wrap:wrap;gap:6px 12px}
  .summary-name{font-size:21px;line-height:1.25}
  .summary-price{font-size:17px;line-height:1.5}
  .primary,.secondary{min-height:48px;padding:13px 12px;font-size:12px;line-height:1.4;letter-spacing:.06em}
  .actions{gap:9px}
  .custom-request{margin-top:24px;margin-bottom:36px;padding:23px 16px;gap:20px;min-width:0}
  .custom-request h2{font-size:29px;line-height:1.15}
  .custom-request p{font-size:14px;line-height:1.65}
  .request-form{min-width:0;gap:10px;grid-template-columns:minmax(0,1fr)}
  .request-form textarea{min-height:100px}
  .value-strip{padding-block:25px;margin-bottom:36px;gap:21px}
  .value-text{font-size:11px;line-height:1.5}
  .footer{padding-block:28px}
  .footer-inner{gap:18px}
  .footer-copy{font-size:16px}
  .footer small{font-size:11px}
  .notice{padding:12px}
  .modal{padding:27px 18px 20px;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
  .modal h2{padding-inline-end:24px;font-size:28px}
  .modal p{font-size:14px;line-height:1.6;overflow-wrap:anywhere}
  .modal .close{width:44px;height:44px;top:7px;right:7px}
  .rtl .modal .close{left:7px;right:auto}
  .checkout-form label{font-size:11px;line-height:1.5}
  button{touch-action:manipulation}
}

@media(max-width:379px){
  /* Five columns retain a 44 px touch target even at a 320 px viewport. */
  .letter-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .product-types{grid-template-columns:minmax(0,1fr)}
  .type-button{min-height:66px;padding:9px 11px}
  .type-icon{width:40px;height:42px}
  .hardware-type-choice{padding-inline:6px}
  .hardware-type-choice strong{font-size:14px}
  .engraving-location-choice{flex-direction:column;align-items:flex-start;gap:6px}
  .rtl .engraving-location-choice{align-items:flex-end}
}

@media(min-width:500px) and (max-width:580px){
  .letter-grid{grid-template-columns:repeat(7,minmax(0,1fr))}
}
