/* Phone defaults. Layouts expand at 360, 600, 768 and 1100 pixels. */
:root { font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color: #203b33; background: #f7f8f4; line-height: 1.55; font-synthesis: none; --ink: #203b33; --green: #285b4b; --line: #dce2d9; --muted: #61716a; --paper: #fff; --accent: #e6d7a7; --gutter: 16px; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 0; }
a { color: inherit; text-underline-offset: 4px; touch-action: manipulation; }
button { font: inherit; touch-action: manipulation; min-height: 46px; cursor: pointer; padding: 11px 18px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--ink); }
input { font: inherit; touch-action: manipulation; min-height: 46px; width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); }
select { font: inherit; touch-action: manipulation; min-height: 46px; width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); }
button:disabled { opacity: .5; cursor: wait; }
input:focus-visible { outline: 3px solid #c19334; outline-offset: 3px; }
select:focus-visible { outline: 3px solid #c19334; outline-offset: 3px; }
button:focus-visible { outline: 3px solid #c19334; outline-offset: 3px; }
a:focus-visible { outline: 3px solid #c19334; outline-offset: 3px; }
summary:focus-visible { outline: 3px solid #c19334; outline-offset: 3px; }
input[type=checkbox] { width: 20px; height: 20px; min-height: 20px; accent-color: var(--green); flex-shrink: 0; }
.primary { background: var(--green); color: white; border-color: var(--green); font-weight: 650; }
.secondary { background: #fff; }
.logo { text-decoration: none; font-size: 30px; font-weight: 850; letter-spacing: -2px; line-height: 1; }
.logo span { color: #b48a35; }
.site-header { max-width: 1260px; margin: auto; display: flex; align-items: center; justify-content: space-between; padding: 16px max(var(--gutter),env(safe-area-inset-right)) 16px max(var(--gutter),env(safe-area-inset-left)); border-bottom: 1px solid var(--line); gap: 12px; flex-wrap: wrap; }
.site-header nav { display: flex; gap: 16px; }
.site-header nav a { font-size: 14px; font-weight: 600; text-decoration: none; padding: 10px 0; min-height: 44px; display: inline-flex; align-items: center; }
main { max-width: 1260px; margin: auto; padding: 0 max(var(--gutter),env(safe-area-inset-right)) 40px max(var(--gutter),env(safe-area-inset-left)); }
h1 { line-height: 1.14; letter-spacing: -.035em; overflow-wrap: anywhere; }
h2 { line-height: 1.14; letter-spacing: -.035em; font-size: 26px; margin: 8px 0 16px; overflow-wrap: anywhere; }
h3 { line-height: 1.14; letter-spacing: -.035em; font-size: 20px; overflow-wrap: anywhere; }
p { margin: 0 0 16px; }
.hero { padding: 28px 0 20px; max-width: 800px; }
.eyebrow { font-size: 11px; letter-spacing: .1em; font-weight: 750; color: var(--muted); margin: 0 0 12px; }
.hero h1 { font-size: clamp(32px,8vw,44px); font-weight: 750; margin: 0 0 24px; letter-spacing: -.055em; margin-bottom: 20px; }
.hero h1 span { color: #6b8173; }
.hero>p:last-child { color: var(--muted); font-size: 16px; max-width: 590px; }
.search-bar { display: flex; align-items: center; border: 1px solid var(--line); background: white; border-radius: 12px; padding: 5px; gap: 8px; max-width: 820px; box-shadow: 0 3px 15px #243d3305; }
.search-bar>span { font-size: 25px; padding: 0 12px; padding-left: 8px; display: none; }
.search-bar input { border: 0; background: transparent; min-width: 0; padding-left: 10px; font-size: 16px; }
.search-bar button { padding-inline: 14px; font-size: 16px; flex-shrink: 0; }
.categories { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 18px 0 30px; }
.category-tile { position: relative; display: flex; grid-template-columns: 42px 1fr; align-items: start; gap: 5px; text-decoration: none; padding: 16px 10px; background: #e9eee5; border-radius: 12px; flex-direction: column; min-height: 130px; min-width: 0; overflow-wrap: anywhere; }
.category-tile:nth-child(2) { background: #ece8de; }
.category-tile:nth-child(3) { background: #e7ebea; }
.category-tile>span { grid-row: 1/3; font-size: 24px; color: #527060; }
.category-tile strong { font-size: 20px; letter-spacing: -.025em; }
.category-tile small { font-size: 12px; color: var(--muted); line-height: 1.4; }
.category-tile b { position: absolute; right: 8px; top: 8px; font-size: 15px; font-weight: 400; }
.category-tile:hover { box-shadow: inset 0 0 0 2px #9dad9b; }
.browse-controls { margin: 24px 0; }
.filter-toolbar { display: grid; justify-content: space-between; gap: 10px; align-items: center; grid-template-columns: 1fr; }
.filter-toolbar #filter-toggle { display: block; font-size: 16px; min-width: 80px; }
.filter-toolbar select { max-width: none; margin-left: auto; font-size: 16px; width: 100%; min-width: 0; margin: 0; }
.filter-panel { margin-top: 16px; padding: max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); background: #fff; border: 0; border-radius: 0; display: none; grid-template-columns: 1fr; gap: 20px; position: fixed; z-index: 30; inset: 0; margin: 0; overflow-y: auto; overscroll-behavior: contain; height: 100dvh; align-content: start; }
.filter-panel label { font-size: 15px; font-weight: 600; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.filter-panel label.check { flex-direction: row; align-items: center; font-size: 15px; min-height: 46px; }
.filter-panel .small { grid-column: auto; margin: 0; font-size: 13px; }
.filter-actions { grid-column: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; padding: 16px 0 max(16px,env(safe-area-inset-bottom)); position: sticky; bottom: -16px; background: white; border-top: 1px solid var(--line); z-index: 1; }
.panel-title { display: flex; align-items: center; justify-content: space-between; }
.section-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin: 45px 0 12px; margin-top: 28px; flex-wrap: wrap; }
.section-heading h2 { margin-bottom: 0; font-size: 24px; }
.section-heading>a { font-size: 14px; font-weight: 650; white-space: normal; min-height: 44px; display: inline-flex; align-items: center; }
.product-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; }
.product-card { display: flex; flex-direction: column; position: relative; border: 1px solid var(--line); border-radius: 13px; background: #fff; overflow: hidden; min-width: 0; transition: box-shadow .15s,transform .15s; }
.product-card:hover { box-shadow: 0 8px 24px #263e3310; transform: none; }
.product-image { display: grid; place-items: center; background: #f0f2ec; height: 190px; position: relative; overflow: hidden; }
.product-image img { height: 155px; width: 80%; object-fit: contain; mix-blend-mode: multiply; }
.product-image .placeholder { font-size: 48px; color: #98a699; line-height: 1; }
.product-image .badge { position: absolute; top: 9px; left: 9px; }
.card-body { padding: 13px; display: flex; flex-direction: column; flex: 1; }
.product-card h3 { font-size: 16px; line-height: 1.35; letter-spacing: -.018em; margin: 0 0 8px; min-height: 0; }
.product-card h3 a { text-decoration: none; }
.product-card h3 a:after { content: ""; position: absolute; inset: 0; }
.product-card small { font-size: 12px; }
.product-card .store-line { font-size: 12px; color: var(--muted); margin-top: auto; padding-top: 9px; }
.price { font-size: 25px; line-height: 1.2; font-weight: 750; letter-spacing: -.04em; margin: 6px 0; }
.price small { font-size: 12px; font-weight: 450; letter-spacing: 0; }
.unit-price { font-size: 12px; color: var(--muted); margin-bottom: 12px; }
.pack-label { font-size: 12px; font-weight: 600; margin-bottom: 8px; }
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 7px; border-radius: 6px; background: #e7f0e6; color: #305642; font-size: 11px; font-weight: 750; letter-spacing: .02em; max-width: 100%; overflow-wrap: anywhere; }
.badge.warning { background: #f5edda; color: #725521; }
.badge.neutral { background: #edf0ed; color: var(--muted); }
.active-filters { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 18px; }
.chip { display: inline-flex; font-size: 13px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 30px; background: #fff; max-width: 100%; overflow-wrap: anywhere; }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.pagination { display: flex; gap: 12px; justify-content: center; margin-top: 30px; }
.pagination a { padding: 10px 17px; border: 1px solid var(--line); border-radius: 8px; background: white; text-decoration: none; min-height: 46px; }
.store-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
.store-card { border: 1px solid var(--line); border-radius: 12px; background: white; padding: 18px; min-width: 0; overflow-wrap: anywhere; }
.store-card h3 { margin: 0 0 8px; }
.store-card .store-link { display: flex; margin-top: 16px; font-size: 15px; font-weight: 650; min-height: 44px; align-items: center; }
.store-card details { margin-top: 15px; }
.store-card details details { padding-left: 10px; border-left: 2px solid var(--line); }
.how { margin-top: 40px; padding: 22px; background: #e9eee5; border-radius: 15px; }
.how>div { display: grid; grid-template-columns: 1fr; gap: 0; }
.how p { font-size: 16px; color: var(--muted); }
.how strong { color: var(--ink); line-height: 2.5; }
.how h2 { font-size: 24px; }
footer { max-width: 1260px; margin: auto; border-top: 1px solid var(--line); padding: 24px max(var(--gutter),env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(var(--gutter),env(safe-area-inset-left)); display: block; justify-content: space-between; gap: 20px; font-size: 13px; color: var(--muted); }
footer span { max-width: 450px; display: block; margin-top: 8px; }
.back-link { display: inline-block; margin: 16px 0; font-size: 15px; min-height: 44px; padding-block: 10px; }
.product-hero { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: center; margin-bottom: 25px; min-width: 0; }
.detail-image { display: grid; place-items: center; background: #edf0e8; border-radius: 15px; height: 230px; position: relative; }
.detail-image img { height: 195px; max-width: 85%; object-fit: contain; mix-blend-mode: multiply; }
.product-hero h1 { font-size: 30px; margin: 12px 0 20px; }
.product-hero .facts { display: flex; gap: 6px; flex-wrap: wrap; margin: 14px 0; }
.facts span { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; font-size: 12px; }
.compare-toolbar { display: flex; gap: 16px; align-items: stretch; margin: 24px 0; flex-wrap: wrap; }
.compare-toolbar label { display: flex; gap: 6px; align-items: stretch; font-size: 14px; width: 100%; justify-content: space-between; flex-direction: column; min-width: 0; }
.compare-toolbar select { width: 100%; max-width: none; font-size: 16px; min-width: 0; }
.compare-toolbar .small { margin-left: auto; max-width: none; margin: 0; font-size: 13px; }
.offer-card { border: 1px solid var(--line); border-radius: 12px; padding: 18px; background: white; margin-bottom: 16px; min-width: 0; overflow-wrap: anywhere; }
.offer-card.best { border-color: #7d9b83; border-left: 4px solid #68886e; }
.offer-head { display: flex; justify-content: space-between; gap: 8px; align-items: start; flex-direction: column; }
.offer-head h3 { font-size: 19px; margin: 0 0 8px; }
.offer-head .price { text-align: left; font-size: 27px; }
.offer-head .badge { margin-bottom: 12px; }
.offer-summary { display: flex; align-items: center; gap: 15px; justify-content: space-between; padding: 18px 0 10px; border-top: 1px solid #edf0eb; margin-top: 14px; flex-wrap: wrap; }
.offer-summary p { margin: 0; font-size: 14px; }
.buy-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; padding: 12px 18px; background: var(--green); color: white; border-radius: 8px; font-size: 16px; font-weight: 650; white-space: normal; min-height: 46px; width: 100%; text-align: center; }
.offer-card details { border-top: 1px solid #edf0eb; padding-top: 14px; margin-top: 14px; }
.offer-card details details { padding: 14px; background: #f7f8f4; border: 0; border-radius: 8px; }
summary { cursor: pointer; font-size: 15px; font-weight: 600; min-height: 44px; list-style-position: inside; padding: 10px 0; }
details[open]>summary { margin-bottom: 14px; }
.notice { border-left: 3px solid #b9994d; background: #fbf7eb; padding: 12px 15px; border-radius: 0 6px 6px 0; font-size: 13px; margin: 12px 0; }
.data-list { display: grid; grid-template-columns: 1fr; gap: 4px; font-size: 14px; margin: 15px 0; }
.data-list dt { color: var(--muted); }
.data-list dd { margin: 0; min-width: 0; overflow-wrap: anywhere; margin-bottom: 9px; }
.table { overflow: auto; max-width: 100%; border: 1px solid var(--line); border-radius: 8px; min-width: 0; overscroll-behavior-x: contain; }
table { border-collapse: collapse; width: 100%; font-size: 12px; }
th { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; background: #f1f3ee; }
td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 11px; color: var(--muted); }
.skeleton { background: linear-gradient(110deg,#ecf0e8 10%,#f6f8f1 40%,#ecf0e8 70%); min-height: 285px; border-radius: 12px; animation: pulse 1.5s ease-in-out infinite; }
#message { font-size: 14px; color: var(--muted); margin-bottom: 18px; }
.empty { grid-column: 1/-1; text-align: center; border: 1px solid var(--line); padding: 60px 20px; border-radius: 12px; background: white; }
.empty h3 { font-size: 25px; }
.empty p { color: var(--muted); }
#connection { border: 1px solid #bda363; border-radius: 10px; background: #fcf5e3; padding: 14px; font-size: 14px; margin: 20px 0; display: block; gap: 20px; align-items: center; justify-content: space-between; }
#connection[hidden] { display: none!important; }
[hidden] { display: none!important; }
#connection button { background: #fff9eb; white-space: nowrap; margin-top: 10px; width: 100%; }
.stale-data .price:after { content: " · vistuð gögn"; font-size: 11px; font-weight: 450; letter-spacing: 0; display: block; color: #725521; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip { position: fixed; z-index: 50; top: -70px; left: 10px; background: white; padding: 12px; }
.skip:focus { top: 10px; }
body.browse .hero { padding: 35px 0 18px; }
body.browse .hero h1 { font-size: clamp(30px,7vw,38px); }
body.browse .hero>p:last-child { display: none; }
body.browse .categories { display: none; }
body.home .browse-controls { display: none; }
.desktop-only { display: none; }
dd { overflow-wrap: anywhere; }
.hero h1>span:first-child { color: var(--ink); }
.placeholder { font-size: 60px; color: #9aab9d; }
#stores>.notice { grid-column: 1/-1; }
.image-loading { opacity: 0; position: absolute; }
.detail-image .placeholder { line-height: 1; }
.filter-actions a { min-height: 44px; display: inline-flex; align-items: center; }
.category-tile span { font-size: 24px; }
.filter-panel.open { display: grid; }
.panel-title h2 { margin: 0; font-size: 25px; }
.panel-title button { padding: 8px 15px; }
.product-card .price { font-size: 25px; }
.stores-section { margin-top: 40px; }
.offer-head .price small { font-size: 12px; display: block; }
.product-card:focus-within { outline: 3px solid #c19334; outline-offset: 3px; }
.product-hero>div { min-width: 0; }
.offer-head>div { min-width: 0; max-width: 100%; }

/* Regular and large phones retain two readable product columns. */
@media (min-width: 360px) {
  .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-image { height: 162px; }
  .product-image img { height: 132px; }
  .filter-toolbar { grid-template-columns: auto minmax(0,1fr); }
}
/* Wide phones and small tablets gain breathing room, with touch filters. */
@media (min-width: 600px) {
  :root { --gutter: 24px; }
  .hero { padding-top: 40px; }
  .search-bar>span { display: block; }
  .categories { gap: 16px; }
  .category-tile { padding: 20px; }
  .product-grid { gap: 18px; }
  .product-image { height: 210px; }
  .product-image img { height: 175px; }
  .card-body { padding: 18px; }
  .store-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .offer-head { flex-direction: row; justify-content: space-between; }
  .offer-head .price { text-align: right; }
  .compare-toolbar label { flex: 1 1 220px; width: auto; }
  .compare-toolbar .small { flex-basis: 100%; }
  .data-list { grid-template-columns: minmax(140px,1fr) 2fr; gap: 8px 18px; }
  .data-list dd { margin: 0; }
  .filter-panel { padding-inline: max(24px,calc((100vw - 600px)/2)); }
}
/* Tablets: more columns, while filters remain a focused full-screen flow. */
@media (min-width: 768px) {
  .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .hero h1 { font-size: 52px; }
  .product-hero { grid-template-columns: 260px minmax(0,1fr); gap: 32px; margin-bottom: 36px; }
  .detail-image { height: 300px; }
  .detail-image img { height: 250px; }
  .product-hero h1 { font-size: 36px; }
  .how>div { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
  .buy-link { width: auto; }
  .offer-summary { flex-wrap: nowrap; }
  .offer-summary p { min-width: 0; }
  .buy-link { flex-shrink: 0; }
  #connection { display: flex; }
  #connection button { width: auto; margin: 0; }
}
/* Desktop enhancements; the phone layout does not depend on these rules. */
@media (min-width: 1100px) {
  :root { --gutter: 32px; }
  main { padding-bottom: 64px; }
  .site-header { padding-block: 27px; }
  .site-header nav { gap: 30px; }
  .logo { font-size: 34px; }
  .desktop-only { display: inline; }
  .hero { padding: 64px 0 30px; }
  .hero h1 { font-size: 64px; }
  .hero>p:last-child { font-size: 17px; }
  .category-tile { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 0 12px; padding: 24px; min-height: 0; }
  .category-tile>span { font-size: 35px; }
  .category-tile strong { font-size: 25px; }
  .category-tile b { top: 15px; right: 16px; font-size: 20px; }
  .product-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .product-card h3 { font-size: 17px; }
  .store-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .filter-toolbar { display: flex; justify-content: flex-end; }
  .filter-toolbar #filter-toggle { display: none; }
  .filter-toolbar select { max-width: 300px; }
  .filter-panel { display: grid; position: static; height: auto; padding: 20px; margin-top: 16px; border: 1px solid var(--line); border-radius: 12px; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 16px; overflow: visible; }
  .panel-title { display: none; }
  .filter-panel .small { grid-column: 1/4; }
  .filter-actions { grid-column: 4/6; position: static; border: 0; padding: 0; justify-content: flex-end; }
  .section-heading { margin-top: 45px; }
  .section-heading h2 { font-size: 30px; }
  .product-hero { grid-template-columns: 330px minmax(0,1fr); gap: 52px; margin-bottom: 45px; }
  .detail-image { height: 350px; }
  .detail-image img { height: 280px; }
  .product-hero h1 { font-size: 42px; }
  .offer-card { padding: 24px; }
  footer { display: flex; }
  footer span { margin: 0; }
}
@keyframes pulse { 50% { opacity: .5; } }
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto!important; animation: none!important; transition: none!important; }
}

#non-alcoholic-toggle[aria-pressed="true"] { background: #163c2d; color: #fff; }

.wine-types{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}.wine-types[hidden]{display:none}.wine-types a{padding:.55rem .9rem;border:1px solid currentColor;border-radius:999px;text-decoration:none}.wine-types a[aria-current="page"]{background:#243d32;color:#fff;border-color:#243d32}

/* Store price statistics share the catalogue's typography and palette. */
.site-header nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px}
.price-section{margin:32px 0 48px}.price-section .section-heading{margin-bottom:12px}.price-section h2{max-width:760px}
.price-controls{display:flex;align-items:end;flex-wrap:wrap;gap:16px;padding:22px;background:#eaf0e9;border:1px solid var(--line);border-radius:12px;margin:28px 0}.price-controls label{display:grid;gap:7px;font-size:14px;font-weight:600;flex:1 1 240px}.price-controls select{margin:0}
.price-table{background:white;border:1px solid var(--line);border-radius:12px}.price-table table{width:100%;border-collapse:collapse}.price-table th,.price-table td{text-align:left;vertical-align:top;padding:16px;white-space:nowrap;border-bottom:1px solid var(--line)}.price-table th{background:#edf1e9;font-size:13px}.price-table th[scope="row"]{position:sticky;left:0;z-index:1;max-width:170px;white-space:normal}.price-table small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.price-table strong{font-size:15px}
.price-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.price-stat{background:white;border:1px solid var(--line);border-radius:12px;padding:22px;min-width:0}.price-stat h3{font-size:16px;margin:0 0 14px}.price-stat p{margin:10px 0}.price-stat .stat-value{font-size:28px;font-weight:750;letter-spacing:-1px;margin:12px 0}.price-stat .stat-empty{font-size:20px;letter-spacing:-.4px}.price-stat a{font-weight:600}.price-method{margin-top:20px}.price-method summary{cursor:pointer;font-weight:600;padding:12px 0}.price-method p{max-width:900px}
.chart-stores{border:0;padding:0;display:flex;flex-wrap:wrap;gap:12px 20px;margin:24px 0 12px}.chart-stores legend{font-size:13px;margin-bottom:10px;color:var(--muted)}.chart-store{display:flex;align-items:center;gap:7px;font-size:14px;cursor:pointer}.chart-color-0{color:#285b4b}.chart-color-1{color:#9c3d30}.chart-color-2{color:#365caa}.chart-color-3{color:#875197}.chart-color-4{color:#986000}.chart-color-5{color:#286d7c}.chart-store input{accent-color:currentColor}.price-chart{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:20px;padding:12px}.price-chart svg{display:block;width:100%;max-height:420px}.price-chart circle:focus{outline:2px solid #c19334}.prices-loading .price-section{opacity:.45;pointer-events:none}.prices-page .hero{padding-bottom:12px}
@media(max-width:767px){.price-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.price-stat{padding:16px}.price-stat .stat-value{font-size:23px}.price-stat .stat-empty{font-size:17px}.price-controls{padding:16px}.price-chart{padding:4px}.price-table th,.price-table td{padding:12px}.price-table th[scope="row"]{max-width:120px;min-width:110px}.price-controls button{width:100%}}
@media(max-width:420px){.price-stat-grid{grid-template-columns:1fr}.prices-page .hero h1{font-size:40px}}

/* Phone layouts are complete without the desktop tables. */
input:not([type=checkbox]),select,.filter-panel select,.price-controls select{font-size:16px}
.logo{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
.site-header nav{flex-wrap:wrap}
.wine-types a{display:inline-flex;align-items:center;min-height:44px}
.chart-store{min-height:44px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:white}
.price-stat a{display:flex;align-items:center;min-height:44px;padding-block:8px;overflow-wrap:anywhere}
.section-jumps{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.section-jumps a{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:white;font-weight:600;text-decoration:none;font-size:14px}
#averages-heading,#price-controls,#alcohol-heading{scroll-margin-top:16px}
.record-table,.average-matrix{display:none}
.record-cards{display:grid;gap:12px}.record-card{margin:0;padding:14px;background:var(--paper);border:1px solid var(--line);border-radius:10px;font-size:14px}
.record-card>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}.record-card>div:last-child{border-bottom:0}.record-card dt{color:var(--muted);overflow-wrap:anywhere}.record-card dd{margin:0;text-align:right;font-weight:600;overflow-wrap:anywhere}
.average-mobile>label{display:block;font-weight:600;margin-bottom:8px}.average-mobile>select{margin-bottom:14px}.average-cards{display:grid;gap:10px}.average-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:16px;background:white;border:1px solid var(--line);border-radius:10px}.average-card h3{font-size:16px;margin:0;align-self:center}.average-card .average-value{font-weight:700;font-size:16px;margin:0;text-align:right;max-width:170px;overflow-wrap:anywhere}.average-card .small{grid-column:1/-1;margin:0}
@media(max-width:767px){
 .small,.notice,.product-card small,.product-card .store-line,.price small,.unit-price,.pack-label,.category-tile small,.offer-head .price small,.facts span{font-size:14px}
 .badge,.eyebrow{font-size:12px}
 .hero{padding:20px 0 12px}.hero h1{margin-bottom:14px}body.browse .hero{padding:18px 0 8px}body.browse .hero h1{margin-bottom:8px}
 .browse-controls{margin:16px 0}.filter-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}.filter-toolbar #sort{grid-column:1/-1}.filter-toolbar button{padding:10px;font-size:15px}
 .section-heading{margin-top:22px}.product-card .card-body{padding:12px}.product-card .price{font-size:24px}
 .detail-image{height:170px}.detail-image img{height:145px}.product-hero{gap:16px}.product-hero h1{margin:8px 0 14px}.product-hero .facts{margin:12px 0}
 .price-controls{gap:14px}.price-controls label{flex-basis:100%;min-width:0}.prices-page .hero h1{font-size:clamp(32px,9vw,40px)}
 .price-stat-grid{grid-template-columns:1fr}.price-stat{padding:18px}.price-stat .stat-value{font-size:27px}
 .price-chart{overflow:hidden}.chart-stores{gap:8px}.chart-store{font-size:15px}.price-section{margin:24px 0 32px}
}
@media(min-width:768px){.record-table{display:block}.record-cards{display:none}}
@media(min-width:1100px){.average-matrix{display:block}.average-mobile{display:none}}
@media(max-width:359px){.average-card{grid-template-columns:1fr}.average-card .average-value{text-align:left;max-width:none}.record-card>div{grid-template-columns:1fr;gap:3px}.record-card dd{text-align:left}}
.offer-card a,.store-card a{display:inline-flex;align-items:center;min-height:44px;max-width:100%;overflow-wrap:anywhere}
.history-store{border:1px solid var(--line);border-radius:10px;padding:4px 14px;background:white}.history-store-records{display:grid;gap:10px;padding-bottom:10px}.history-store-records .record-card{padding:10px}
@media(max-width:767px){body.browse #result-kicker{display:none}}

/* Price tools keep each result readable without horizontal scrolling. */
.mover-columns{display:grid;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}
.mover-columns .price-stat{margin-bottom:12px;overflow-wrap:anywhere}
.basket-results{display:grid;gap:8px;margin-block:12px}
.basket-results button{text-align:left;white-space:normal;min-height:44px}
.basket-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line,#dce2d9)}
.basket-item label{flex:1;min-width:0;overflow-wrap:anywhere}
.basket-item input{display:block;width:90px;min-height:44px;margin-top:8px;font-size:16px}
.basket-item button,#basket-totals summary{min-height:44px}
#basket-search,#movers-store{font-size:16px;min-height:44px;width:100%;max-width:480px}
#basket-totals{margin-top:20px}
#basket-totals li{overflow-wrap:anywhere}
#movers-heading,#basket-heading{scroll-margin-top:90px}
@media(max-width:767px){.mover-columns{grid-template-columns:1fr}.basket-item{flex-wrap:wrap}}

.search-form{position:relative}
.search-suggestions{position:absolute;inset-inline:0;top:58px;max-width:820px;z-index:30;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px #243d3326;max-height:min(440px,55dvh);overflow-y:auto;overscroll-behavior:contain}
.search-suggestions[hidden]{display:none}
.search-suggestion{display:flex;flex-direction:column;gap:4px;padding:12px 16px;min-height:48px;text-decoration:none;color:inherit;overflow-wrap:anywhere;border-bottom:1px solid var(--line)}
.search-suggestion:last-child{border-bottom:0}
.search-suggestion:hover,.search-suggestion[aria-selected=true]{background:#edf3ed;outline:2px solid #285b4b;outline-offset:-2px}
.search-suggestion strong{font-size:16px}
.suggestion-empty{padding:12px 16px;margin:0}
.beer-best{margin:20px 0;padding:20px;border:1px solid #b8cebe;border-radius:14px;background:#edf3ed}
.beer-best h2{margin-top:0}.beer-best .price{margin-block:8px}
.beer-sellers{display:grid;gap:8px}
.beer-seller{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:12px;background:white;border:1px solid var(--line);border-radius:10px;min-height:44px;text-decoration:none;color:inherit}
.beer-seller span{grid-column:1/-1;overflow-wrap:anywhere}
.offer-card{scroll-margin-top:80px}
@media(max-width:359px){.beer-seller{grid-template-columns:1fr}}
.consent{position:fixed;z-index:50;left:max(var(--gutter),env(safe-area-inset-left));right:max(var(--gutter),env(safe-area-inset-right));bottom:max(var(--gutter),env(safe-area-inset-bottom));max-width:560px;margin:0 auto;padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 30px rgba(32,59,51,.18);font-size:14px}
.consent p{margin:0 0 12px}
.consent div{display:flex;gap:10px}
.consent button{flex:1}
.link-button{min-height:44px;padding:0;border:0;background:none;color:inherit;font-size:inherit;text-decoration:underline;text-underline-offset:4px}
.footer-links{display:flex;flex-wrap:wrap;align-items:center;gap:4px 20px;margin-top:8px}
.footer-links a{display:inline-flex;align-items:center;min-height:44px}
.consent a{font-weight:650}
.policy section{max-width:760px}
.policy h2{margin-top:40px}
.policy ul{padding-left:22px}
.policy li{margin:6px 0}
.policy dd{margin:0 0 16px}
.consent:focus-visible{outline:3px solid #c19334;outline-offset:3px}
.value-section{margin-top:36px;scroll-margin-top:16px}
.value-section h2{margin:0 0 2px;font-size:26px}
.value-pair{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:12px}
.value-panel{min-width:0;padding:4px 14px 6px;background:var(--paper);border:1px solid var(--line);border-radius:14px}
.value-panel h3{margin:12px 0 4px;font-size:15px;color:var(--muted)}
.value-panel[data-basis="by_alcohol"] h3{color:var(--green)}
.value-list{list-style:none;margin:0;padding:0}
.value-card{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.value-card:first-child{border-top:0}
.value-card.best{margin:0 -8px;padding:12px 8px;background:#eef4ef;border-radius:10px}
.value-card.best+.value-card{border-top:0}
.value-thumb{grid-row:span 2;width:44px;height:58px;display:flex;align-items:center;justify-content:center;background:#f1f3ee;border-radius:8px;overflow:hidden;color:#9aa79f}
.value-card.best .value-thumb{background:#fff}
.value-card.empty .value-thumb{height:32px;background:none}
.value-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.value-info{min-width:0}
.value-info p{margin:0}
.value-store{font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--muted)}
.value-card.best .value-store{color:var(--green)}
.value-name{display:block;font-weight:650;overflow-wrap:anywhere;text-decoration:none;padding:2px 0}
.value-name:hover{text-decoration:underline}
.value-price{display:grid;justify-items:end;text-align:right;grid-row:span 2}
.value-price strong{font-size:19px;white-space:nowrap}
.value-price small{color:var(--muted);font-size:13px;white-space:nowrap}
.value-diff{font-size:13px;font-weight:650;color:#9c3d30;white-space:nowrap}
.value-coverage{padding-left:22px;font-size:14px}
@media(max-width:399px){.value-card{grid-template-columns:44px minmax(0,1fr)}.value-price{grid-column:2;grid-row:auto;justify-items:start;text-align:left}}
@media(min-width:900px){.value-pair{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Product page extras: phone layout first, no wider overrides needed. */
.product-extras{margin:0 0 14px}.product-extras>p{margin:0 0 10px}.product-extras .facts{margin:0 0 8px}
.price-history{margin:28px 0}.price-history h2{margin-bottom:8px}
.history-chart{min-height:230px}.history-chart svg{max-height:340px}.history-chart p{margin:10px 4px}
.history-legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 4px;padding:0;font-size:14px}
.history-legend li{display:flex;align-items:center;gap:7px}.history-legend li::before{content:"";width:12px;height:12px;border-radius:3px;background:currentColor;flex:none}
.history-legend span{color:var(--ink)}
.history-chart details{border-top:1px solid #edf0eb;margin:12px 4px 4px;padding-top:6px}
.footer-links .age-note{margin:0;max-width:none;display:inline-flex;align-items:center;min-height:44px;font-weight:600}