:root {
  --green: #e1e723;
  --black: #0c0c0c;
  --deep: #111;
  --gray: #747474;
  --line: #c9c9c9;
  --cloud: #f1f1f1;
  --white: #fdfdfd;
  --page: 1376px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--black); background: #fff; font-family: "Ryobi Roboto", Avenir, Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
img, video, svg { display: block; max-width: 100%; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.page-width { width: min(var(--page), calc(100% - 64px)); margin-inline: auto; }
.announcement { height: 32px; display: grid; place-items: center; color: #000; background: var(--green); font-size: 16px; line-height: 20px; font-weight: 700; }

.site-header { position: relative; z-index: 30; color: #fff; background: var(--black); }
.header-main { height: 86px; max-width: 1376px; margin: 0 auto; position: relative; display: grid; grid-template-columns: 410px 1fr 410px; align-items: center; padding: 0 0; }
.brand-link { justify-self: center; grid-column: 2; }
.brand-logo { width: 200px; height: 54px; fill: #fff; }
.header-search { height: 46px; background: #fff; color: var(--black); display: flex; align-items: center; }
.desktop-search { width: 390px; grid-column: 1; grid-row: 1; }
.header-search input { width: 100%; height: 100%; border: 0; outline: none; padding: 0 16px 0 10px; color: #303030; background: #fff; font-size: 14px; }
.search-icon { width: 19px; height: 19px; flex: 0 0 19px; margin-left: 16px; border: 3px solid #161616; border-radius: 50%; position: relative; }
.search-icon::after { content: ""; width: 7px; height: 3px; position: absolute; right: -6px; bottom: -3px; background: #161616; transform: rotate(45deg); }
.header-links { grid-column: 3; grid-row: 1; justify-self: end; display: flex; align-items: center; gap: 24px; font-weight: 500; }
.header-links a:hover, .primary-nav a:hover { color: var(--green); }
.world-icon { font-size: 11px; width: 20px; height: 20px; display: inline-grid; place-items: center; border: 2px solid #fff; border-radius: 50%; margin-right: 8px; color: transparent; }
.cart-button { border: 0; background: transparent; padding: 0; }
.cart-button svg { width: 37px; height: 32px; fill: var(--green); }
.primary-nav { height: 52px; max-width: 1400px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; font-size: 16px; line-height: 20px; font-weight: 500; }
.mobile-search, .menu-button, .mobile-menu { display: none; }

.product-shell { min-height: 805px; display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding-top: 48px; }
.gallery { min-width: 0; }
.gallery-stage { height: 540px; position: relative; display: grid; place-items: center; overflow: hidden; }
.gallery-main { width: min(600px, 92%); height: min(600px, 92%); object-fit: contain; transition: opacity .16s ease; }
.gallery-main.switching { opacity: .35; }
.gallery-arrow { width: 24px; height: 28px; display: grid; place-items: center; position: absolute; z-index: 2; top: 50%; transform: translateY(-50%); border: 0; color: var(--green); background: var(--black); font-size: 24px; line-height: 1; }
.gallery-arrow.prev { left: 8px; }
.gallery-arrow.next { right: 8px; }
.zoom-caption { margin: 9px 0 14px; text-align: center; font-size: 14px; line-height: 18px; font-weight: 500; }
.gallery-thumbs { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; padding: 0 8px 8px; }
.gallery-thumbs::-webkit-scrollbar { display: none; }
.thumb { flex: 0 0 92px; width: 92px; height: 92px; padding: 0; border: 1px solid #ddd; background: #fff; }
.thumb.active { border: 2px solid var(--black); }
.thumb img { width: 100%; height: 100%; object-fit: cover; }

.product-info { padding: 2px 8px 40px 0; }
.one-badge { width: 114px; height: auto; margin-bottom: 12px; }
.product-info h1 { margin: 0 0 12px; font-family: "Ryobi Futura PT", sans-serif; font-size: 28px; line-height: 30px; font-weight: 700; text-transform: uppercase; }
.sku { margin: 0 0 18px; font-size: 12px; line-height: 16px; font-weight: 600; }
.rating-row { display: flex; align-items: center; gap: 11px; min-height: 25px; margin-bottom: 14px; font-family: "Ryobi Futura PT", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; line-height: 16px; font-weight: 400; }
.stars, .small-stars { letter-spacing: -1px; color: #000; font-size: 20px; white-space: nowrap; }
.small-stars { font-size: 13px; }
.text-action { border: 0; padding: 0; background: transparent; text-decoration: none; }
.write-review { margin-left: 4px; }
.price-badge { display: inline-block; background: var(--green); padding: 3px 5px 2px; font-size: 12px; line-height: 16px; font-weight: 500; text-transform: capitalize; }
.price { margin: 27px 0 12px; font-family: "Ryobi Futura PT", sans-serif; font-size: 28px; line-height: 30px; font-weight: 700; text-transform: uppercase; }
.add-cart, .product-card > button { border: 0; color: var(--green); background: var(--black); font-family: "Ryobi Futura PT", sans-serif; font-weight: 600; }
.add-cart { width: 243px; height: 36px; margin-bottom: 23px; font-size: 20px; line-height: 24px; }
.selling-points { list-style: none; padding: 0; margin: 0 0 32px; }
.selling-points li { position: relative; min-height: 27px; padding: 3px 0 3px 29px; margin-bottom: 8px; font-size: 16px; line-height: 28px; }
.selling-points li::before { content: "✓"; position: absolute; left: 0; top: 2px; width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: var(--green); background: var(--black); font-size: 12px; font-weight: 900; }
.accordions { border-top: 2px solid var(--black); }
.accordions details { border-bottom: 2px solid var(--black); }
.accordions summary { min-height: 47px; display: flex; align-items: center; justify-content: space-between; padding: 0 8px; list-style: none; font-size: 16px; line-height: 24px; font-weight: 400; }
.accordions summary::-webkit-details-marker { display: none; }
.accordions summary::after { content: "+"; font-size: 22px; font-weight: 400; }
.accordions details[open] summary::after { content: "−"; }
.accordions details p { padding: 0 9px 17px; margin: 0; font-size: 16px; line-height: 24px; }

.section { padding-top: 48px; }
.section-title, .wide-heading h2 { margin: 0 0 28px; text-align: center; font-family: "Ryobi Futura PT", sans-serif; font-size: 28px; line-height: 30px; font-weight: 700; text-transform: uppercase; }
.horizontal-track { display: flex; gap: 16px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.horizontal-track::-webkit-scrollbar { display: none; }
.feature-track { align-items: flex-start; padding-bottom: 14px; }
.feature-card { flex: 0 0 calc((100% - 48px) / 4); scroll-snap-align: start; }
.feature-card img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
.feature-card h3 { margin: 14px 0 5px; font-size: 20px; line-height: 24px; font-weight: 900; }
.feature-card p { margin: 0; font-size: 16px; line-height: 20px; }

.oneplus-panel { min-height: 280px; margin-top: 62px; display: grid; grid-template-columns: 1fr 1.1fr; border: 1px solid #777; overflow: hidden; }
.oneplus-media { min-width: 0; background: #222; overflow: hidden; }
.oneplus-media video { width: 100%; height: 100%; object-fit: cover; }
.oneplus-copy { padding: 34px 48px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.oneplus-copy img { width: 150px; margin-bottom: 19px; }
.oneplus-copy h2 { margin: 0 0 18px; font-family: "Ryobi Futura PT", sans-serif; font-size: 18px; line-height: 18px; font-weight: 700; }
.oneplus-copy p { max-width: 610px; margin: 0 0 17px; font-size: 16px; line-height: 20px; }
.black-link { min-width: 282px; height: 40px; border: 0; padding: 0 18px; color: var(--green); background: var(--black); font-family: "Ryobi Futura PT", sans-serif; font-size: 20px; line-height: 24px; font-weight: 600; }

.resources { padding-top: 58px; }
.resource-card { flex: 1 0 0; min-height: 258px; padding: 23px 24px 20px; color: #fff; background: var(--black); }
.resource-icon { width: 50px; height: 50px; display: grid; place-items: center; border: 2px solid var(--green); border-radius: 50%; color: var(--green); font-size: 25px; }
.resource-card h3 { margin: 17px 0 18px; font-family: "Ryobi Futura PT", sans-serif; font-size: 22px; line-height: 18px; }
.resource-card p { min-height: 58px; margin: 0 0 20px; font-size: 16px; line-height: 20px; }
.resource-card button { width: 100%; border: 0; border-top: 1px solid var(--green); padding: 16px 0 0; color: #fff; background: transparent; text-align: left; font-family: "Ryobi Futura PT", sans-serif; font-size: 16px; line-height: 20px; font-weight: 600; }

.products-section { padding-top: 54px; }
.wide-heading { width: min(1376px, calc(100% - 64px)); margin-inline: auto; }
.wide-heading h2 { margin-bottom: 14px; text-align: left; }
.product-track { gap: 16px; padding: 0 32px 4px; }
.product-card { flex: 0 0 calc((100vw - 112px) / 6); min-width: 190px; min-height: 441px; position: relative; display: flex; flex-direction: column; padding: 8px 9px 9px; border: 1px solid #d1d1d1; cursor: pointer; scroll-snap-align: start; }
.product-card:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.card-image { height: 250px; display: grid; place-items: center; margin: -8px -9px 10px; overflow: hidden; background: #fff; }
.card-image img { width: 100%; height: 100%; object-fit: contain; }
.product-card .price-badge { align-self: flex-start; margin-bottom: 5px; }
.product-card h3 { margin: 0 0 7px; font-size: 14px; line-height: 16px; font-weight: 500; text-transform: uppercase; }
.card-sku { margin: 0; color: #757575; font-size: 14px; line-height: 20px; font-weight: 500; text-transform: uppercase; }
.product-card strong { font-size: 16px; line-height: 16px; }
.product-card del { color: #777; font-size: 14px; line-height: 20px; }
.product-card > button { width: calc(100% - 18px); height: 29px; position: absolute; bottom: 8px; left: 9px; font-size: 16px; line-height: 24px; }
.mini-badge { width: 58px; max-height: 20px; object-fit: contain; object-position: left; margin: 0 0 6px; }

.qa { padding-top: 63px; }
.qa > h3, .reviews > h3 { margin: 38px 0 26px; font-family: "Ryobi Futura PT", sans-serif; font-size: 20px; }
.ask-question { min-width: 202px; height: 36px; margin-bottom: 37px; font-size: 13px; }
.qa-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.qa-toolbar select, .review-controls select { height: 51px; min-width: 250px; padding: 0 15px; border: 1px solid #999; background: #fff; }
.question { padding: 24px 10px 28px; border-top: 1px solid #222; }
.question:last-child { border-bottom: 1px solid #222; }
.question h4 { margin: 0 0 12px; font-size: 14px; }
.question > strong { font-size: 13px; }
.question > p { margin: 9px 0; font-size: 13px; }
.answer-count { margin-top: 45px !important; }
.answer { margin: 36px 18px 0; font-size: 13px; }
.answer p { margin: 0 0 14px; }

.reviews { padding-top: 65px; padding-bottom: 62px; }
.authentic { color: #284878; margin: -7px 0 20px 10px; font-size: 13px; }
.authentic small { display: block; margin-left: 20px; font-size: 8px; }
.rating-summary { display: grid; grid-template-columns: 1fr .9fr 1.05fr; gap: 70px; padding: 0 14px 20px; }
.rating-summary h4, .review-controls h4 { margin: 0 0 12px; font-size: 15px; }
.snapshot > p { margin: 0 0 16px; font-size: 13px; }
.rating-bar { display: grid; grid-template-columns: 62px 1fr 35px; align-items: center; gap: 8px; margin: 7px 0; font-size: 12px; }
.rating-bar i { height: 14px; position: relative; overflow: hidden; border: 1px solid #d4d4d4; border-radius: 7px; background: #eee; }
.rating-bar i::before { content: ""; display: block; width: var(--fill); height: 100%; background: #171717; }
.rating-bar em { font-style: normal; }
.overall strong { display: block; float: left; margin-right: 18px; font-size: 45px; line-height: 1; font-weight: 400; }
.overall .stars { display: block; padding-top: 2px; }
.overall small { display: block; font-size: 12px; }
.rate-product div { display: flex; gap: 11px; }
.rate-product button { width: 50px; height: 50px; border: 1px solid #777; background: #fff; font-size: 27px; }
.rate-product p { font-size: 13px; }
.review-photo-shell { position: relative; margin: 0 0 18px; }
.review-photo-viewport { margin: 0; overflow-x: auto; cursor: grab; scroll-behavior: smooth; scroll-snap-type: x proximity; scrollbar-width: none; touch-action: pan-y; }
.review-photo-viewport.is-dragging { cursor: grabbing; scroll-behavior: auto; scroll-snap-type: none; user-select: none; }
.review-photo-viewport::-webkit-scrollbar { display: none; }
.review-photo-track { width: max-content; display: flex; }
.review-photo-track img { width: 175px; height: 175px; flex: 0 0 175px; box-sizing: border-box; padding: 2px; background: #fff; object-fit: cover; object-position: 50% 50%; scroll-snap-align: start; }
.review-photo-arrow { width: 36px; height: 44px; position: absolute; z-index: 2; top: 50%; transform: translateY(-50%); border: 0; color: var(--green); background: var(--black); font-size: 28px; line-height: 1; }
.review-photo-arrow.prev { left: 6px; }
.review-photo-arrow.next { right: 6px; }
.review-photo-arrow:disabled { opacity: .35; cursor: default; }
.review-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 20px; padding: 0 10px 25px; }
.review-controls h4 { flex-basis: 100%; margin-bottom: -5px; }
.review-controls select { min-width: 125px; height: 45px; }
.review-controls .sort { margin-left: auto; min-width: 250px; }
.reviews-count { padding: 10px; margin-bottom: 18px; font-size: 13px; }
.review { padding: 24px 20px 28px; border-top: 1px solid #222; font-size: 13px; }
.review[hidden] { display: none; }
.review .stars { margin-bottom: 2px; font-size: 16px; }
.review h4 { margin: 0 0 6px; font-size: 13px; }
.review > strong { font-size: 13px; }
.review p { margin: 8px 0 14px; }
.review-source-note { color: #666; font-size: 11px; font-style: italic; }
.brand-response { margin: 20px 0 8px; padding: 14px 16px; background: #f4f4f4; }
.brand-response p { margin-bottom: 0; }
.one-star { letter-spacing: 0; }
.review-inline-photos { display: flex; gap: 12px; margin: 20px 0; }
.review-inline-photos img { width: 170px; height: 120px; object-fit: cover; }
.review-pagination { display: flex; align-items: center; gap: 8px; padding: 14px 20px 0; }
.review-pagination span { margin-right: auto; font-size: 13px; }
.review-pagination button { width: 48px; height: 48px; border: 1px solid #111; background: #fff; font-size: 30px; }
.review-pagination button:disabled { border-color: #aaa; color: #aaa; }

.site-footer { color: #fff; background: #000; }
.footer-inner { width: 100%; min-height: 620px; display: grid; grid-template-columns: 204px repeat(4, 145px) minmax(0, 1fr); column-gap: 28px; row-gap: 32px; box-sizing: border-box; padding: 32px; }
.footer-brand { grid-column: 1; grid-row: 1; }
.footer-brand .brand-logo { width: 150px; height: 43px; display: block; margin-bottom: 32px; }
.socials { height: 24px; display: flex; align-items: center; gap: 19px; margin-bottom: 32px; }
.socials a { width: 24px; height: 24px; display: block; color: #fff; }
.socials img { width: 24px; height: 24px; display: block; }
.socials .facebook-link { margin-right: -8px; }
.home-depot { display: flex; align-items: center; gap: 14px; font-size: 13px; line-height: 16px; }
.home-depot img { width: 58px; height: 59px; display: block; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; font-size: 16px; line-height: 16px; }
.footer-column h3 { margin: 0 0 4px; font-family: "Ryobi Roboto", sans-serif; font-size: 16px; line-height: 12px; font-weight: 700; }
.footer-column h3:not(:first-child) { width: 318px; margin-top: 13px; }
.footer-support { grid-column: 2; }
.footer-support + .footer-column { grid-column: 3; }
.footer-support + .footer-column + .footer-column { grid-column: 4; }
.footer-support + .footer-column + .footer-column + .footer-column { grid-column: 5; }
.desktop-app-link { width: 318px; margin-top: 4px; }
.qr { width: 54px; height: 54px; object-fit: contain; }
.app-badges { display: none; }
.footer-legal { grid-column: 1 / 6; padding-top: 32px; border-top: 1px solid #eef08b; font-size: 14px; line-height: 18px; font-weight: 500; }
.footer-legal span { display: block; }
.footer-legal span + span { margin-top: 3px; }
@media (max-width: 1023px) {
  .page-width { width: calc(100% - 32px); }
  .header-main { grid-template-columns: 1fr auto 1fr; padding: 0 16px; }
  .desktop-search, .header-links a, .primary-nav { display: none; }
  .menu-button { width: 32px; height: 30px; grid-column: 1; grid-row: 1; display: flex; flex-direction: column; justify-content: space-around; justify-self: start; border: 0; padding: 2px; background: transparent; }
  .menu-button span { width: 28px; height: 3px; border-radius: 1px; background: #fff; }
  .brand-link { grid-column: 2; }
  .header-links { grid-column: 3; display: block; }
  .header-links .cart-button { display: block; }
  .mobile-search { display: flex; margin: 0 16px 14px; }
  .mobile-menu { position: absolute; inset: 100% 0 auto; z-index: 50; padding: 8px 16px 20px; color: #fff; background: #0c0c0c; border-top: 1px solid #444; box-shadow: 0 10px 18px #0005; }
  .mobile-menu:not([hidden]) { display: flex; flex-direction: column; }
  .mobile-menu a { padding: 13px 4px; border-bottom: 1px solid #444; font-weight: 500; }
  .product-shell { gap: 26px; }
  .product-card { flex-basis: calc((100vw - 80px) / 3); }
}

@media (max-width: 767px) {
  body { font-size: 16px; line-height: 24px; }
  .page-width { width: calc(100% - 32px); }
  .announcement { height: 24px; font-size: 12px; line-height: 16px; font-weight: 600; }
  .site-header { position: sticky; top: 0; }
  .header-main { height: 76px; }
  .brand-logo { width: 140px; height: 37px; }
  .cart-button svg { width: 35px; height: 31px; }
  .site-header { padding-bottom: 34px; }
  .mobile-search { height: 42px; margin: 0 16px; }
  .header-search input { font-size: 12px; }
  .search-icon { transform: scale(.8); margin-left: 12px; }

  .product-shell { min-height: 0; display: flex; flex-direction: column; gap: 0; padding-top: 25px; }
  .gallery-stage { height: 345px; }
  .gallery-main { width: 320px; height: 320px; }
  .gallery-arrow { display: none; }
  .zoom-caption { margin: 8px 0 21px; font-size: 14px; line-height: 18px; }
  .gallery-thumbs { gap: 12px; margin-right: -16px; padding: 0 0 7px; }
  .thumb { flex-basis: 50px; width: 50px; height: 50px; }
  .product-info { padding: 14px 0 0; }
  .one-badge { width: 115px; margin-bottom: 11px; }
  .product-info h1 { margin-bottom: 10px; font-size: 24px; line-height: 28px; }
  .sku { margin-bottom: 12px; font-size: 12px; line-height: 16px; }
  .rating-row { gap: 8px; margin-bottom: 12px; font-size: 16px; line-height: 16px; }
  .stars { font-size: 20px; }
  .write-review { margin-left: 5px; }
  .price-badge { font-size: 12px; line-height: 18px; }
  .product-info > .price-badge { display: block; width: max-content; margin-top: 13px; }
  .price { margin: 28px 0 18px; font-family: "Ryobi Roboto", sans-serif; font-size: 20px; line-height: 20px; font-weight: 700; text-transform: none; }
  .add-cart { width: 100%; height: 36px; margin-bottom: 23px; font-size: 16px; line-height: 20px; }
  .selling-points { margin-bottom: 27px; }
  .selling-points li { min-height: 32px; margin-bottom: 5px; padding-left: 27px; font-size: 14px; line-height: 24px; }
  .selling-points li::before { width: 18px; height: 18px; }
  .accordions summary { min-height: 45px; padding-left: 4px; font-size: 16px; line-height: 24px; font-weight: 400; }
  .accordions details p { font-size: 14px; line-height: 20px; }

  .section { padding-top: 68px; }
  .section-title, .wide-heading h2 { margin-bottom: 27px; font-size: 24px; line-height: 28px; }
  .features-section { padding-top: 48px; }
  .features-section .section-title { margin-bottom: 21px; }
  .feature-track { gap: 16px; margin-right: -16px; }
  .feature-card { flex-basis: 234px; }
  .feature-card h3 { margin: 13px 0 8px; font-size: 16px; line-height: 20px; font-weight: 700; }
  .feature-card p { font-size: 14px; line-height: 18px; }

  .oneplus-panel { width: calc(100% - 72px); min-height: 588px; margin-top: 102px; display: flex; flex-direction: column; }
  .oneplus-media { height: 314px; flex: 0 0 314px; }
  .oneplus-copy { min-height: 274px; padding: 20px 18px 24px; }
  .oneplus-copy img { width: 145px; margin-bottom: 15px; }
  .oneplus-copy h2 { margin-bottom: 19px; font-size: 22px; line-height: 22px; }
  .oneplus-copy p { margin-bottom: 16px; font-size: 14px; line-height: 18px; }
  .black-link { min-width: 235px; height: 39px; font-size: 20px; line-height: 24px; }

  .resources { padding-top: 63px; }
  .resource-track { gap: 14px; margin-right: -16px; }
  .resource-card { flex-basis: 250px; min-height: 312px; padding: 20px 22px; }
  .resource-icon { width: 48px; height: 48px; }
  .resource-card h3 { margin: 20px 0 16px; font-size: 22px; line-height: 22px; }
  .resource-card p { min-height: 88px; font-size: 14px; line-height: 18px; }

  .products-section { padding-top: 69px; }
  .wide-heading { width: calc(100% - 32px); }
  .wide-heading h2 { margin-bottom: 13px; text-align: center; }
  .product-track { gap: 10px; padding: 0 16px 2px; }
  .product-card { flex-basis: 205px; min-width: 205px; min-height: 455px; }
  .card-image { height: 268px; }
  .product-card h3 { font-size: 14px; line-height: 16px; font-weight: 500; }
  .product-card > button { font-size: 16px; line-height: 24px; }

  .qa { padding-top: 71px; }
  .qa > h3, .reviews > h3 { margin: 48px 0 30px; font-size: 17px; }
  .ask-question { width: 100%; margin-bottom: 34px; }
  .qa-toolbar { display: flex; flex-direction: column; align-items: stretch; gap: 37px; margin-bottom: 18px; }
  .qa-toolbar select { width: 100%; min-width: 0; height: 48px; }
  .question { padding: 36px 10px 46px; }
  .question h4 { font-size: 12px; line-height: 1.45; }
  .question > strong, .question > p, .answer { font-size: 12px; line-height: 1.45; }
  .answer-count { margin-top: 38px !important; }
  .answer { margin: 37px 16px 0; }

  .reviews { padding-top: 70px; padding-bottom: 58px; }
  .reviews > h3 { margin-top: 47px; }
  .authentic { margin-bottom: 22px; }
  .rating-summary { display: flex; flex-direction: column; gap: 26px; padding: 0 10px 18px; }
  .rating-summary h4 { font-size: 13px; }
  .rating-bar { grid-template-columns: 55px 1fr 30px; }
  .overall strong { font-size: 38px; }
  .rate-product button { width: 50px; height: 50px; }
  .rate-product p { font-size: 11px; }
  .review-photo-shell { margin-right: -16px; }
  .review-controls { display: flex; flex-direction: column; align-items: stretch; gap: 11px; padding: 0 10px 19px; }
  .review-controls h4 { flex-basis: auto; margin: 0 0 3px; }
  .review-controls select, .review-controls .sort { width: 100%; min-width: 0; height: 46px; margin-left: 0; }
  .reviews-count { text-align: center; scroll-margin-top: 158px; }
  .review { padding: 32px 10px 44px; font-size: 12px; line-height: 1.4; }
  .review h4, .review > strong { font-size: 12px; }
  .review-inline-photos { overflow-x: auto; }
  .review-inline-photos img { width: 170px; height: 150px; flex: 0 0 170px; }
  .review-pagination { padding-inline: 10px; }

  .footer-inner { min-height: 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 8px; row-gap: 32px; padding: 48px 16px 32px; }
  .footer-column { gap: 24px; font-size: 14px; line-height: 18px; }
  .footer-column h3 { margin: 0; font-size: 16px; line-height: 12px; }
  .footer-column h3:not(:first-child) { width: 100%; margin-top: 8px; }
  .footer-support { grid-column: 1; grid-row: 1; }
  .footer-support + .footer-column { grid-column: 2; grid-row: 1; }
  .footer-support + .footer-column + .footer-column { width: calc(200% + 8px); grid-column: 1; grid-row: 2; }
  .footer-support + .footer-column + .footer-column + .footer-column { grid-column: 2; grid-row: 2; }
  .desktop-app-link, .qr { display: none; }
  .app-badges { grid-column: 1 / 3; grid-row: 3; display: block; font-size: 16px; line-height: 24px; }
  .app-badges p { margin: 0 0 16px; }
  .app-badges div { height: 40px; display: flex; gap: 16px; }
  .app-badges img { width: auto; height: 40px; object-fit: contain; }
  .footer-brand { grid-column: 1 / 3; grid-row: 4; }
  .footer-brand .brand-logo { display: none; }
  .socials { gap: 12px; margin-bottom: 32px; }
  .home-depot { gap: 12px; font-size: 14px; line-height: 18px; }
  .footer-legal { min-height: 162px; grid-column: 1 / 3; grid-row: 5; box-sizing: border-box; padding-top: 32px; text-align: center; font-size: 14px; line-height: 18px; font-weight: 500; }
  .footer-legal span + span { margin-top: 0; }
}

@media (max-width: 410px) {
  .product-shell { width: calc(100% - 32px); }
  .gallery-stage { height: 340px; }
  .product-info h1 { font-size: 24px; }
  .feature-card { flex-basis: 234px; }
  .oneplus-panel { width: calc(100% - 32px); }
  .product-card { flex-basis: 205px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
