/* Shared styles for every store page. Header: header.css; home: home.css; listings: catalog.css. */

/* Base */
/* One corner radius for the whole site: change it here (and in checkout.css, legal.css). */
:root{--radius:3px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:25px}
body{margin:0;color:#1a2233;background:#fff;font:16px/1.55 var(--store-font,Arial,sans-serif);-webkit-font-smoothing:antialiased}
h1,h2,h3{letter-spacing:-.01em}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
button,a,input,select{touch-action:manipulation}
button{cursor:pointer}
button:disabled{opacity:.5;cursor:not-allowed}
img{display:block;max-width:100%}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
main{padding:30px 0 70px}
.wrap{width:min(1240px,calc(100% - 48px));margin:auto}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;top:-100px}
.skip:focus{top:5px;background:#fff;padding:12px;z-index:10}
.eyebrow{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#6c7584;font-weight:700}
.empty{text-align:center;padding:60px 0}
.button{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:#fff;border:0;border-radius:var(--radius);padding:13px 22px;font-weight:700;transition:background .15s}
.button:hover{background:#022f78}
.breadcrumb{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;min-width:0;margin:0 0 18px;font-size:13px;line-height:1.4;color:#7a8494}
.breadcrumb>a{flex:none;white-space:nowrap}
/* The page itself (a long product name) is cut with "…" on every screen; the full name is in the title below. */
.breadcrumb [aria-current]{min-width:0;max-width:360px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.breadcrumb__sep{flex:none;width:14px;height:14px;fill:none;stroke:#9aa3b0;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.breadcrumb a:hover{color:var(--accent)}
.breadcrumb [aria-current]{color:#1a2233}

/* Form fields */
input:focus,input:focus-visible,select:focus,select:focus-visible,textarea:focus,textarea:focus-visible{outline:0}
input:not([type=checkbox]):not([type=radio]),select,textarea{transition:border-color .1s,box-shadow .1s}
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.float{position:relative;display:block;flex:1;min-width:0}
.float>span{position:absolute;left:14px;top:50%;max-width:calc(100% - 28px);overflow:hidden;font-size:15px;line-height:1.2;color:#7a8494;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;transform:translateY(-50%);transition:top .12s,font-size .12s,transform .12s,color .12s}
.float>input:focus+span,.float>input:not(:placeholder-shown)+span,.float>select+span{top:7px;font-size:11px;transform:none}
.float>input:focus+span,.float>select:focus+span{color:var(--accent)}

/* Product grid and card */
.product-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.product-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:0;border:1px solid #e0e4ea;border-radius:var(--radius);overflow:hidden;background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s}
@media(hover:hover) and (pointer:fine){.product-card:hover{border-color:#c3cad5;box-shadow:0 10px 24px #1a22331f;transform:translateY(-2px)}}
.product-card:has(h3 a:focus-visible){outline:3px solid var(--accent);outline-offset:2px}
.card-image{position:relative;display:block;overflow:hidden;background:#fff}
/* Photos of any shape are shown whole inside the square, never cropped. */
.card-image img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;transition:transform .4s,opacity .25s}
.card-image img.is-fill,.gallery-main img.is-fill,.cart-drawer .cart-item__image img.is-fill{object-fit:cover}
@media(hover:hover) and (pointer:fine){.product-card:hover .card-image img{transform:scale(1.04)}}
.card-image .card-image__hover{position:absolute;inset:0;height:100%;background:#fff;opacity:0}
@media(hover:hover) and (pointer:fine){.product-card:hover .card-image__hover{opacity:1}}
.card-ribbon{position:absolute;top:13px;left:-41px;width:130px;padding:3px 0;background:#d92d20;color:#fff;font-size:11px;font-weight:700;line-height:1.3;text-align:center;white-space:nowrap;transform:rotate(-45deg);box-shadow:0 1px 4px #00000033}
.card-ribbon--long{top:18px;left:-44px;width:156px}
.card-body{display:flex;flex:1;flex-direction:column;padding:12px 14px 14px}
.product-card h3{margin:0 0 6px;font-size:15px;font-weight:600;line-height:1.4;letter-spacing:-.005em;color:#1a2233;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
/* The title link covers the whole card, so a click anywhere opens the product. */
.product-card h3 a{-webkit-tap-highlight-color:transparent}
.product-card h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.product-card h3 a:focus-visible,.product-card h3 a:focus:not(:focus-visible){outline:0}
@media(hover:hover) and (pointer:fine){.product-card:hover h3 a{color:var(--accent)}}
.card-rating{display:flex;align-items:center;gap:6px;margin:auto 0 8px;font-size:13px;line-height:1.3;color:#7a8494}
.card-rating b{font-weight:600;color:#1a2233}
.card-rating--none{min-height:17px}
.card-rating--none.is-row-empty{min-height:0;margin-bottom:4px} /* nobody in the row has reviews (store.js): the price moves up under the name */
.card-rating__stars{position:relative;display:inline-block;font-size:14px;line-height:1;letter-spacing:1px;white-space:nowrap;color:#d5dae1}
.card-rating__stars::before{content:"★★★★★"}
.card-rating__stars::after{content:"★★★★★";position:absolute;top:0;left:0;width:var(--rate,0%);overflow:hidden;color:#f5a400}
.card-foot{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:4px 10px;}
.card-price{display:flex;align-items:baseline;gap:2px 8px;flex-wrap:wrap;margin:0}
.card-price small{font-size:.62em;font-weight:600;letter-spacing:0}
.card-price__low{flex-basis:100%;font-size:12px;line-height:1.4;color:#6b7482}
.card-price strong{font-size:22px;font-weight:700;line-height:1.15;letter-spacing:-.01em;white-space:nowrap}
.card-price--sale strong{color:#d92d20}
.card-price del{font-size:13px;line-height:1.4;color:#8a93a0;white-space:nowrap}
.card-stock{display:flex;align-items:center;gap:6px;margin:0;font-size:12px;line-height:1.4;color:#1a7f4b;white-space:nowrap}
.card-stock::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.card-stock--out{color:#8a93a0}
.product-card--empty{pointer-events:none}
.product-card--empty .card-image{aspect-ratio:1;background:#eceef1 center/40px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b6bdc8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.8'/%3E%3Cpath d='m4 18 5-5 4 4 3-3 4 4'/%3E%3C/svg%3E")}
.product-card--empty h3,.product-card--empty .card-price,.product-card--empty .card-stock{border-radius:var(--radius);background:#eceef1}
.product-card--empty h3{width:85%;min-height:0;height:15px;margin:6px 0 46px}
.product-card--empty .card-foot{margin-top:auto}
.product-card--empty .card-price{width:45%;height:26px}
.product-card--empty .card-stock{width:25%;height:11px}
.product-card--empty .card-stock::before{display:none}

/* Product page */
body.product main{padding-top:20px}
.product-detail{display:grid;grid-template-columns:1.15fr 1fr;gap:65px}
.product-detail>*{min-width:0}
.gallery-main{position:relative;display:block;width:100%;padding:0;border:0;background:#fff;border-radius:var(--radius);overflow:hidden;cursor:zoom-in}
.gallery-stage{position:relative}
.gallery-arrow{position:absolute;top:50%;display:grid;place-items:center;width:38px;height:42px;margin-top:-21px;padding:0;border:0;border-radius:var(--radius);background:#fff;color:var(--accent);box-shadow:0 1px 6px #1a223333;transition:background .15s;-webkit-tap-highlight-color:transparent}
.gallery-arrow:hover{background:#e8effb}
.gallery-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.gallery-arrow--prev{left:10px}
.gallery-arrow--next{right:10px}
.gallery-count{position:absolute;right:12px;bottom:12px;padding:3px 9px;border-radius:var(--radius);background:#1a2233cc;color:#fff;font-size:12px;font-weight:700;line-height:1.5;pointer-events:none}
.gallery-main__zoom{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#ffffffe6;color:#1a2233;box-shadow:0 2px 8px #1a223326;transition:background .15s,color .15s}
.gallery-main__zoom svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.gallery-main:hover .gallery-main__zoom{background:var(--accent);color:#fff}
.gallery-main img{width:100%;height:auto;aspect-ratio:1;object-fit:contain}
/* The strip scrolls without a visible bar; the arrows on the main photo bring the chosen thumbnail into view. */
.thumbnails{display:flex;gap:10px;max-width:100%;margin-top:16px;overflow:auto;padding:3px;scrollbar-width:none}
.thumbnails::-webkit-scrollbar{display:none}
.thumbnails button{flex:0 0 75px;background:#fff;border:1px solid #e3e7ed;border-radius:var(--radius);padding:4px}
.thumbnails button[aria-pressed=true]{border:2px solid var(--accent)}
.thumbnails img{height:65px;width:65px;object-fit:contain}
.purchase h1{font-size:32px;line-height:1.15;letter-spacing:-.8px;margin:0 0 10px}
.product-rating{display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;font-size:14px;line-height:1.3;color:#5d6775}
.product-rating b{color:#1a2233;font-weight:600}
.product-rating>span:last-child{text-decoration:underline}
.product-rating:hover>span:last-child{color:var(--accent)}
.product-rating .card-rating__stars{font-size:16px}
.sale-timer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px;padding:12px 16px;border-radius:var(--radius);background:var(--accent);color:#fff}
.sale-timer__label{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600}
.sale-timer__label svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sale-timer__clock{display:flex;align-items:center;gap:5px;font-variant-numeric:tabular-nums}
.sale-timer__clock b{min-width:42px;padding:6px 8px;border-radius:var(--radius);background:#fff;color:#d92d20;font-size:20px;line-height:1.2;text-align:center}
.sale-timer__clock i{font-style:normal;font-weight:700}
.detail-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:18px 0 0}
.product-rating+.detail-price{margin-top:2px} /* the rating keeps 12px under it; the price follows it closely */
.detail-price strong{font-size:40px;font-weight:700;line-height:1.1;letter-spacing:-.02em}
.detail-price--sale strong{color:#d92d20}
.detail-price del{font-size:18px;color:#7a8494}
.detail-price small{font-size:.62em;font-weight:600;letter-spacing:0}
/* Under the price: the lowest price of the 30 days before the discount, with an "i" that opens a short note. */
.lowest-price{margin:6px 0 0;color:#5d6775;font-size:13px;line-height:1.5}
.lowest-price[hidden]{display:none}
.lowest-price>p{margin:0}
.lowest-price span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.lowest-price b{color:#1a2233;font-weight:600}
.lowest-price button{display:grid;place-items:center;width:18px;height:18px;padding:0;border:1px solid #b8c0cb;border-radius:50%;background:#fff;color:#5d6775;font-size:11px;font-weight:700;line-height:1}
.lowest-price button[aria-expanded="true"]{border-color:#1a2233;color:#1a2233}
.lowest-price__note{margin:8px 0 0!important;padding:10px 12px;border-left:2px solid #1a2233;background:#f7f8fa;font-size:12.5px}
/* The saving on the main photo: a red ribbon across the top left corner, as on product cards. */
.gallery-ribbon{position:absolute;top:26px;left:-72px;z-index:1;display:flex;flex-direction:column;align-items:center;width:240px;padding:5px 0 6px;background:#d92d20;color:#fff;line-height:1.1;text-align:center;white-space:nowrap;transform:rotate(-45deg);box-shadow:0 1px 4px #00000033;pointer-events:none}
.gallery-ribbon small{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.gallery-ribbon b{font-size:16px;font-weight:800}
.gallery-ribbon[hidden]{display:none}
.models{margin:24px 0 0}
.models__title{margin:0 0 10px;font-size:15px;font-weight:700}
.models__list{display:grid;grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:10px}
.model{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;padding:16px 6px 12px;border:1px solid #dfe3e8;border-radius:var(--radius);background:#fff;text-align:center;transition:border-color .15s}
.model:hover{border-color:#8a93a0}
.model.is-current{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.model__name{font-size:15px;font-weight:600;line-height:1.25}
.model.is-current .model__name{color:var(--accent)}
.model__price{font-size:13px;color:#5d6775}
.model__badge{position:absolute;z-index:1;top:-9px;right:-1px;padding:1px 6px;border-radius:var(--radius);background:#ffc220;color:#1a2233;font-size:10px;font-weight:700;line-height:1.5;white-space:nowrap}
.activity{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none;font-size:14px;line-height:1.4}
.activity:empty{display:none}
.activity li{display:flex;align-items:center;gap:12px}
.activity svg{flex:none;width:22px;height:22px;fill:none;stroke:#1a2233;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.stock{margin:18px 0 0;font-size:14px;font-weight:600;color:#7a8494}
.buy-row{display:flex;gap:10px;margin:22px 0 0}
.buy-qty__label{display:none}
.buy-row .buy-qty{flex:none;align-self:stretch;height:56px;margin:0}
.buy-row .buy-qty button{width:44px;font-size:20px}
.buy-row .buy-qty input{width:46px;height:100%;padding:0;border:0;border-radius:0;background:none;text-align:center;font-size:16px;font-weight:600;-moz-appearance:textfield}
.buy-row .button{flex:1;min-height:56px;font-size:17px}
#buy-message{margin:8px 0 0;font-size:14px;color:#d92d20}
#buy-message:empty{display:none}
/* Delivery under the button: a thin frame with a clock, the time left to order and tomorrow's date. */
.delivery-cut{display:flex;gap:12px;margin:14px 0 0;padding:14px 16px;border:1px solid #d7dbe0;border-radius:var(--radius);font-size:15px;line-height:1.45}
.delivery-cut[hidden]{display:none}
.delivery-cut>svg{flex:none;width:20px;height:20px;margin-top:2px;fill:none;stroke:#1a2233;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.delivery-cut p{margin:0}
.delivery-cut time{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.delivery-cut b{color:rgb(22 128 65)}
.delivery-cut__note{margin-top:6px!important;color:#5d6775;font-size:13px}
.product-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:22px 0 0;list-style:none}
.product-benefits li{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;font-size:12px;line-height:1.3;color:#5d6775}
.product-benefits svg{flex:none;width:20px;height:20px;fill:none;stroke:#5d6775;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.product-benefits span{display:flex;flex-direction:column;min-width:0}
.product-benefits strong{font-size:13px;color:#1a2233}
/* Main parameters under the buy button, above the delivery row: plain "label: value" lines, no heading, lines or frame. */
.key-specs{display:grid;gap:3px;margin:28px 0 0}
.key-specs div{display:flex;flex-wrap:wrap;gap:0 6px;font-size:14px;line-height:1.45}
.key-specs dt{color:#5d6775}
.key-specs dt::after{content:":"}
.key-specs dd{margin:0;font-weight:600;overflow-wrap:anywhere}
/* A quiet link to the specification section further down, not a button that opens something here. */
.key-specs__more{display:inline-block;margin-top:6px;color:#5d6775;font-size:13.5px;text-decoration:underline;text-decoration-color:#c3c9d2;text-underline-offset:3px}
.key-specs__more:hover{color:var(--accent);text-decoration-color:currentColor}
/* Variants as small photos (templates/products/default.php): the chosen one has a blue frame, a sold-out one is faded. */
.variant-picker{display:grid;gap:8px;margin-top:18px}
.variant-picker__title{margin:0;color:#5d6775;font-size:14px}
.variant-picker__title b{color:#1a2233;font-weight:600}
.variant-picker__list{display:flex;flex-wrap:wrap;gap:8px}
.variant-swatch{display:block;width:60px;height:60px;padding:2px;border:1px solid #dce1e8;border-radius:var(--radius);background:#fff;cursor:pointer;transition:border-color .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}
.variant-swatch img{display:block;width:100%;height:100%;object-fit:contain}
.variant-swatch:hover{border-color:#9aa3b0}
.variant-swatch[aria-checked="true"],.variant-swatch[aria-current="page"]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.variant-swatch.is-out img{opacity:.4}
@media(max-width:650px){.variant-picker__list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.variant-swatch{width:auto;height:auto;aspect-ratio:1}} /* phones: four colours in a row, filling the width */
#add-product{gap:10px;background:rgb(27 154 78)}
#add-product:hover:not(:disabled){background:rgb(22 128 65)}
#add-product svg{flex:none;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Adding: a spinner in the button, then "Added" with a tick. */
#add-product.is-adding,#add-product.is-added{opacity:1;cursor:default}
#add-product.is-adding{position:relative;color:transparent}
#add-product.is-adding::after{content:"";position:absolute;top:50%;left:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border:3px solid #ffffff59;border-top-color:#fff;border-radius:50%;animation:rv-spin .7s linear infinite}
#add-product.is-added{background:rgb(22 128 65)}
#add-product.is-added svg{stroke-width:2.6}
.site-header__count.is-bump{animation:cart-bump .45s cubic-bezier(.3,1.6,.6,1)}
@keyframes cart-bump{0%{transform:scale(1)}40%{transform:scale(1.6)}100%{transform:scale(1)}}
/* Section tabs: stick under the header while the page scrolls, and store.js marks the section on screen.
   The white background and the line below reach both screen edges (shadows clipped to the strip's height). */
.section-nav{position:sticky;top:var(--section-nav-top,73px);z-index:15;display:flex;gap:4px;margin:40px 0 35px;background:#fff;box-shadow:0 -100vmax 0 100vmax #fff,0 -100vmax 0 calc(100vmax + 1px) #e5e8ed;clip-path:inset(0 -100vmax -1px);font-size:15px;font-weight:600;transition:clip-path .2s}
.section-nav.is-stuck{box-shadow:0 -100vmax 0 100vmax #fff,0 -100vmax 0 calc(100vmax + 1px) #e5e8ed,0 calc(4px - 100vmax) 12px 100vmax #0b1f3f17;clip-path:inset(0 -100vmax -18px)} /* the white and the line are pushed up by the spread, so below the strip there is only the soft shadow, not a white band over the text */
.section-nav a{flex:none;padding:13px 14px;color:#5d6775;box-shadow:inset 0 -3px transparent;transition:color .15s,box-shadow .15s}
.section-nav a:first-child{margin-left:-14px}
.section-nav a:hover{color:#1a2233}
.section-nav a.is-current{color:var(--accent);box-shadow:inset 0 -3px var(--accent)}
.description-section>p{max-width:850px;color:#65707e}
.editorial-feature{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center;margin:40px 0}
.editorial-feature img{width:100%;height:340px;object-fit:cover;border-radius:var(--radius)}
.editorial-feature:nth-of-type(even) img{order:2}
.editorial-feature h3{font-size:26px;line-height:1.25}
.editorial-feature p{color:#65707e}
/* Trust banner at the end of a product page, between the page and the footer: full width, touching the footer.
   The same pictures and proportions as on the home page. */
/* The footer blue behind the picture: at a fractional height (zoom, odd widths) no white hairline shows between them. */
.trust-banner{background:#00285a}
/* The picture is no wider than 1440 px and centred, as on the home page; on wider screens the footer blue fills the sides. */
.trust-banner picture{display:block;max-width:1440px;margin-inline:auto}
.trust-banner img{display:block;width:100%;height:auto;aspect-ratio:6/1;object-fit:cover;object-position:center}
@media(max-width:650px){.trust-banner{background:#002d65}.trust-banner img{aspect-ratio:auto;height:220px}}
.spec-section{margin:55px 0}
.spec-section h3{margin:22px 0 4px;color:var(--accent);font-size:16px}
.spec-section dl{max-width:900px;margin:0}.spec-section dl>div{display:grid;grid-template-columns:42% 58%;gap:16px;padding:11px 0;border-bottom:1px solid #eceef1;font-size:15px;line-height:1.45}
.spec-section dt{color:#5d6775}
.spec-section dd{margin:0;font-weight:600;overflow-wrap:anywhere}
/* The specification is folded to its first part by store.js; the button below opens the rest. */
.spec-clip{position:relative;overflow:hidden}
.spec-clip.is-folded{max-height:440px}
.spec-clip::after{content:"";position:absolute;right:0;bottom:0;left:0;height:130px;background:linear-gradient(#fff0,#fff);pointer-events:none;opacity:0;transition:opacity .35s}
.spec-clip.is-folded::after{opacity:1}
@media(prefers-reduced-motion:reduce){.spec-clip::after{transition:none}}
.spec-more{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:11px 20px;border:1.5px solid var(--accent);border-radius:var(--radius);background:#fff;color:var(--accent);font:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s}
.spec-more:hover{background:#eef3fa}
.spec-more[hidden]{display:none}
.spec-more svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.spec-more[aria-expanded="true"] svg{transform:rotate(180deg)}
.wide-gallery{grid-template-columns:1fr}
.wide-gallery .gallery-main img{height:600px;aspect-ratio:auto}
.wide-gallery .purchase{max-width:800px}
.alternative-layout .gallery{order:2}

/* Full-screen photo viewer */
/* Phones: price and "add to cart" at the bottom once the buy button has scrolled away (store.js). */
.buy-bar{display:none}
@media(max-width:650px){
.buy-bar{position:fixed;right:0;bottom:0;left:0;z-index:25;display:flex;align-items:center;gap:12px;padding:7px 12px calc(7px + env(safe-area-inset-bottom));border-top:1px solid #e5e8ed;background:#fff;box-shadow:0 -6px 16px #1a223317;transform:translateY(110%);transition:transform .25s ease}
.buy-bar[hidden]{display:none}
.buy-bar.is-on{transform:none}
.menu-open .buy-bar.is-on{transform:translateY(110%)}
.buy-bar__photo{flex:none;width:54px;height:54px;padding:3px;border:1px solid #e3e7ed;border-radius:var(--radius);background:#fff;object-fit:contain}
.buy-bar__info{display:flex;flex:1;flex-direction:column;min-width:0;line-height:1.2}
.buy-bar__prices{display:flex;flex-direction:column;align-items:flex-start;white-space:nowrap} /* the new price on top, the old one small under it */
.buy-bar__price{color:#d92d20;font-size:23px;font-weight:700;line-height:1.15}
.buy-bar__price small{font-size:.62em}
.buy-bar del{color:#8a93a0;font-size:13.5px;line-height:1.3}
.buy-bar del[hidden]{display:none}
.buy-bar__add{flex:none;gap:8px;min-height:46px;padding:0 16px;background:rgb(27 154 78);font-size:15px;white-space:nowrap;-webkit-tap-highlight-color:transparent}
.buy-bar__add:hover,.buy-bar__add:focus{background:rgb(27 154 78)}
.buy-bar__add:active{background:rgb(22 128 65)}
.buy-bar__add svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.buy-bar__add.is-adding{position:relative;color:transparent}
.buy-bar__add.is-adding::after{content:"";position:absolute;top:50%;left:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border:3px solid #ffffff59;border-top-color:#fff;border-radius:50%;animation:rv-spin .7s linear infinite}
body.has-buy-bar{padding-bottom:calc(70px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){.buy-bar{transition:none}}
/* Narrow phones: the price and photo step back a little so the price never runs under the button. */
@media(max-width:374px){.buy-bar{gap:10px}.buy-bar__photo{width:48px;height:48px}.buy-bar__price{font-size:20px}.buy-bar del{font-size:12.5px}.buy-bar__add{padding:0 12px}}
/* "Added to cart" window on a product page. */
.added{width:min(760px,calc(100% - 32px));max-height:calc(100% - 48px);padding:0;border:0;border-radius:var(--radius);background:#fff;color:#1a2233;box-shadow:0 24px 60px #0b1f3f40;overflow:hidden}
/* The window is a column: the green strip stays still, only the part below it scrolls. */
.added[open]{display:flex;flex-direction:column}
.added:focus{outline:0} /* the window itself takes focus when it opens; buttons inside keep their outline */
.added__body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:none}
.added__body::-webkit-scrollbar{display:none}
.added[open]{animation:added-in .28s cubic-bezier(.2,.8,.3,1)}
.added::backdrop{background:#0b1f3f80;animation:cart-fade .2s ease-out}
@keyframes added-in{from{opacity:0;transform:translateY(16px) scale(.97)}}
.added svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Light header in the tint of the tick icon, the icon before the title. */
.added__head{position:relative;z-index:1;flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;height:62px;padding:0 12px 0 22px;border-bottom:1px solid #c6ece2;background:#ecf9f5}
.added__title{display:flex;align-items:center;gap:10px;margin:0;color:#1a2233;font-size:22px;font-weight:700;line-height:24px} /* the text as tall as the tick */
.added__title svg{width:24px;height:24px;stroke:none}
/* Scrolled down: the strip becomes one short line — tick, small photo, name, "go to cart". */
.added__mini{display:none;flex:1;min-width:0;align-items:center;gap:12px}
.added__mini img{flex:none;width:40px;height:40px;object-fit:contain;border:1px solid #e3e7ed;border-radius:var(--radius);background:#fff}
.added__mini img.is-fill{object-fit:cover}
.added__mini-name{flex:1;min-width:0;overflow:hidden;font-size:14px;font-weight:600;white-space:nowrap;text-overflow:ellipsis}
.added__mini-cart{flex:none;padding:9px 14px;font-size:14px;cursor:pointer}
.added__head.is-compact{box-shadow:0 4px 12px #0b1f3f1a}
.added__head.is-compact .added__title{font-size:0;gap:0}
.added__head.is-compact .added__mini{display:flex;animation:added-mini .2s ease-out}
@keyframes added-mini{from{opacity:0;transform:translateY(-4px)}}
.added__close{display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:var(--radius);background:none;color:#1a2233;cursor:pointer}
.added__close:hover{color:#5d6775}
.added__close svg{width:22px;height:22px}
/* The added product: photo with a green tick, name and quantity, the price on the right. */
.added__item{display:grid;grid-template-columns:120px minmax(0,1fr) auto;align-items:center;gap:18px;margin:20px 22px 0}
.added__photo{position:relative;display:block;width:120px;height:120px;padding:6px;border:1px solid #e3e7ed;border-radius:var(--radius);background:#fff}
.added__photo img{display:block;width:100%;height:100%;object-fit:contain}
.added__photo img.is-fill{object-fit:cover}
.added__photo svg{display:none} /* the tick is next to the title */
.added__name{display:-webkit-box;margin:0 0 6px;overflow:hidden;font-size:16px;font-weight:700;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.added__qty{margin:0;color:#5d6775;font-size:14px}
.added__price{margin:0;color:#d92d20;font-size:24px;font-weight:700;white-space:nowrap}
.added__price small{font-size:.62em}
.added__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 22px 0}
.added__continue{padding:13px 16px;border:1.5px solid #c9d0da;border-radius:var(--radius);background:#fff;color:#1a2233;font:inherit;font-weight:700;cursor:pointer}
.added__continue:hover{border-color:#9aa3af}
.added__cart{justify-content:center;cursor:pointer}
.added__more{margin:24px 22px 12px;padding-top:18px;border-top:1px solid #e5e8ed;font-size:16px;font-weight:700}
.added__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:0 22px 22px}
.added__grid .product-card h3{font-size:13.5px}
.added__more-button{display:block;width:calc(100% - 44px);margin:0 22px 22px;padding:13px 16px;border:1.5px solid var(--accent);border-radius:var(--radius);background:#fff;color:var(--accent);font:inherit;font-weight:700;cursor:pointer;transition:background .15s}
.added__more-button:hover{background:#eef3fa}
.added__more-button[hidden]{display:none}
.added__more-button:disabled{opacity:.7;cursor:wait}
.added__error{margin:0 22px 12px;color:#b42318;font-size:14px}
.added__error[hidden]{display:none}
@media(max-width:650px){.added{width:100%;max-width:none;max-height:92%;margin:auto 0 0;border-radius:var(--radius) var(--radius) 0 0}.added__head{height:60px;padding:0 8px 0 16px}.added__title{font-size:20px}.added__item{grid-template-columns:88px minmax(0,1fr);gap:8px 14px;margin:16px 16px 0}.added__photo{width:88px;height:88px}.added__price{grid-column:2;margin-top:-4px;font-size:20px}.added__actions{margin-inline:16px}.added__actions{grid-template-columns:1fr}.added__cart{order:-1}.added__more{margin-inline:16px}.added__grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 16px 16px}.added__more-button{width:calc(100% - 32px);margin:0 16px 16px}}
@media(prefers-reduced-motion:reduce){.added[open],.added::backdrop{animation:none}}
.zoom{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:56px 72px 48px;border:0;background:#0b1320e3;color:#fff;overflow:hidden}
.zoom[open]{display:grid;place-items:center;animation:cart-fade .18s ease-out}
.zoom::backdrop{background:none}
.zoom:focus{outline:0}
.zoom,.zoom__image{touch-action:none}
.zoom__image{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;user-select:none;-webkit-user-drag:none;-webkit-touch-callout:none;transition:transform .2s ease-out}
.zoom button{position:absolute;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:#ffffff1f;color:#fff;transition:background .15s;-webkit-tap-highlight-color:transparent}
.zoom button:hover{background:#ffffff3d}
.zoom button:focus-visible{outline-color:#fff;outline-offset:2px}
.zoom svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.zoom__close{top:12px;right:16px}
.zoom__step{top:50%;margin-top:-22px}
.zoom__step--prev{left:16px}
.zoom__step--next{right:16px}
.zoom__count{position:absolute;left:0;right:0;bottom:14px;margin:0;text-align:center;font-size:14px;color:#c9d3e2;pointer-events:none}
.zoom--single .zoom__step,.zoom--single .zoom__count{display:none}

/* Reviews on the product page */
.reviews{margin:56px 0}
.reviews>h2{margin:0 0 20px;font-size:26px;font-weight:700;line-height:1.2;letter-spacing:-.02em}
.reviews__summary{display:grid;grid-template-columns:auto minmax(0,420px);gap:24px 64px;align-items:center;justify-content:space-between;margin:0 0 24px;padding:28px 32px;border:1px solid #e0e4ea;border-radius:var(--radius);background:#fff}
.reviews__score{display:flex;align-items:center;gap:20px}
.reviews__average{margin:0;font-size:56px;font-weight:700;line-height:1;letter-spacing:-.03em;color:#1a2233}
.reviews__score .card-rating__stars{font-size:24px}
.reviews__score p:last-child{margin:6px 0 0;font-size:14px;color:#5d6775}
.reviews__bars{margin:0}
.reviews__bars div{display:grid;grid-template-columns:30px minmax(0,1fr) 40px;gap:12px;align-items:center;padding:4px 0;font-size:13px;line-height:1.2;color:#5d6775}
.reviews__bars dt{display:flex;align-items:center;gap:4px;font-weight:600;color:#1a2233}
.reviews__bars dt span{font-size:12px;color:#f5a400}
.reviews__bars dd{margin:0}
.reviews__bars dd:first-of-type{height:8px;border-radius:var(--radius);overflow:hidden;background:#eceef1}
.reviews__bars dd:first-of-type span{display:block;height:100%;border-radius:var(--radius);background:#f5a400}
.reviews__bars dd:last-child{text-align:right;font-variant-numeric:tabular-nums}
.reviews__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.review{display:flex;flex-direction:column;gap:12px;padding:20px 22px;border:1px solid #e0e4ea;border-radius:var(--radius);background:#fff}
.review__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.review__top .card-rating__stars{font-size:17px}
.review__top time{font-size:13px;color:#7a8494;white-space:nowrap}
.review p{margin:0;font-size:15px;line-height:1.6;color:#2b3445;overflow-wrap:anywhere}
.review__photos{display:flex;flex-wrap:wrap;gap:8px}
.review__photos img{display:block;width:72px;height:72px;border-radius:var(--radius);object-fit:cover}
.review footer{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:14px;border-top:1px solid #eceef1}
.review footer strong{font-size:14px;font-weight:600;overflow-wrap:anywhere}
.review__avatar{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:#e8effb;color:var(--accent);font-size:13px;font-weight:700}
.reviews__more{margin-top:16px}
.reviews__more summary{display:flex;justify-content:center;list-style:none;cursor:pointer}
.reviews__more summary::-webkit-details-marker{display:none}
.reviews__more summary span{padding:12px 24px;border:1px solid #cdd3dc;border-radius:var(--radius);background:#fff;font-size:15px;font-weight:600;transition:border-color .15s,color .15s}
.reviews__more summary:hover span{border-color:var(--accent);color:var(--accent)}
.reviews__more[open] summary{display:none}
.reviews__empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 24px;border:1px solid #e0e4ea;border-radius:var(--radius);background:#fff;text-align:center}
.reviews__empty .card-rating__stars{font-size:26px}
.reviews__empty p{margin:4px 0 0;font-size:16px;font-weight:600}
.reviews__empty small{font-size:13px;color:#7a8494}

/* Cart drawer */
.cart-drawer{position:fixed;inset:0 0 0 auto;width:min(440px,100%);max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#f5f7fa;color:#1a2233;box-shadow:-12px 0 40px #0b1f3f33;overflow:hidden}
.cart-drawer[open]{display:flex;flex-direction:column;animation:cart-in .22s ease-out}
.cart-drawer.is-closing{animation:cart-out .2s ease-in forwards}
.cart-drawer::backdrop{background:#0b1f3f80;animation:cart-fade .22s ease-out}
.cart-drawer.is-closing::backdrop{animation:cart-fade .2s ease-in reverse forwards}
.cart-drawer:focus{outline:0}
.cart-drawer :focus-visible{outline-offset:2px}
@keyframes cart-in{from{transform:translateX(100%)}}
@keyframes cart-out{to{transform:translateX(100%)}}
@keyframes cart-fade{from{opacity:0}}
/* Plain header as in large shops: "Koszyk (3)" in text, a thin line below, a simple close cross. */
.cart-drawer__head{display:flex;align-items:center;justify-content:space-between;flex:none;min-height:60px;padding:0 20px;border-bottom:1px solid #e5e8ed;background:#fff;color:#1a2233}
.cart-drawer__head h2{margin:0;font-size:18px;font-weight:700;line-height:1.2}
.cart-drawer__count{color:#5d6775;font-weight:400}
.cart-drawer__count::before{content:"("}.cart-drawer__count::after{content:")"}
.cart-drawer__count[hidden]{display:none}
.cart-drawer__head button{display:grid;place-items:center;width:40px;height:40px;margin-right:-10px;padding:0;border:0;border-radius:var(--radius);background:none;color:#1a2233;-webkit-tap-highlight-color:transparent}
.cart-drawer__head button:hover{color:#5d6775}
.cart-drawer__head button:focus:not(:focus-visible){outline:0}
.cart-drawer__head svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cart-drawer__note{display:flex;align-items:center;gap:10px;flex:none;margin:0;padding:12px 20px;background:#e9f6ee;color:#17693f;font-size:14px;font-weight:600}
.cart-drawer__note{max-height:60px;overflow:hidden;transition:max-height .3s,padding .3s,opacity .2s}
.cart-drawer__note.is-hiding{max-height:0;padding-top:0;padding-bottom:0;opacity:0}
.cart-drawer__note::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background:#1a7f4b center/12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.cart-drawer__body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.cart-drawer__items{padding:0 20px;border-bottom:1px solid #e3e7ed;background:#fff}
.cart-drawer__message{flex:none;margin:0;padding:0 20px;font-size:14px;color:#7a8494}
.cart-drawer__message:not(:empty){padding:12px 20px}
.cart-drawer .cart-item:last-child{border-bottom:0}
.cart-drawer.is-empty .cart-drawer__body{display:flex;flex-direction:column;background:#fff}
.cart-drawer.is-empty .cart-drawer__items{display:flex;flex:1;flex-direction:column;justify-content:center;border-bottom:0}
.cart-drawer .cart-item{display:grid;grid-template-columns:112px auto minmax(0,1fr) auto;grid-template-areas:"image name name name" "image sum sum sum" "image price price price" "image stepper stepper remove";grid-template-rows:auto auto auto 1fr;gap:6px 12px;align-items:start;margin:0;padding:20px 0;border:0;border-bottom:1px solid #eceef1;border-radius:0;background:none}
.cart-item__image{grid-area:image;grid-row:1/-1;align-self:start;display:block;border-radius:var(--radius);overflow:hidden;background:#fff}
.cart-drawer .cart-item__image img{display:block;width:112px;height:112px;object-fit:contain}
.cart-item__name{grid-area:name;align-self:start;font-size:14px;font-weight:500;line-height:1.4;color:#3d4756;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.cart-item__name:hover{color:var(--accent)}
.cart-item__price{grid-area:price;margin:0;font-size:13px;line-height:1.3;color:#5d6775;white-space:nowrap}
.cart-item__sum{grid-area:sum;align-self:start;justify-self:start;display:flex;flex-direction:column;align-items:flex-start;gap:3px;margin:0;line-height:1;white-space:nowrap}
.cart-item__sum strong{font-size:18px;font-weight:700;letter-spacing:-.01em}
.cart-item__sum del{font-size:13px;color:#8a93a0}
.cart-item__sum strong small,#cart-total small,#cart-before small,.cart-item__price small{font-size:.68em;font-weight:600;letter-spacing:0}
.cart-stepper{grid-area:stepper;display:inline-flex;justify-self:start;align-self:end;height:36px;margin-top:8px;border:1px solid #cdd3dc;border-radius:var(--radius);overflow:hidden;background:#fff}
.cart-stepper:has(input:focus){border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.cart-stepper button{-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;width:34px;padding:0;border:0;background:none;color:#1a2233;font-size:18px;line-height:1;transition:background .15s}
.cart-stepper button:hover:not(:disabled){background:#f1f4f8}
.cart-stepper button:disabled{opacity:.35}
.cart-drawer .cart-stepper input{width:38px;height:100%;padding:0;border:0;border-radius:0;background:none;text-align:center;font-size:14px;font-weight:600;-moz-appearance:textfield}
.cart-stepper input:focus{box-shadow:none!important}
.cart-stepper input::-webkit-outer-spin-button,.cart-stepper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}
.cart-item__remove{grid-area:remove;align-self:end;justify-self:end;display:grid;place-items:center;width:32px;height:32px;margin:0 -6px 2px 0;padding:0;border:0;border-radius:var(--radius);background:none;color:#8a93a0;transition:background .15s,color .15s}
.cart-item__remove{-webkit-tap-highlight-color:transparent}
.cart-item__remove:hover{color:#d92d20}
.cart-item__remove:focus:not(:focus-visible){outline:0}
.cart-item__remove svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cart-empty{display:flex;flex-direction:column;align-items:center;padding:32px 12px;text-align:center}
.cart-empty svg{width:132px;height:132px;margin-bottom:20px;fill:none;stroke:#b3bfd3;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.cart-empty p{margin:0;font-size:20px;font-weight:700;line-height:1.25;color:#1a2233}
.cart-empty .button{min-width:220px;min-height:50px;margin-top:24px;font-size:16px}
.cart-drawer__foot{display:flex;flex-direction:column;gap:12px;padding:18px 20px;background:#f5f7fa} /* the summary and the button share one grey block below the white list */
/* Total and the order button stay at the bottom of the panel; the rows above them scroll with the list. */
.cart-drawer__action{position:sticky;bottom:0;display:flex;flex-direction:column;gap:14px;padding:0 20px calc(16px + env(safe-area-inset-bottom));background:#f5f7fa}
.cart-drawer__action .button{gap:10px;min-height:56px;padding:14px 20px;background:var(--accent);font-size:17px;font-weight:700}
.cart-drawer__action .button:hover{background:#022f78}
.cart-drawer__action .button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cart-drawer .cart-saving,.cart-drawer .cart-total{display:flex;align-items:baseline;justify-content:space-between;margin:0}
.cart-drawer .cart-saving{font-size:15px;line-height:1.3;color:#5d6775}
.cart-drawer .cart-saving strong{color:#1a2233;font-weight:500}
.cart-drawer .cart-total{padding-top:14px;border-top:1px solid #dfe3ea;font-size:16px;font-weight:600;line-height:1.2} /* a line inside the margins, not across the panel */
.cart-drawer .cart-total strong{font-size:22px;font-weight:700;line-height:1.2;letter-spacing:-.01em}
.cart-drawer.is-empty .cart-drawer__foot,.cart-drawer.is-empty .cart-drawer__action{display:none}

/* Footer */
/* Footer blue = the blue half of the trust banner (home-trust-pl.webp), so the banner above it has no seam. */
.site-footer{margin-top:0;background:#00285a;color:#b9c4d6;font-size:14px;line-height:1.5}
.site-footer__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;padding:48px 0 40px}
.site-footer a{display:block;padding:4px 0;color:#b9c4d6}
.site-footer a:hover{color:#fff}
.site-footer p{margin:0}
.site-footer__title{margin:0 0 10px!important;color:#fff;font-size:14px;font-weight:700}
.site-footer__group summary{list-style:none;cursor:default;pointer-events:none;-webkit-tap-highlight-color:transparent;user-select:none}
.site-footer__group summary:focus:not(:focus-visible){outline:0}
.site-footer__group summary::-webkit-details-marker{display:none}
.site-footer__about img{width:56px;height:56px;object-fit:contain;margin-bottom:22px}
.site-footer__about a[href^=mailto]{color:#fff;font-weight:600}
.site-footer__bottom{border-top:1px solid #ffffff1f;padding:18px 0;font-size:13px;color:#8d9ab0}
.site-footer :focus-visible{outline-color:#fff}

/* Narrower screens */
@media(max-width:1200px){
.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1000px){
.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.product-detail{gap:30px}
.purchase h1{font-size:28px}
.sale-timer__clock b{min-width:38px;font-size:18px}
}
@media(max-width:800px){
.reviews>h2{font-size:22px}
.reviews__summary{grid-template-columns:1fr;padding:20px}
.reviews__average{font-size:46px}
.reviews__list{grid-template-columns:1fr;gap:12px}
.review{padding:16px}
.site-footer__grid{grid-template-columns:1fr 1fr;gap:28px 20px;padding:36px 0 28px}
.site-footer__about{grid-column:1/-1}
}
@media(max-width:650px){
.buy-row{flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.buy-qty__label{display:block;font-size:15px;font-weight:600}
.buy-row .buy-qty{height:46px}
.buy-row .button{flex:1 0 100%}
.wrap{width:calc(100% - 30px)}
.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.product-card:hover{transform:none}
.card-body{padding:12px 12px 14px}
.product-card h3{font-size:14px}
.card-price strong{font-size:20px}
body.product main{padding-top:14px}
.product-detail{grid-template-columns:1fr;gap:25px}
.wide-gallery .gallery-main img{height:380px}
/* Phone viewer: a fixed frame for the photo and a fixed strip below it for arrows and counter,
   so the controls stay in one place whatever the photo's shape. */
.zoom{padding:0}
.zoom[open]{grid-template-columns:88px minmax(0,1fr) 88px;grid-template-rows:64px minmax(0,1fr) 112px}
.zoom__image{grid-area:2/1/3/4}
.zoom button{width:56px;height:56px}
.zoom svg{width:30px;height:30px}
.zoom button:hover{background:none}
.zoom .zoom__close{top:8px;right:8px;background:none}
.zoom .zoom__step{position:static;grid-row:3;margin:0;background:none}
.zoom__step--prev{grid-column:1}
.zoom__step--next{grid-column:3}
.zoom__count{position:static;grid-area:3/2;font-size:15px}
.purchase h1{font-size:26px}
.detail-price strong{font-size:34px}
.models__list{gap:8px}
.model{padding:14px 4px 10px}
.model__name{font-size:14px}
.product-benefits li{gap:8px}
.section-nav{top:var(--section-nav-top,0px);gap:0;margin-top:13px;margin-bottom:4px;font-size:14px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none} /* phones: the tabs keep their width and the strip moves sideways a little when they do not fit; it sticks under the header */
.section-nav::-webkit-scrollbar{display:none}
.section-nav a{flex:none;padding:10px 13px;text-align:center;line-height:1.25;white-space:nowrap}
.section-nav+section>h2:first-child{margin-top:12px} /* the first section sits close under the tabs */
.section-nav a:first-child{margin-left:0}
.editorial-feature{grid-template-columns:1fr;gap:10px}
.editorial-feature:nth-of-type(even) img{order:0}
.editorial-feature img{height:260px}
.spec-section dl>div{grid-template-columns:1fr 1fr;gap:12px;padding:10px 0;font-size:14px}
.spec-clip.is-folded{max-height:400px}.spec-more{width:100%;justify-content:center}
.alternative-layout .gallery{order:0}
.site-footer__grid{grid-template-columns:1fr;gap:0;padding:28px 0 8px}
.site-footer__about{padding-bottom:24px}
.site-footer{background:#002d65} /* the phone banner (home-trust-pl-mob.webp) is a slightly lighter blue */
.site-footer__grid nav{border-top:1px solid #ffffff1f}
.site-footer__group summary{display:flex;align-items:center;justify-content:space-between;margin:0!important;padding:16px 0;font-size:15px;cursor:pointer;pointer-events:auto}
.site-footer__group summary::after{content:"";width:8px;height:8px;margin:0 4px 4px 0;border-right:2px solid #b9c4d6;border-bottom:2px solid #b9c4d6;transform:rotate(45deg);transition:transform .26s,margin .26s}
.site-footer__group[open]:not(.is-closing) summary::after{margin-bottom:-4px;transform:rotate(225deg)}
.site-footer__group a{padding:7px 0}
.site-footer__group a:last-child{padding-bottom:18px}
.cart-drawer{width:calc(100% - 56px)}
.cart-drawer__head,.cart-drawer__note,.cart-drawer__foot,.cart-drawer__action{padding-left:16px;padding-right:16px}
.cart-drawer__items{padding:0 16px}
.cart-drawer .cart-item{grid-template-columns:96px auto minmax(0,1fr) auto;gap:6px 12px;padding:16px 0}
.cart-drawer .cart-item__image img{width:96px;height:96px}
}
@media(hover:none){
.product-card:hover h3 a{color:inherit}
}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*{transition:none!important}
.cart-drawer[open],.cart-drawer::backdrop{animation:none}
}

.rv{display:grid;grid-template-columns:280px minmax(0,1fr);gap:56px;align-items:start}
.rv__side{position:sticky;top:120px;display:grid;gap:18px}
.rv__side h2{margin:0;font-size:26px;font-weight:700;line-height:1.2;letter-spacing:-.02em}
.rv__score{display:flex;align-items:center;gap:16px}
.rv__score p{margin:0;font-size:52px;font-weight:700;line-height:1;letter-spacing:-.03em}
.rv__score .card-rating__stars{font-size:22px}
.rv__score small{display:block;margin-top:6px;font-size:14px;color:#5d6775}
.rv__bars{display:grid;gap:2px}
.rv__bars>div{display:grid;grid-template-columns:30px minmax(0,1fr) 34px;gap:12px;align-items:center;padding:6px 8px;font-size:14px}
.rv__bars>div>span:first-child{font-weight:600}.rv__bars i{margin-left:3px;font-size:12px;font-style:normal;color:#f5a400}
.rv__bars>div>span:last-child{text-align:right;color:#5d6775;font-variant-numeric:tabular-nums}
.rv__bar{height:8px;border-radius:99px;overflow:hidden;background:#eceef1}.rv__bar span{display:block;height:100%;border-radius:99px;background:#f5a400}
.rv__main h3{margin:0 0 10px;font-size:16px;font-weight:700}
.rv__photos{display:flex;gap:8px;margin-bottom:24px;overflow-x:auto}.rv__photos img{display:block;width:84px;height:84px;border-radius:var(--radius);object-fit:cover}
.rv__duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:8px}
.rv__duo>div{display:flex;flex-direction:column;gap:10px;padding:18px 20px;border-radius:var(--radius);background:#f4f6f9}
.rv__duo small{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#5d6775}
.rv__duo .card-rating__stars{font-size:16px}.rv__duo p{margin:0;font-size:15px;line-height:1.6}.rv__duo footer{margin-top:auto;font-size:13px;font-weight:600;color:#5d6775}
.rv__item{display:grid;gap:10px;padding:22px 0;border-bottom:1px solid #e9ecf0}
.rv__item[hidden]{display:none}
.rv__who{display:flex;align-items:center;gap:10px;font-size:14px}.rv__who .review__date{margin-left:auto;font-size:13px;color:#7a8494}
.rv__line{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}.rv__line .card-rating__stars{font-size:16px}
.rv__verified{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#12733a}
.rv__verified::before{content:"✓";display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#1b9a4e;color:#fff;font-size:10px}
.rv__item p{margin:0;font-size:15px;line-height:1.65;color:#2a3342;overflow-wrap:anywhere}
.rv__toggle{justify-self:start;align-self:flex-start;margin-top:-4px;padding:0;border:0;background:none;color:var(--accent);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.rv__toggle:hover{text-decoration:underline}
.rv__helpful{display:inline-flex;align-items:center;gap:7px;justify-self:start;padding:6px 12px;border:1px solid #d9dee6;border-radius:99px;font-size:13px!important;color:#414b59!important}
.rv__helpful svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rv .reviews__more{margin-top:20px}
@media(max-width:900px){.rv{grid-template-columns:1fr;gap:24px}.rv__side{position:static}.rv__duo{grid-template-columns:1fr}.rv__score p{font-size:44px}}
.rv__more{margin-top:24px}
.rv__next{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;padding:0 20px;border:1px solid #cfd6e0;border-radius:var(--radius);background:#fff;color:#1a2233;font:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
.rv__next:hover{border-color:var(--accent);background:#f5f8fd;color:var(--accent)}
.rv__next svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rv__more [hidden]{display:none}
.rv{scroll-margin-top:110px}
.rv__next b{font-weight:600}
.rv__next i{display:none;width:16px;height:16px;border:2px solid #cfd6e0;border-top-color:var(--accent);border-radius:50%;animation:rv-spin .7s linear infinite}
.rv__next.is-loading{color:#5d6775;cursor:default;border-color:#cfd6e0;background:#fff}
.rv__next.is-loading i{display:block}.rv__next.is-loading svg{display:none}
.rv__wait{display:grid;gap:10px;padding:22px 0;border-bottom:1px solid #e9ecf0}
.rv__wait[hidden]{display:none}
.rv__wait span{display:block;height:12px;border-radius:99px;background:linear-gradient(90deg,#eceef1 25%,#f6f7f9 37%,#eceef1 63%);background-size:400% 100%;animation:rv-shine 1.2s ease infinite}
.rv__wait span:first-child{width:38%;height:14px}.rv__wait span:last-child{width:72%}
@keyframes rv-spin{to{transform:rotate(360deg)}}
@keyframes rv-shine{0%{background-position:100% 0}100%{background-position:0 0}}
@media(prefers-reduced-motion:reduce){.rv__next i,.rv__wait span{animation:none}}
.related__head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.related__head h2{margin:0}
.related__nav{display:flex;gap:8px}
.related__nav button{display:grid;place-items:center;width:42px;height:42px;border:1px solid #d5dae2;border-radius:50%;background:#fff;color:#1a2233;cursor:pointer;transition:border-color .15s,color .15s}
@media(hover:hover) and (pointer:fine){.related__nav button:hover{border-color:var(--accent);color:var(--accent)}}
.related__nav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Room around the cards so their hover shadow is not cut off by the scrolling row; the negative margin keeps the row in place. */
.related__track{--per:5;display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:12px;scroll-behavior:smooth;scrollbar-width:none;padding:16px 12px 36px;margin:-16px -12px -28px}
.related__track::-webkit-scrollbar{display:none}
.related__track>*{flex:0 0 calc((100% - (var(--per) - 1) * 16px) / var(--per));scroll-snap-align:start}
@media(max-width:1200px){.related__track{--per:4}}
@media(max-width:1000px){.related__track{--per:3}}
@media(max-width:650px){.related__track{--rows:2;display:grid;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:calc((100% - 10px) / 2);gap:10px}.related__nav button{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.related__track{scroll-behavior:auto}}
/* Phones: the photo opens the product at the first tap; the second photo is not shown (nor downloaded). */
@media(hover:none){.card-image .card-image__hover{display:none}}
/* Author initials get one of six colours, always the same one for the same name. */
.review__avatar[class*=review__avatar--]{color:#fff}
.review__avatar--0{background:#0344a9}.review__avatar--1{background:#1b8a4e}.review__avatar--2{background:#d9730d}.review__avatar--3{background:#7b3fa0}.review__avatar--4{background:#c0392b}.review__avatar--5{background:#00838f}
.rv__write{justify-self:start}
.reviews__empty .rv__write{margin-top:8px;justify-self:center}
.review-panel__body{flex:1;min-height:0;overflow-y:auto;padding:20px;display:grid;gap:18px;align-content:start;background:#fff}
.review-panel__product{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;font-size:14px;line-height:1.35}
.review-panel__product img{width:64px;height:64px;border-radius:var(--radius);object-fit:contain;background:#fff;border:1px solid #eef0f3}.review-panel__product img.is-fill{object-fit:cover}
.review-form{display:grid;gap:16px}
.review-form label{display:grid;gap:6px;font-size:14px;font-weight:600}
.review-form textarea,.review-form input{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid #cfd6e0;border-radius:var(--radius);font:inherit;font-size:16px;font-weight:400;color:#1a2233;background:#fff}
.review-form textarea:focus,.review-form input:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent)}
.review-form small{font-size:12px;font-weight:400;color:#5d6775}
.review-form__stars{margin:0;padding:0;border:0;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.review-form__stars legend{padding:0;margin-bottom:6px;font-size:14px;font-weight:600}
.review-form__stars div{display:flex;gap:2px}
.review-form__stars button{padding:0 2px;border:0;background:none;font-size:34px;line-height:1;color:#d5dae2;cursor:pointer;transition:color .1s,transform .1s}
.review-form__stars button.is-on{color:#f5a400}.review-form__stars button:hover{transform:scale(1.08)}
.review-form__stars span{font-size:14px;color:#5d6775}
.review-form__trap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.review-form__error{margin:0;padding:10px 12px;border-radius:var(--radius);background:#fdeceb;color:#a8261b;font-size:14px}
.review-form__send{width:100%;min-height:50px}
.review-form__send[disabled]{opacity:.6;cursor:default}
.review-form__note{margin:-6px 0 0;font-size:13px;color:#5d6775;text-align:center}
.review-panel__done{display:grid;justify-items:center;gap:10px;padding:30px 10px;text-align:center}
.review-panel__done[hidden]{display:none}
.review-panel__done span{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#1b9a4e;color:#fff;font-size:26px}
.review-panel__done strong{font-size:20px}.review-panel__done p{margin:0;color:#5d6775}
button.rv__helpful{background:#fff;font:inherit;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
button.rv__helpful:hover{border-color:var(--accent);color:var(--accent)!important}
button.rv__helpful[aria-pressed=true]{border-color:var(--accent);background:#e8effb;color:var(--accent)!important;font-weight:600}
button.rv__helpful[aria-pressed=true] svg{fill:currentColor}
.rv__write{gap:9px}
.rv__write svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* While the cart, the review panel or the photo zoom is open, the page behind it does not scroll. */
html:has(dialog[open]){overflow:hidden}
.review-panel__body{overscroll-behavior:contain}
.card-rating__count{margin-left:-1px;font-size:13px;color:#7a8494}
/* Phones flash a blue box over a tapped link or button; the site shows its own pressed states instead. */
a,button,summary,label{-webkit-tap-highlight-color:transparent}
/* iPhone zooms the page into a field with text under 16px; touch screens get 16px. */
@media(pointer:coarse){.cart-drawer .cart-stepper input{font-size:16px}}
