:root {
  --ink: #07111d;
  --ink-2: #101d2d;
  --paper: #f5f7fa;
  --card: #ffffff;
  --line: #dfe5ec;
  --muted: #667384;
  --green: #65f20d;
  --green-dark: #2d9700;
  --blue: #22a8e8;
  --orange: #ff7a30;
  --shadow: 0 22px 55px rgba(7, 17, 29, .14);
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
main { background:#071521; }
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
.shell { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }

.announcement {
  background: var(--green);
  color: #07111d;
  text-align: center;
  padding: 8px 16px;
  font-size: .82rem;
  font-weight: 850;
  letter-spacing: .04em;
}
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(7,17,29,.08);
  backdrop-filter: blur(18px);
}
.header-row { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 1.18rem; font-weight: 950; letter-spacing: -.04em; }
.brand-mark {
  width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 13px; background: var(--ink); color: var(--green);
  font-size: .9rem; letter-spacing: -.05em; transform: skew(-7deg);
}
.brand span:last-child { font-style: italic; }
.desktop-nav { display: none; gap: 28px; align-items: center; font-size: .92rem; font-weight: 750; }
.desktop-nav a:hover { color: var(--green-dark); }
.icon-button {
  width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 14px;
  background: #fff; display: grid; place-items: center; color: var(--ink);
}
.icon-button svg { width: 21px; height: 21px; }

.mobile-menu {
  display: none; border-top: 1px solid var(--line); background: #fff;
  padding: 10px 16px 18px;
}
.mobile-menu.open { display: grid; }
.mobile-menu a { padding: 13px 0; border-bottom: 1px solid #eef1f5; font-weight: 750; }

.hero { padding: 18px 0 10px; }
.hero-card {
  position: relative; overflow: hidden; min-height: 570px; border-radius: 28px;
  background: #061120; color: #fff; box-shadow: var(--shadow); isolation: isolate;
}
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 67% center; }
.hero-card::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(3,10,20,.94) 0%, rgba(3,10,20,.68) 42%, rgba(3,10,20,.08) 73%),
    linear-gradient(180deg, rgba(3,10,20,.08), rgba(3,10,20,.12) 52%, rgba(3,10,20,.82) 100%);
}
.hero-copy {
  position: relative; z-index: 2; min-height: 570px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start;
  padding: 40px 22px 24px;
}
.eyebrow { margin: 0 0 9px; font-size: .75rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--green); }
h1 { margin: 0; max-width: 760px; font-size: clamp(3.15rem, 16vw, 6.5rem); line-height: .84; letter-spacing: -.075em; font-style: italic; }
.hero-lead { max-width: 410px; margin: 17px 0 22px; color: #e7edf4; font-size: 1rem; }
.hero-cta {
  display: inline-flex; min-height: 48px; align-items: center; gap: 14px; padding: 0 18px; border-radius: 14px;
  background: var(--green); color: var(--ink); font-size: .8rem; font-weight: 950; letter-spacing: .035em;
  box-shadow: 0 12px 30px rgba(101,242,13,.2);
}
.hero-cta span { font-size: 1.1rem; }
.hero-stamp {
  position: absolute; z-index: 3; right: 17px; bottom: 18px; width: 74px; height: 74px; border-radius: 50%;
  display: grid; place-content: center; text-align: center; transform: rotate(7deg); background: var(--green); color: var(--ink);
  box-shadow: 0 12px 30px rgba(0,0,0,.28); border: 5px solid rgba(255,255,255,.18);
}
.hero-stamp strong { display: block; font-size: .93rem; line-height: 1; }
.hero-stamp span { display: block; margin-top: 3px; font-size: .55rem; font-weight: 900; letter-spacing: .07em; }

.search-section { padding: 10px 0 22px; }
.search-panel {
  display: grid; gap: 13px; padding: 18px; border-radius: 22px; background: #fff; border: 1px solid var(--line);
  box-shadow: 0 12px 34px rgba(7,17,29,.08);
}
.delivery-policy { margin:0; padding:8px 11px; border-radius:9px; background:#e9f8de; color:#244415; font-size:.82rem; font-weight:850; line-height:1.3; text-align:center; }
.search-panel .delivery-policy { display:table; margin:0 auto 6px; padding:4px 9px; font-size:.74rem; }
.modal-body .delivery-policy { margin-top:12px; }
.footer .footer-delivery { margin:0 auto 24px; max-width:720px; color:#c9f6b7; font-size:.9rem; font-weight:800; text-align:center; }
.search-heading span { display: block; color: var(--green-dark); font-size: .69rem; font-weight: 950; letter-spacing: .12em; }
.search-heading strong { display: block; margin-top: 1px; font-size: 1.22rem; letter-spacing: -.035em; }
.search-wrap { position: relative; width: 100%; }
.search-icon { position:absolute; inset:0 auto 0 0; width:52px; display:grid; place-items:center; pointer-events:none; }
.search-icon svg { display:block; width:22px; height:22px; color:#4c5868; }
.search-input {
  width: 100%; min-height: 58px; padding: 0 52px; border: 1px solid #cfd8e2; border-radius: 16px;
  outline: none; background: #f7f9fb; color: var(--ink);
}
.search-input:focus { border-color: var(--green-dark); box-shadow: 0 0 0 4px rgba(101,242,13,.25); background: #fff; }
.search-clear { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; padding: 10px; color: #5d6977; display: none; }

.category-section { padding: 20px 0 32px; }
.section-kicker { margin: 0 0 5px !important; color: var(--green-dark) !important; font-size: .7rem !important; font-weight: 950; letter-spacing: .14em; }
.category-heading { align-items: center; }
.show-all-products {
  flex: 0 0 auto; min-height: 42px; padding: 0 14px; border: 1px solid var(--ink); border-radius: 13px;
  background: transparent; color: var(--ink); font-size: .78rem; font-weight: 900;
}
.show-all-products:hover { background: var(--ink); color: #fff; }
.category-list { display: grid; gap: 10px; }
.category-item { overflow: hidden; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: 0 8px 24px rgba(7,17,29,.045); }
.category-tile {
  width: 100%; min-height: 76px; border: 0; background: #fff; padding: 14px 15px;
  display: grid; grid-template-columns: 42px minmax(0,1fr) auto; grid-template-areas: "num title arrow" "num hint arrow"; align-items: center; gap: 0 12px;
  color: var(--ink); text-align: left; transition: background .2s ease, color .2s ease;
}
.category-tile:hover, .category-item.open .category-tile { background: var(--ink); color: #fff; }
.category-number { grid-area: num; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: #e8ffd9; color: #297b08; font-size: .75rem; font-weight: 950; }
.category-item.open .category-number { background: var(--green); color: var(--ink); }
.category-tile strong { grid-area: title; align-self: end; font-size: 1.02rem; line-height: 1.15; letter-spacing: -.02em; }
.category-hint { grid-area: hint; align-self: start; color: var(--muted); font-size: .75rem; }
.category-item.open .category-hint { color: #aeb9c6; }
.category-arrow { grid-area: arrow; font-size: 1.35rem; transition: transform .2s ease; }
.category-item.open .category-arrow { transform: rotate(180deg); }
.category-submenu { display: none; padding: 12px; background: #f5f7fa; border-top: 1px solid var(--line); grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.category-item.open .category-submenu { display: grid; }
.subcat {
  min-height: 44px; border: 1px solid #d5dde6; background: #fff; color: var(--ink); border-radius: 12px;
  padding: 9px 10px; font-size: .78rem; line-height: 1.2; font-weight: 780; text-align: left;
}
.subcat:hover, .subcat.active { background: var(--green); border-color: var(--green); }
.catalog-results { scroll-margin-top: 96px; margin-top: 26px; padding-top: 25px; border-top: 1px solid var(--line); }
.catalog-results-head { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.catalog-results-head h2 { margin: 0; font-size: clamp(1.6rem, 6vw, 2.55rem); line-height: 1; letter-spacing: -.055em; }
.catalog-results-head p { margin: 7px 0 0; color: var(--muted); font-size: .9rem; }

.section { padding: 28px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.section-heading h2 { margin: 0; font-size: clamp(1.6rem, 6vw, 2.55rem); line-height: 1; letter-spacing: -.055em; }
.section-heading p { margin: 7px 0 0; color: var(--muted); font-size: .92rem; }
.text-button { border: 0; background: transparent; padding: 7px 0; white-space: nowrap; font-weight: 850; color: var(--green-dark); }

.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.product-card {
  min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--card);
  box-shadow: 0 10px 28px rgba(7,17,29,.06); transition: transform .2s ease, box-shadow .2s ease;
}
.product-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(7,17,29,.12); }
.model-open,.product-open { all:unset; cursor:pointer; display:block; width:100%; }
.model-folder .product-image-wrap::after { content:""; position:absolute; inset:auto 0 0; height:35%; background:linear-gradient(transparent,rgba(7,17,29,.22)); pointer-events:none; }
.folder-back { grid-column:1/-1; border:1px solid #cdd6df; border-radius:14px; background:#fff; color:#071521; padding:13px 16px; font:inherit; font-weight:900; text-align:left; cursor:pointer; }
.folder-back:hover { border-color:#6bf119; background:#f4ffed; }
.product-image-wrap { position: relative; aspect-ratio: 1 / 1.06; overflow: hidden; background: #dce5ef; }
.product-image { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.product-card:hover .product-image { transform: scale(1.035); }
.product-badge { position: absolute; left: 9px; top: 9px; border-radius: 999px; padding: 5px 9px; background: #fff; color: var(--ink); font-size: .68rem; font-weight: 900; box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.product-badge.sale { background: var(--orange); color: #fff; }
.product-info { padding: 12px; }
.product-name { margin: 0; min-height: 2.55em; font-size: .91rem; line-height: 1.28; font-weight: 820; }
.product-meta { margin-top: 8px; display: flex; flex-direction: column; gap: 3px; }
.product-price { font-size: 1.13rem; font-weight: 950; letter-spacing: -.035em; }
.product-code { color: var(--muted); font-size: .72rem; }
.product-sizes { color: #334155; font-size: .72rem; font-weight: 750; line-height: 1.35; }
.product-action { width: 100%; margin-top: 11px; border: 0; border-radius: 12px; padding: 11px 9px; background: var(--ink); color: #fff; font-size: .74rem; font-weight: 900; letter-spacing: .01em; }
.product-action:hover { background: #17283a; }

.catalog-empty { display: none; text-align: center; background: #fff; border: 1px dashed #bec8d3; border-radius: 22px; padding: 44px 22px; color: var(--muted); }
.catalog-empty strong { display: block; color: var(--ink); font-size: 1.15rem; margin-bottom: 5px; }

.feature-banner { overflow: hidden; position: relative; min-height: 290px; border-radius: 26px; background: var(--ink); color: #fff; }
.feature-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .46; }
.feature-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,17,29,.97), rgba(7,17,29,.55), rgba(7,17,29,.18)); }
.feature-content { position: relative; z-index: 2; padding: 30px 24px; max-width: 580px; }
.feature-content h2 { margin: 0; font-size: clamp(2rem, 8vw, 4.3rem); line-height: .95; letter-spacing: -.065em; font-style: italic; }
.feature-content p { color: #d1d9e1; max-width: 460px; }
.feature-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.btn { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 9px; border-radius: 13px; padding: 0 17px; font-weight: 850; border: 1px solid transparent; }
.btn-primary { background: var(--green); color: var(--ink); }
.btn-secondary { background: #fff; color: var(--ink); }
.btn-outline { color: #fff; border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.08); }

.footer { margin-top: 34px; padding: 38px 0 110px; background: var(--ink); color: #fff; }
.footer-grid { display: grid; gap: 28px; }
.footer p { color: #aeb9c6; margin: 9px 0 0; max-width: 520px; }
.footer-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; color: var(--green); font-weight: 900; }
.footer a { color: #fff; font-weight: 800; }
.footer-links { display: grid; gap: 10px; }

.floating-contact {
  position: fixed; left: 14px; right: 14px; bottom: 14px; z-index: 35;
  display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 54px;
  border-radius: 17px; color: var(--ink); background: var(--green); font-weight: 950;
  box-shadow: 0 14px 40px rgba(7,17,29,.32);
}

.modal-backdrop { position: fixed; inset: 0; z-index: 70; display: none; align-items: end; background: rgba(4,10,18,.72); backdrop-filter: blur(7px); }
.modal-backdrop.open { display: flex; }
.product-modal { width: 100%; max-height: 94vh; overflow-y: auto; background: #fff; border-radius: 26px 26px 0 0; position: relative; }
.modal-close { position: absolute; z-index: 2; right: 13px; top: 13px; border: 0; width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.94); font-size: 1.35rem; box-shadow: 0 7px 20px rgba(0,0,0,.14); }
.modal-layout { display: grid; }
.modal-media { aspect-ratio: 1 / .87; background: #dce5ef; overflow: hidden; }
.modal-media img { width: 100%; height: 100%; object-fit: cover; }
.modal-body { padding: 22px 20px 28px; }
.modal-kicker { margin: 0 0 7px; color: var(--green-dark); font-size: .75rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.modal-body h3 { margin: 0; font-size: 1.75rem; line-height: 1.05; letter-spacing: -.045em; }
.modal-price { margin: 12px 0 3px; font-size: 1.55rem; font-weight: 950; }
.modal-code { color: var(--muted); font-size: .86rem; }
.modal-sizes { margin: 7px 0 0; color: #263546; font-size: .92rem; font-weight: 800; }
.contact-title { margin: 21px 0 10px; font-size: .86rem; font-weight: 850; }
.contact-grid { display: grid; gap: 9px; }
.contact-btn { min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 9px; border-radius: 13px; font-weight: 900; color: #fff; }
.share-product { border:0; background:#071521; color:#fff; font:inherit; cursor:pointer; }
.share-product::before { content:"↗"; font-size:1.15rem; }
.share-product:hover { background:#14283a; }
.messenger { background: #087bea; }
.viber { background: #665cac; }
.whatsapp { background: #1fae5b; }
.modal-note { margin: 12px 0 0; color: var(--muted); font-size: .77rem; }

@media (min-width: 720px) {
  .shell { width: min(1180px, calc(100% - 56px)); }
  .desktop-nav { display: flex; }
  .menu-toggle { display: none; }
  .hero { padding-top: 28px; }
  .hero-card, .hero-copy { min-height: 610px; }
  .hero-copy { justify-content: center; padding: 56px; }
  .hero-lead { font-size: 1.08rem; }
  .hero-stamp { right: 30px; bottom: 28px; width: 88px; height: 88px; }
  .search-panel { grid-template-columns: 180px 1fr; align-items: center; padding: 20px 22px; }
  .category-tile { min-height: 88px; grid-template-columns: 52px minmax(0,1fr) auto; padding: 16px 20px; }
  .category-number { width: 46px; height: 46px; }
  .category-tile strong { font-size: 1.18rem; }
  .category-hint { font-size: .82rem; }
  .category-submenu { grid-template-columns: repeat(4, minmax(0,1fr)); padding: 14px 18px 18px 86px; }
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
  .product-info { padding: 16px; }
  .product-name { font-size: 1rem; }
  .product-action { font-size: .82rem; }
  .feature-content { padding: 48px; }
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .floating-contact { left: auto; right: 22px; width: 255px; }
  .modal-backdrop { align-items: center; justify-content: center; padding: 30px; }
  .product-modal { max-width: 920px; border-radius: 28px; }
  .modal-layout { grid-template-columns: 1.05fr .95fr; }
  .modal-media { aspect-ratio: auto; min-height: 540px; }
  .modal-body { padding: 52px 42px 38px; }
}

@media (min-width: 1040px) {
  .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .hero-image { object-position: center 52%; }
  .hero-card::after { background: linear-gradient(90deg, rgba(3,10,20,.96) 0%, rgba(3,10,20,.7) 36%, rgba(3,10,20,.04) 70%), linear-gradient(180deg, rgba(3,10,20,.03), rgba(3,10,20,.55) 100%); }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}

/* DM SPORT catalogue redesign */
:root { --paper:#f7f9fc; --green:#69f20b; --ink:#081522; }
.site-header { background:#0a1725; color:#fff; border:0; }
.header-row { min-height:72px; }
.brand { font-size:1.32rem; font-style:italic; }
.brand-mark { background:#101e2c; color:#fff; border:1px solid #38532e; font-size:1.15rem; width:52px; height:52px; }
.icon-button { background:transparent; color:#fff; border:0; }
.mobile-menu { background:#0a1725; border-color:#283a4b; }
.mobile-menu a { border-color:#283a4b; }
.desktop-nav a:hover { color:var(--green); }
.hero { padding:0; background:#071521; }
.hero .shell { width:min(1180px,100%); }
.hero-card { min-height:510px; border-radius:0; box-shadow:none; }
.hero-image { object-position:59% center; }
.hero-card::after { background:linear-gradient(90deg,rgba(4,13,22,.94) 0%,rgba(4,13,22,.68) 36%,transparent 73%),linear-gradient(0deg,rgba(5,14,22,.28),transparent 42%); }
.hero-copy { min-height:510px; padding:36px 25px 26px; justify-content:flex-start; }
.hero h1 { display:flex; flex-direction:column; font-size:clamp(4.15rem,16vw,7.5rem); line-height:.75; letter-spacing:-.08em; text-shadow:0 4px 24px rgba(0,0,0,.4); }
.hero h1 span:last-child { color:var(--green); }
.hero-lead { font-size:1.2rem; font-weight:900; font-style:italic; letter-spacing:.025em; max-width:240px; margin:18px 0 18px; line-height:1.1; }
.hero-cta { border-radius:16px; min-height:50px; font-size:.82rem; }
.search-section { background:#071521; padding:0 0 12px; }
.search-panel { display:block; padding:0; background:transparent; border:0; box-shadow:none; }
.search-icon svg { color:#1c2630; }
.search-input { border:0; border-radius:18px; background:#fff; min-height:58px; font-size:1rem; box-shadow:0 10px 24px rgba(0,0,0,.12); }
.category-section { background:#071521; padding:0 0 24px; }
.category-list { gap:9px; }
.category-item { border:0; border-left:9px solid #ff593b; border-radius:16px; box-shadow:none; }
.category-item:nth-child(2) { border-left-color:#6bf119; }
.category-item:nth-child(3) { border-left-color:#168aec; }
.category-item:nth-child(4) { border-left-color:#1cd9cd; }
.category-item:nth-child(5) { border-left-color:#a747f0; }
.category-tile { position:relative; isolation:isolate; overflow:hidden; display:flex; min-height:104px; padding:14px 13px 14px 18px; background:linear-gradient(90deg,#fff 0%,#f5f8fc 59%,#e9eff4 100%); }
.category-tile:hover,.category-item.open .category-tile { color:var(--ink); background:linear-gradient(90deg,#fff 0%,#f5f8fc 59%,#e9eff4 100%); }
.category-text { position:relative; z-index:2; width:54%; display:flex; flex-direction:column; gap:4px; }
.category-text strong { font-size:clamp(1.08rem,4.2vw,1.6rem); line-height:1; font-weight:950; letter-spacing:-.045em; }
.category-hint,.category-item.open .category-hint { font-size:.8rem; color:#313d4a; line-height:1.24; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.category-photo { position:absolute; z-index:1; right:44px; top:0; bottom:0; width:44%; background-image:url('assets/dm-sport-hero-v2.png'); background-size:auto 230%; background-position:63% 71%; background-repeat:no-repeat; mix-blend-mode:multiply; }
.category-item:nth-child(1) .category-photo { background-image:url('assets/dm-sport-wall.png'); background-position:50% 40%; }
.category-item:nth-child(3) .category-photo { background-image:url('assets/dm-sport-wall.png'); background-position:76% 30%; }
.category-item:nth-child(4) .category-photo { background-image:url('assets/dm-sport-logo.png'); background-position:34% 57%; }
.category-item:nth-child(5) .category-photo { background-image:url('assets/dm-sport-wall.png'); background-position:37% 39%; }
.category-arrow { position:relative; z-index:3; margin-left:auto; flex:0 0 36px; height:36px; border-radius:50%; background:#fff; display:grid; place-items:center; box-shadow:0 3px 12px #07111d20; font-size:1.8rem; line-height:1; }
.category-item.open .category-arrow { transform:rotate(90deg); }
.category-submenu { background:#fff; }
.section { background:#071521; color:#fff; padding:26px 0; }
.section-heading h2,.catalog-results-head h2 { font-size:clamp(1.45rem,5vw,2.35rem); }
.section-heading p { display:none; }
.product-card { border:0; border-radius:16px; color:var(--ink); }
.product-image-wrap { background:#eef1f5; aspect-ratio:1/1; }
.product-badge { background:var(--green); box-shadow:none; }
.product-info { padding:12px; }
.product-name { min-height:2.3em; }
.product-meta { flex-direction:column-reverse; }
.product-code { font-size:.78rem; }
.product-action { display:block; text-align:center; background:var(--green); color:var(--ink); border-radius:10px; }
.catalog-results { margin:0; border:0; padding:0; }
.catalog-results-head p:not(.section-kicker) { color:#aeb9c6; }
.all-section { display:none; padding:18px 0 45px; background:#071521; }
.catalog-focus .all-section { display:block; }
.footer { margin:0; padding-top:24px; }
.contact-bar { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:32px; }
.contact-bar .contact-btn { min-height:54px; font-size:.85rem; }
.floating-contact { display:none; }
@media(min-width:720px) {
 .hero-card,.hero-copy { min-height:590px; }
 .hero-copy { padding:64px; }
 .hero h1 { font-size:clamp(6rem,10vw,9rem); }
 .hero-image { object-position:center; }
 .category-tile { min-height:124px; }
 .category-text { width:60%; }
 .category-photo { right:75px; width:32%; background-size:auto 250%; }
 .category-arrow { flex-basis:46px; height:46px; }
 .category-hint { font-size:1rem; }
 .search-section { padding-top:5px; padding-bottom:6px; }
 .contact-bar { max-width:720px; }
}
.category-photo,.category-item:nth-child(1) .category-photo,.category-item:nth-child(2) .category-photo,.category-item:nth-child(3) .category-photo,.category-item:nth-child(4) .category-photo,.category-item:nth-child(5) .category-photo { background-image:url('assets/category-products.png'); background-size:500% auto; background-repeat:no-repeat; mix-blend-mode:multiply; }
.category-item:nth-child(1) .category-photo { background-position:0% 51%; }
.category-item:nth-child(2) .category-photo { background-position:25% 51%; }
.category-item:nth-child(3) .category-photo { background-position:50% 51%; }
.category-item:nth-child(4) .category-photo { background-position:75% 51%; }
.category-item:nth-child(5) .category-photo { background-position:100% 51%; }

main { display:flex; flex-direction:column; background:#071521; }
.hero { order:0; }.search-section { order:1; }.category-section { order:2; }
.all-section { order:3; }#akcija { order:4; }
/* Keep category names and descriptions within their own left panel. */
.category-tile,
.category-tile:hover,
.category-item.open .category-tile {
  display:grid;
  grid-template-columns:minmax(0, 56%) minmax(0, 1fr) 42px;
  align-items:center;
  gap:0;
  min-height:112px;
  padding:0;
  background:#edf1f5;
}
.category-text {
  grid-column:1;
  grid-row:1;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:auto;
  min-width:0;
  padding:12px 8px 12px 15px;
  background:#fff;
  overflow:hidden;
}
.category-text strong {
  display:block;
  font-size:clamp(1rem, 4.2vw, 1.48rem);
  line-height:1.05;
  overflow-wrap:normal;
  hyphens:auto;
}
.category-hint,.category-item.open .category-hint {
  font-size:clamp(.74rem, 3vw, .92rem);
  line-height:1.18;
  -webkit-line-clamp:3;
}
.category-photo,
.category-item:nth-child(1) .category-photo,
.category-item:nth-child(2) .category-photo,
.category-item:nth-child(3) .category-photo,
.category-item:nth-child(4) .category-photo,
.category-item:nth-child(5) .category-photo {
  position:relative;
  z-index:1;
  grid-column:2;
  grid-row:1;
  inset:auto;
  right:auto;
  top:auto;
  bottom:auto;
  width:100%;
  height:100%;
  background-color:#edf1f5;
  background-size:500% auto;
  mix-blend-mode:normal;
}
.category-arrow {
  grid-column:3;
  grid-row:1;
  margin:0 7px 0 0;
  width:34px;
  height:34px;
  font-size:1.65rem;
}
@media(min-width:720px) {
  .category-tile,.category-tile:hover,.category-item.open .category-tile {
    grid-template-columns:minmax(0, 57%) minmax(0, 1fr) 72px;
    min-height:126px;
  }
  .category-text { padding:18px 26px; }
  .category-text strong { font-size:1.6rem; }
  .category-hint,.category-item.open .category-hint { font-size:1rem; }
  .category-arrow { width:46px; height:46px; margin-right:14px; }
}
/* Reference-matched mobile rhythm and controls */
@media(max-width:719px) {
  .shell { width:calc(100% - 28px); }
  .site-header { position:relative; }
  .header-row { min-height:78px; gap:8px; }
  .brand { min-width:0; gap:14px; font-style:normal; letter-spacing:0; }
  .brand-mark { flex:none; width:62px; height:60px; border-radius:16px; color:#fff; font-size:1.35rem; font-style:italic; font-weight:950; }
  .brand-copy { display:flex; flex-direction:column; min-width:0; }
  .brand-copy strong { font-size:clamp(1.25rem,5vw,1.7rem); font-style:italic; font-weight:950; line-height:1; white-space:nowrap; }
  .brand-copy small { font-size:.57rem; font-weight:700; line-height:1.2; white-space:nowrap; margin-top:3px; }
  .header-search { margin-left:auto; flex:none; display:grid; place-items:center; width:38px; height:44px; }
  .header-search svg { width:29px; height:29px; }
  .icon-button { flex:none; width:36px; height:44px; padding:5px; }
  .icon-button svg { width:30px; height:30px; }
  .hero-card,.hero-copy { min-height:420px; }
  .hero-copy { padding:26px 26px 24px; }
  .hero h1 { font-size:clamp(4rem,16vw,5.7rem); line-height:.77; }
  .hero-lead { margin:13px 0 10px; font-size:1.04rem; line-height:1.06; font-style:italic; font-weight:500; }
  .hero-lead strong { font-size:1.18rem; }
  .hero-points { list-style:none; margin:0 0 13px; padding:0; display:grid; gap:7px; font-size:.8rem; font-weight:750; }
  .hero-points li { display:flex; align-items:center; gap:10px; }
  .hero-points li::before { content:'✧'; color:var(--green); display:grid; place-items:center; width:19px; height:19px; border:2px solid var(--green); border-radius:5px; font-size:1rem; line-height:1; }
  .hero-cta { min-height:44px; padding:0 15px; border-radius:15px; font-size:.78rem; }
  .hero-image { object-position:61% 50%; }
  .hero-card::after { background:linear-gradient(90deg,rgba(4,13,22,.76),rgba(4,13,22,.30) 52%,transparent 78%),linear-gradient(0deg,rgba(5,14,22,.45),transparent 23%); }
  .search-section { padding:0 0 11px; }
  .search-input { min-height:49px; border-radius:16px; padding:0 44px 0 54px; font-size:.95rem; }
  .search-icon { width:54px; }
  .search-filter { position:absolute; right:14px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:23px; height:23px; pointer-events:none; }
  .search-filter svg { position:static; width:21px; transform:none; }
  .category-section { padding:0 0 13px; border-radius:0 0 24px 24px; }
  .category-list { gap:8px; }
  .category-item { border-radius:14px; border-left-width:8px; }
  .category-tile,.category-tile:hover,.category-item.open .category-tile { grid-template-columns:minmax(0,52%) minmax(0,1fr) 44px; min-height:88px; }
  .category-text { padding:10px 4px 10px 15px; gap:5px; }
  .category-text strong { font-size:clamp(1.08rem,4.8vw,1.45rem); letter-spacing:-.04em; }
  .category-hint,.category-item.open .category-hint { font-size:clamp(.75rem,3.05vw,.88rem); line-height:1.2; -webkit-line-clamp:2; }
  .category-arrow { width:34px; height:34px; margin-right:6px; font-size:1.65rem; }
  .category-photo,.category-item:nth-child(1) .category-photo,.category-item:nth-child(2) .category-photo,.category-item:nth-child(3) .category-photo,.category-item:nth-child(4) .category-photo,.category-item:nth-child(5) .category-photo { background-size:500% auto; }
  .section-heading { align-items:center; margin-bottom:12px; gap:8px; }
  .section-heading h2 { font-size:1.24rem; letter-spacing:-.045em; }
  .text-button { font-size:.85rem; }
  .contact-bar { gap:7px; }
  .contact-bar .contact-btn { font-size:.78rem; min-height:50px; border-radius:13px; }
}
@media(min-width:720px) {
  .brand-copy { display:flex; flex-direction:column; }
  .brand-copy strong { font-size:1.35rem; line-height:1; }
  .brand-copy small { font-size:.65rem; margin-top:4px; }
  .header-search { display:none; }
  .hero-points { list-style:none; padding:0; display:grid; gap:7px; }
  .hero-points li::before { content:'✧'; color:var(--green); margin-right:10px; }
  .search-filter { display:none; }
}
@media(max-width:370px) {
  .brand-mark { width:48px; height:50px; }
  .brand { gap:7px; }
  .brand-copy strong { font-size:1.15rem; }
  .brand-copy small { font-size:.48rem; }
  .category-tile,.category-tile:hover,.category-item.open .category-tile { grid-template-columns:minmax(0,54%) minmax(0,1fr) 38px; }
  .category-text { padding-left:9px; }
  .category-text strong { font-size:1.02rem; }
}
.category-tile .category-text strong { grid-area:auto; align-self:stretch; }
.category-tile .category-text .category-hint { grid-area:auto; align-self:stretch; }
.category-tile,.category-tile:hover,.category-item.open .category-tile { grid-template-areas:none; grid-template-rows:minmax(0,1fr); }
.category-item[data-category-item="Sve za dom i djecu – ostala ponuda"] .category-photo { background-image:url('assets/sve-za-dom-i-djecu.png'); background-size:auto 210%; background-position:55% bottom; }
@media(max-width:719px) {
  .category-item[data-category-item="Sve za dom i djecu – ostala ponuda"] .category-text { padding-top:7px; padding-bottom:7px; gap:2px; }
  .category-item[data-category-item="Sve za dom i djecu – ostala ponuda"] .category-text strong { font-size:clamp(.96rem,4.2vw,1.18rem); }
}
/* Compact the two gaps around mobile catalogue search. */
@media (max-width:719px) {
  .hero-card, .hero-copy { min-height:374px; }
  .hero-copy { padding-bottom:8px; }
  .search-section { position:relative; z-index:2; margin-top:-12px; padding-bottom:7px; }
  .category-section { padding-top:0; }
}

/* Compact album cards and protected image viewing. */
img {
  -webkit-user-drag:none;
  user-select:none;
  -webkit-user-select:none;
}
.all-section .product-info,
.all-section .model-folder .product-info {
  padding:8px 9px 9px;
}
.all-section .product-name,
.all-section .model-folder .product-name {
  min-height:0;
  font-size:.86rem;
  line-height:1.15;
}
.all-section .product-meta {
  margin-top:4px;
  gap:1px;
}
.all-section .product-price { font-size:.98rem; }
.all-section .product-code,
.all-section .product-sizes { font-size:.66rem; line-height:1.22; }
.all-section .product-action {
  margin-top:6px;
  padding:8px 5px;
  font-size:.68rem;
}
.modal-image-open {
  all:unset;
  position:relative;
  display:block;
  width:100%;
  height:100%;
  cursor:zoom-in;
}
.modal-image-open span {
  position:absolute;
  left:50%;
  bottom:12px;
  transform:translateX(-50%);
  padding:8px 12px;
  border-radius:999px;
  background:rgba(7,21,33,.88);
  color:#fff;
  font-size:.69rem;
  font-weight:900;
  letter-spacing:.04em;
  white-space:nowrap;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
}
.image-lightbox {
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
  align-items:center;
  justify-content:center;
  padding:70px 12px 16px;
  background:rgba(2,8,14,.98);
}
.image-lightbox.open { display:flex; }
.image-lightbox img {
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:calc(100vh - 88px);
  object-fit:contain;
}
.lightbox-back {
  position:absolute;
  top:max(14px,env(safe-area-inset-top));
  left:14px;
  min-height:44px;
  padding:0 16px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:13px;
  background:#fff;
  color:#071521;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}
#akcija { scroll-margin-top:84px; }
#akcija { padding-top:14px; padding-bottom:34px; }

@media(min-width:720px) {
  .all-section .product-info,
  .all-section .model-folder .product-info { padding:10px 11px 11px; }
  .all-section .product-name { font-size:.94rem; }
  .all-section .product-action { font-size:.74rem; }
}

/* Catalog inquiry cart */
body.cart-open { overflow:hidden; }
.cart-trigger { display:flex; align-items:center; gap:6px; min-height:42px; padding:5px 8px; border:1px solid rgba(101,242,13,.35); border-radius:12px; background:#102334; color:#fff; font:inherit; font-weight:800; cursor:pointer; white-space:nowrap; }
.cart-trigger svg { width:21px; height:21px; }
.cart-trigger b { display:grid; place-items:center; min-width:22px; height:22px; padding:0 4px; border-radius:50px; background:#65f20d; color:#071521; font-size:.8rem; }
.add-cart { border:0; border-radius:10px; background:#65f20d; color:#071521; font:inherit; font-size:.85rem; font-weight:900; cursor:pointer; min-height:40px; }
.card-add-cart { display:block; width:calc(100% - 18px); margin:0 9px 9px; }
.modal-add-cart { width:100%; margin:12px 0 5px; min-height:48px; }
.cart-backdrop { position:fixed; inset:0; z-index:129; background:rgba(2,9,15,.68); }
.cart-backdrop[hidden] { display:none; }
.cart-drawer { position:fixed; z-index:130; inset:0 0 0 auto; width:min(440px,100%); height:100dvh; display:flex; flex-direction:column; background:#f7f9fb; color:#0b1b29; box-shadow:-20px 0 55px rgba(0,0,0,.25); transform:translateX(105%); visibility:hidden; transition:transform .22s ease,visibility .22s; }
.cart-drawer.open { transform:translateX(0); visibility:visible; }
.cart-head { display:flex; justify-content:space-between; align-items:center; padding:20px 20px 16px; background:#071521; color:#fff; }
.cart-head small { color:#65f20d; font-size:.72rem; font-weight:900; letter-spacing:.07em; }
.cart-head h2 { margin:4px 0 0; font-size:1.45rem; }
.cart-head h2 span { color:#65f20d; }
.cart-close { width:42px; height:42px; border:1px solid rgba(255,255,255,.2); border-radius:11px; background:transparent; color:#fff; font-size:1.8rem; cursor:pointer; }
.cart-list { flex:1; overflow:auto; padding:16px; }
.cart-item { display:flex; gap:12px; margin-bottom:12px; padding:10px; border:1px solid #dce3e8; border-radius:14px; background:#fff; }
.cart-item img { flex:none; width:84px; height:90px; object-fit:cover; border-radius:9px; background:#e9edf0; }
.cart-item-detail { display:flex; flex-direction:column; gap:2px; min-width:0; font-size:.84rem; }
.cart-item-detail strong { font-size:.95rem; line-height:1.25; overflow-wrap:anywhere; }
.cart-item-detail>span { color:#52616e; }
.cart-item-actions { display:flex; gap:6px; align-items:center; margin-top:7px; }
.cart-item-actions button { min-width:31px; min-height:31px; border:1px solid #c8d2d9; border-radius:7px; background:#f6f8f9; color:#0b1b29; font:inherit; font-weight:800; cursor:pointer; }
.cart-item-actions .cart-remove { margin-left:4px; padding:0 8px; font-size:.75rem; }
.cart-empty { padding:44px 14px; text-align:center; }
.cart-empty strong { font-size:1.15rem; }
.cart-empty p { color:#52616e; }
.cart-empty button { padding:12px 16px; border:0; border-radius:10px; background:#65f20d; font:inherit; font-weight:800; cursor:pointer; }
.cart-bottom { padding:14px 18px max(18px,env(safe-area-inset-bottom)); border-top:1px solid #dce3e8; background:#fff; max-height:54dvh; overflow:auto; }
.cart-bottom[hidden] { display:none; }
.cart-bottom p { margin:0 0 12px; color:#52616e; font-size:.85rem; line-height:1.35; }
.cart-bottom .delivery-policy { margin:0 0 12px; color:#244415; }
.cart-send,.cart-share { display:flex; align-items:center; justify-content:center; width:100%; min-height:45px; margin:7px 0; padding:9px; border:0; border-radius:10px; color:#fff; font:inherit; font-size:.88rem; font-weight:800; text-align:center; text-decoration:none; cursor:pointer; }
.cart-send.whatsapp { background:#15864c; }.cart-send.viber { background:#6650a0; }.cart-send.messenger { background:#1462bc; }
.cart-share { background:#142c3d; }.cart-share[hidden] { display:none; }
.cart-feedback { display:block; font-size:.82rem; color:#184f2d; line-height:1.3; }
@media(max-width:719px) { .cart-trigger { gap:4px; padding:4px 6px; font-size:.73rem; } .cart-trigger svg { width:18px; height:18px; } .cart-trigger b { min-width:19px; height:19px; font-size:.7rem; } }
@media(max-width:370px) { .cart-trigger span { display:none; } }
@media(prefers-reduced-motion:reduce) { .cart-drawer { transition:none; } }
