/* WordPress theme additions on top of grand.css (the prototype's design system, kept identical). */

/* ---------- Montserrat (variable, self-hosted: @fontsource-variable/montserrat 5.3.0, OFL) ---------- */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-cyrillic-wght-normal.woff2) format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-ext-wght-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-wght-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: italic; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-cyrillic-wght-italic.woff2) format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Montserrat"; font-style: italic; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-ext-wght-italic.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: italic; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-wght-italic.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* ---------- Header extras ---------- */
.skip-link:focus { position: fixed; top: 8px; left: 8px; z-index: 100; width: auto; height: auto; clip: auto; padding: 10px 16px; background: var(--navy); color: #fff; }
.admin-bar .header { top: 32px; }
@media (max-width: 782px) { .admin-bar .header { top: 0; } }
.search { position: relative; }
.search summary { list-style: none; }
.search summary::-webkit-details-marker { display: none; }
.search__form { position: absolute; top: calc(100% + 16px); right: -60px; z-index: 60; display: flex; gap: 8px; width: min(440px, calc(100vw - 32px)); padding: 14px; background: #fff; border: 1px solid var(--line); box-shadow: 0 18px 40px -28px rgba(12,27,53,.45); }
.search__form .btn { min-height: 46px; padding: 0 18px; }
@media (max-width: 480px) { .search__form { position: fixed; top: calc(var(--header-h) + 40px); left: 16px; right: 16px; width: auto; } }

/* ---------- Home series: tighter rhythm than the prototype + specs under each top view ---------- */
#modele { padding-top: clamp(48px, 6vw, 80px); padding-bottom: clamp(48px, 6vw, 80px); }
#modele .section__head { margin-bottom: 28px; }
.series + .series { margin-top: clamp(40px, 5vw, 64px); padding-top: clamp(32px, 4vw, 48px); border-top: 1px solid var(--line); }
.series__head { margin-bottom: 24px; gap: 12px 48px; }
.series__boats { gap: 32px 16px; }
/* height:auto — the width/height attributes (kept for layout stability) must not stretch the image to 577 px. */
.series__boat img { max-width: 112px; height: auto; object-fit: cover; object-position: 50% 100%; }
.series__boat b { margin-top: 10px; }
.series__specs { display: grid; gap: 2px; width: 100%; max-width: 170px; margin: 8px 0 0; font-size: .72rem; line-height: 1.35; }
.series__specs div { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; border-bottom: 1px solid var(--line); }
.series__specs dt { color: var(--muted); font-weight: 300; }
.series__specs dd { margin: 0; color: var(--ink); font-weight: 500; white-space: nowrap; }
.series__boat .series__price { margin-top: 8px; font-size: .8rem; color: var(--navy); font-weight: 500; }
@media (max-width: 900px) { .series__head p { text-align: left; } }

/* ---------- Catalog (moved from prototype/boats.html) ---------- */
.cat-head { background: var(--paper); padding: 8px 0 36px; }
.cat-head h1 { font-size: clamp(2rem, 4vw, 3rem); margin: 6px 0 12px; }
.cat-head p { max-width: 70ch; }
.catalog { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 48px; padding-top: 40px; padding-bottom: 96px; }
.side { position: sticky; top: calc(var(--header-h) + 20px); align-self: start; display: grid; gap: 30px; }
.side h3 { font-size: .72rem; letter-spacing: var(--track); text-transform: uppercase; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--ink); display: flex; justify-content: space-between; }
.side h3 output { font-weight: 400; letter-spacing: .02em; text-transform: none; color: var(--muted); font-size: .8rem; }
.line-list { display: grid; }
.line-list a { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: .9rem; font-weight: 300; }
.line-list a:hover { color: var(--navy); }
.line-list small { color: var(--muted); }
.line-list a[aria-current] { font-weight: 500; color: var(--navy); }
.range { position: relative; height: 28px; }
.range input { position: absolute; inset: 0; width: 100%; margin: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; }
.range input::-webkit-slider-runnable-track { height: 2px; background: var(--line); }
.range input::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto; width: 18px; height: 18px; margin-top: -8px; border-radius: 50%; background: #fff; border: 2px solid var(--navy); cursor: pointer; }
.range input::-moz-range-thumb { pointer-events: auto; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid var(--navy); cursor: pointer; }
.range input::-moz-range-track { height: 2px; background: var(--line); }
.side .btn { width: 100%; }
.toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; font-size: .84rem; color: var(--muted); }
.toolbar__right { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.toolbar .select { width: auto; min-height: 40px; }
.seg { display: inline-flex; border: 1px solid var(--line); }
.seg button { min-height: 38px; padding: 0 14px; border: 0; background: #fff; cursor: pointer; font-size: .74rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.seg button[aria-pressed="true"] { background: var(--navy); color: #fff; }
.filters-toggle { display: none; }
/* Without JS the range filters do nothing, so they stay hidden; line links still work. */
html:not(.js) .side > div:not(:first-child), html:not(.js) .side [data-reset], html:not(.js) .toolbar__right, html:not(.js) .type-chips { display: none; }
@media (max-width: 980px) {
  .catalog { grid-template-columns: 1fr; gap: 24px; }
  .side { position: static; display: none; }
  .side.is-open { display: grid; padding: 20px; border: 1px solid var(--line); }
  .filters-toggle { display: inline-flex; }
}

/* ---------- Model page (moved from prototype/model.html) ---------- */
/* Hero carousel — controls in a small pill so the photo stays clean (no darkening overlay). */
/* Photos are 16:9: the height follows the width (capped by the screen height), so the whole photo is always visible. */
/* Model photos are 16:9 studio shots: the frame is 16:9 too (as wide as fits the screen height), so the whole
   photo shows with no side bars; other ratios are cropped to fill. */
.carousel { position: relative; width: min(100%, calc((100svh - var(--header-h) - 40px) * 16 / 9)); aspect-ratio: 16 / 9; margin: 0 auto; background: var(--paper); overflow: hidden; color: #fff; }
.carousel__track { display: flex; height: 100%; transition: transform .7s var(--ease); }
.carousel__slide { flex: 0 0 100%; height: 100%; }
.carousel__slide img { width: 100%; height: 100%; object-fit: cover; }
.carousel__ctrl { position: absolute; z-index: 3; right: var(--gutter); bottom: 24px; display: flex; align-items: center; gap: 4px; padding: 4px; background: rgba(255,255,255,.92); }
.carousel__ctrl button { width: 40px; height: 40px; border: 0; background: none; color: var(--navy); cursor: pointer; display: grid; place-items: center; }
.carousel__ctrl button:hover { background: var(--navy); color: #fff; }
.carousel__count { font-size: .76rem; letter-spacing: .14em; min-width: 64px; text-align: center; color: var(--navy); font-weight: 500; }
.carousel__bar { position: absolute; z-index: 3; left: 0; bottom: 0; height: 2px; background: var(--sand); transition: width .7s var(--ease); }
@media (max-width: 760px) { .carousel__ctrl { bottom: 8px; right: 8px; } }
/* Models without photos yet: manufacturer render on a light band. */
.m-render { background: #f9f9f9; display: grid; place-items: center; padding: clamp(24px, 4vw, 48px) var(--gutter); }
.m-render img { max-height: min(48vh, 460px); width: auto; object-fit: contain; }

.m-bar { border-bottom: 1px solid var(--line); }
.m-bar .wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; padding-top: 4px; padding-bottom: 32px; }
.m-bar h1 { font-size: clamp(2.4rem, 5vw, 4rem); margin: 8px 0 6px; }
.m-bar p { margin: 0; max-width: 60ch; color: var(--muted); }
.m-bar__buy { display: grid; gap: 12px; justify-items: end; }
.hero-price { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.hero-price b { font-size: 2rem; font-weight: 500; color: var(--ink); }
.hero-price span { font-size: .76rem; color: var(--muted); letter-spacing: .04em; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
@media (max-width: 900px) { .m-bar .wrap { grid-template-columns: 1fr; } .m-bar__buy { justify-items: start; } .hero-cta { justify-content: flex-start; } }

.subnav { position: sticky; top: var(--header-h); z-index: 30; background: #fff; border-bottom: 1px solid var(--line); }
.admin-bar .subnav { top: calc(var(--header-h) + 32px); }
.subnav .wrap { display: flex; align-items: center; gap: 28px; overflow-x: auto; scrollbar-width: none; }
.subnav a { padding: 16px 0; font-size: .74rem; font-weight: 500; letter-spacing: var(--track); text-transform: uppercase; white-space: nowrap; color: var(--muted); border-bottom: 2px solid transparent; }
.subnav a:hover, .subnav a.is-active { color: var(--ink); border-color: var(--sand); }
.subnav .btn { margin-left: auto; min-height: 38px; padding: 0 18px; color: #fff; }
@media (max-width: 760px) { .subnav .btn { display: none; } }
.model .section { scroll-margin-top: calc(var(--header-h) + 56px); }

/* Description: two wide text columns in the middle of the page, the model's highlights in a row under them. */
.desc { max-width: 1180px; margin-inline: auto; }
.desc > div:first-child { text-align: center; }
.desc__text { columns: 2 380px; column-gap: clamp(40px, 5vw, 72px); margin-top: 32px; text-align: left; }
.desc__text h3 { break-after: avoid; font-size: 1.05rem; margin: 0 0 10px; }
.desc__text p { font-size: .95rem; line-height: 1.75; }
.desc__text--rich { columns: auto; max-width: 860px; margin-inline: auto; }
.desc__text--rich h2 { font-size: clamp(1.2rem, 2vw, 1.5rem); margin: 40px 0 14px; }
.desc__text--rich h3 { margin-top: 28px; }
.desc__text--rich img { display: block; width: 100%; height: auto; margin: 20px 0; }
.desc__text--rich ul { padding-left: 1.2em; }
.desc__text--rich li p { margin: 0 0 8px; }
.desc__aside { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1px; margin-top: 56px; background: var(--line); border: 1px solid var(--line); }
.desc__aside div { background: #fff; padding: 18px 20px; }
.desc__aside b { display: block; color: var(--ink); font-weight: 500; margin-bottom: 4px; }
.desc__aside span { font-size: .86rem; color: var(--muted); }

.kpis { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid var(--line); margin-bottom: 48px; background: #fff; }
.kpi { padding: 24px 20px; display: grid; gap: 6px; }
.kpi + .kpi { border-left: 1px solid var(--line); }
.kpi svg { width: 26px; height: 26px; color: var(--sand); }
.kpi b { font-size: 1.5rem; font-weight: 500; color: var(--ink); line-height: 1.1; }
.kpi span { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
@media (max-width: 900px) { .kpis { grid-template-columns: repeat(3, 1fr); } .kpi:nth-child(4) { border-left: 0; } .kpi:nth-child(n+4) { border-top: 1px solid var(--line); } }
@media (max-width: 480px) { .kpis { grid-template-columns: repeat(2, 1fr); } .kpi { border-left: 0 !important; border-top: 1px solid var(--line); } .kpi:nth-child(-n+2) { border-top: 0; } .kpi:nth-child(even) { border-left: 1px solid var(--line) !important; } .kpi b { font-size: 1.2rem; } }
.spec-table { display: grid; grid-template-columns: 1fr 1fr; column-gap: 56px; margin: 0; }
.spec-row { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: .92rem; }
.spec-row dt { font-weight: 300; }
.spec-row dd { margin: 0; font-weight: 500; color: var(--ink); text-align: right; }
@media (max-width: 760px) { .spec-table { grid-template-columns: 1fr; } }

.tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.tab { min-height: 42px; padding: 0 20px; border: 1px solid var(--line); background: #fff; cursor: pointer; font-size: .76rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }
.tab[aria-selected="true"] { background: var(--navy); color: #fff; border-color: var(--navy); }
.scheme { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 48px; align-items: start; }
@media (max-width: 960px) { .scheme { grid-template-columns: 1fr; } }
.scheme__img { position: relative; background: #fff; border: 1px solid var(--line); padding: 24px; }
.scheme__canvas { position: relative; }
.scheme__img img { width: 100%; }
.hotspot { position: absolute; width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 50%; border: 2px solid transparent; transition: background .2s, border-color .2s, transform .2s; cursor: pointer; }
.hotspot:hover, .hotspot.is-on { background: rgba(164,152,137,.35); border-color: var(--sand); transform: scale(1.25); }
.legend { list-style: none; margin: 0; padding: 0; max-height: 520px; overflow: auto; }
.legend li { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 10px 8px; border-bottom: 1px solid var(--line); font-size: .88rem; font-weight: 300; line-height: 1.45; transition: background .15s; }
.legend li b { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--sand); color: var(--sand-text); font-size: .76rem; font-weight: 600; }
.legend li.is-on { background: #f1efec; }
.legend li.is-on b { background: var(--sand); color: #fff; }

.equip { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; }
@media (max-width: 900px) { .equip { grid-template-columns: 1fr; } }
.eq-list { list-style: none; margin: 0; padding: 0; }
.eq-list li { padding: 11px 0 11px 24px; border-bottom: 1px solid var(--line); position: relative; font-size: .9rem; font-weight: 300; }
.eq-list li::before { content: ""; position: absolute; left: 0; top: 21px; width: 12px; height: 1px; background: var(--sand); }
.eq-list--opt li::before { content: "+"; width: auto; height: auto; background: none; top: 10px; color: var(--sand-text); font-weight: 500; }
.strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 24%); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; margin-top: 40px; }
.strip button { scroll-snap-align: start; padding: 0; border: 0; aspect-ratio: 4 / 3; overflow: hidden; cursor: zoom-in; background: var(--paper); }
.strip img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.strip button:hover img { transform: scale(1.05); }
.strip button { position: relative; }
.strip__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 10px 8px; background: linear-gradient(transparent, rgba(12,27,53,.75)); color: #fff; font-size: .72rem; line-height: 1.3; text-align: left; }

/* Gallery as on the old site: edge to edge, 4 columns × up to 3 rows of 16:9 photos, sideways by page. */
.gal { position: relative; margin-top: 8px; }
.gal__track { display: grid; grid-auto-flow: column; grid-template-rows: repeat(var(--rows, 3), auto); grid-auto-columns: 25%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.gal__track::-webkit-scrollbar { display: none; }
.gal__track button { display: block; aspect-ratio: 16 / 9; padding: 0; border: 1px solid #fff; overflow: hidden; cursor: zoom-in; background: var(--paper); }
.gal__track button:nth-child(4n + 1) { scroll-snap-align: start; }
.gal__track img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.gal__track button:hover img { transform: scale(1.04); }
.gal__nav { position: absolute; top: calc(50% - 20px); transform: translateY(-50%); width: 48px; height: 48px; display: grid; place-items: center; border: 0; background: rgba(255,255,255,.92); color: var(--navy); cursor: pointer; box-shadow: 0 2px 12px rgba(12,27,53,.18); }
.gal__nav:hover { background: var(--navy); color: #fff; }
.gal__prev { left: 16px; } .gal__next { right: 16px; }
.gal__dots { display: flex; justify-content: center; flex-wrap: wrap; gap: 0; padding: 22px var(--gutter) 0; }
.gal__dots { font-size: .78rem; letter-spacing: .12em; color: var(--muted); }
/* 24 px to tap (touch target), a 9 px dot to see. */
.gal__dots button { width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.gal__dots button::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--line); }
.gal__dots button[aria-current="true"]::before { background: var(--sand); }
.gal.is-single .gal__nav, .gal.is-single .gal__dots { display: none; }
@media (max-width: 700px) { .gal__track { grid-auto-columns: 50%; grid-template-rows: repeat(2, auto); } .gal__track button:nth-child(4n + 1) { scroll-snap-align: none; } .gal__track button:nth-child(2n + 1) { scroll-snap-align: start; } .gal__nav { width: 40px; height: 40px; } }
.lightbox { position: fixed; inset: 0; z-index: 100000; background: rgba(8,20,42,.96); display: grid; grid-template-rows: auto 1fr auto; color: #fff; }
.lightbox[hidden] { display: none; }
.lightbox__top { display: flex; justify-content: space-between; align-items: center; padding: 16px var(--gutter); font-size: .8rem; letter-spacing: .12em; }
.lightbox__stage { display: grid; place-items: center; padding: 0 64px; min-height: 0; }
.lightbox__stage img { max-width: 100%; max-height: 78vh; object-fit: contain; }
.lightbox button { background: none; border: 1px solid rgba(255,255,255,.35); color: #fff; width: 46px; height: 46px; cursor: pointer; display: grid; place-items: center; }
.lightbox button:hover { background: #fff; color: var(--navy); }
.lightbox__nav { position: absolute; top: 50%; transform: translateY(-50%); }
.lightbox__prev { left: 12px; } .lightbox__next { right: 12px; }
.lightbox__thumbs { display: flex; gap: 6px; overflow-x: auto; padding: 14px var(--gutter); }
.lightbox__thumbs img { width: 84px; height: 56px; object-fit: cover; opacity: .45; cursor: pointer; flex: none; }
.lightbox__thumbs img.is-on { opacity: 1; outline: 1px solid var(--sand); }

.docs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 900px) { .docs { grid-template-columns: 1fr; } }
.doc-card { display: grid; grid-template-columns: 110px 1fr; gap: 20px; padding: 20px; border: 1px solid var(--line); background: #fff; align-items: center; transition: border-color .2s; }
.doc-card:hover { border-color: var(--sand); }
.doc-card__thumb { aspect-ratio: 3 / 4; background: var(--paper); display: grid; place-items: center; overflow: hidden; }
.doc-card__thumb img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.doc-card b { display: block; font-weight: 500; color: var(--ink); margin-bottom: 4px; }
.doc-card span { font-size: .8rem; color: var(--muted); }
.doc-card em { display: inline-block; margin-top: 10px; font-style: normal; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--navy); }
.split__media--plain { background: #fff; display: grid; place-items: center; }
.split__media--plain img { object-fit: contain; padding: 16px; }

/* ---------- FAQ (moved from prototype/faq.html; questions are core Details blocks) ---------- */
.faq-hero { background: var(--paper); padding: 8px 0 44px; }
.faq-hero h1 { font-size: clamp(2rem, 4vw, 3rem); margin: 6px 0 12px; }
.faq-hero p { max-width: 70ch; }
.faq-search { position: relative; max-width: 620px; margin-top: 24px; }
.faq-search input { padding-left: 46px; min-height: 54px; font-size: 1rem; }
.faq-search svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); width: 20px; color: var(--muted); }
html:not(.js) .faq-search { display: none; }
.faq { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 56px; padding-top: 56px; padding-bottom: 96px; }
.faq-nav { position: sticky; top: calc(var(--header-h) + 24px); align-self: start; display: grid; }
.faq-nav a { padding: 11px 0 11px 14px; border-left: 2px solid var(--line); font-size: .9rem; color: var(--muted); }
.faq-nav a:hover, .faq-nav a.is-active { color: var(--ink); border-color: var(--sand); }
.faq-list h2 { font-size: 1.5rem; margin: 56px 0 12px; scroll-margin-top: calc(var(--header-h) + 24px); }
.faq-list h2:first-child { margin-top: 0; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 20px 0; font-weight: 500; color: var(--ink); font-size: 1.02rem; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; flex: none; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); font-weight: 300; font-size: 1.2rem; color: var(--sand-text); transition: transform .25s var(--ease); }
.faq-list details[open] summary::after { transform: rotate(45deg); }
.faq-list details > :not(summary) { margin: 0 56px .8em 0; font-weight: 300; line-height: 1.75; }
.faq-list details > :last-child { padding-bottom: 14px; }
.faq-list details ul, .faq-list details ol { padding-left: 20px; }
.faq-list details a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.faq-empty { padding: 32px 0; color: var(--muted); }
.faq-cta { margin-top: 64px; padding: 32px; background: var(--navy); color: rgba(255,255,255,.8); display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.faq-cta h3 { color: #fff; margin: 0 0 4px; }
.faq-cta p { margin: 0; }
@media (max-width: 900px) {
  .faq { grid-template-columns: 1fr; gap: 24px; }
  .faq-nav { position: static; display: flex; overflow-x: auto; }
  .faq-nav a { border-left: 0; border-bottom: 2px solid var(--line); white-space: nowrap; padding: 10px 14px; }
  .faq-list details > :not(summary) { margin-right: 0; }
}

/* ---------- Dlaczego GRAND (moved from prototype/why.html) ---------- */
.why-hero { position: relative; min-height: 70vh; display: flex; align-items: flex-end; overflow: hidden; background: var(--navy); }
.why-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.why-hero .wrap { position: relative; z-index: 1; }
.why-hero__card { background: #fff; max-width: 620px; padding: clamp(24px, 4vw, 48px); margin-bottom: clamp(24px, 6vh, 64px); }
.why-hero__card h1 { font-size: clamp(2rem, 4.5vw, 3.4rem); margin: 8px 0 12px; }
.why-hero__card p { margin: 0; }
.numbers { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); }
.numbers div { padding: 32px 20px; }
.numbers div + div { border-left: 1px solid rgba(255,255,255,.15); }
.numbers b { display: block; color: #fff; font-size: clamp(1.6rem, 2.6vw, 2.3rem); font-weight: 500; line-height: 1.1; }
.numbers span { font-size: .78rem; letter-spacing: .04em; }
@media (max-width: 980px) { .numbers { grid-template-columns: repeat(3, 1fr); } .numbers div:nth-child(4) { border-left: 0; } .numbers div:nth-child(n+4) { border-top: 1px solid rgba(255,255,255,.15); } }
@media (max-width: 560px) { .numbers { grid-template-columns: repeat(2, 1fr); } .numbers div { border-left: 0 !important; border-top: 1px solid rgba(255,255,255,.15); } }
.reasons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.reason { background: #fff; padding: 32px 28px; display: grid; gap: 10px; align-content: start; }
.reason svg { width: 34px; height: 34px; color: var(--sand); }
.reason h3 { margin: 6px 0 0; font-size: 1.12rem; }
.reason p { margin: 0; font-size: .92rem; }
@media (max-width: 900px) { .reasons { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .reasons { grid-template-columns: 1fr; } }
.tech { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 88px); align-items: center; }
.tech + .tech { margin-top: 80px; }
.tech--rev .tech__media { order: 2; }
.tech__media { background: #fff; border: 1px solid var(--line); padding: 20px; }
.tech ul { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.tech li { padding-left: 24px; position: relative; font-weight: 300; }
.tech li::before { content: ""; position: absolute; left: 0; top: 12px; width: 12px; height: 1px; background: var(--sand); }
@media (max-width: 900px) { .tech { grid-template-columns: 1fr; } .tech--rev .tech__media { order: 0; } }
.distributor { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 48px; margin-top: 32px; }
.distributor div { display: grid; grid-template-columns: 40px 1fr; gap: 14px; }
.distributor b { display: block; color: #fff; font-weight: 500; }
.distributor svg { width: 28px; height: 28px; color: var(--sand); }
@media (max-width: 760px) { .distributor { grid-template-columns: 1fr; } }

/* ---------- Plain pages, search, 404 ---------- */
.content { padding-top: 48px; padding-bottom: 96px; max-width: 900px; }
.content--404 { min-height: 50vh; }
.entry + .entry { margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--line); }
.entry__content a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Forms: enquiry (Kontakt, Serwis) and messages ---------- */
.msg { font-size: .84rem; padding: 10px 14px; border-left: 3px solid; background: var(--paper); }
.msg:empty { display: none; }
.msg--ok { border-color: var(--ok); }
.msg--error { border-color: #b3261e; }
.enquiry { display: grid; gap: 18px; margin-top: 24px; scroll-margin-top: calc(var(--header-h) + 24px); }
.enquiry__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.enquiry__wide { grid-column: 1 / -1; }
.enquiry textarea { resize: vertical; min-height: 130px; font: inherit; }
.enquiry .btn { justify-self: start; }
.enquiry__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) { .enquiry__grid { grid-template-columns: 1fr; } }
/* Grid children default to min-width: auto, so a file input (≈360 px wide in browsers) or a long word pushed the forms of
   the owner, dealer and distributor zones past the phone screen. Columns may shrink; controls never exceed their cell. */
.enquiry, .field, .hull-gallery { grid-template-columns: minmax(0, 1fr); }
.enquiry__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 640px) { .enquiry__grid { grid-template-columns: minmax(0, 1fr); } }
.enquiry > *, .enquiry__grid > *, .field > *, .hull-gallery > * { min-width: 0; }
.enquiry input, .enquiry select, .enquiry textarea { max-width: 100%; }
.enquiry input[type="file"] { width: 100%; font-size: .86rem; }
.enquiry label, .enquiry .check, .panel-hint { overflow-wrap: anywhere; }

/* ---------- Kontakt / Serwis ---------- */
.contact { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.contact h2 { margin-top: 0; }
.contact__info { display: grid; gap: 16px; }
.contact__card { display: grid; gap: 8px; justify-items: start; padding: 24px; border: 1px solid var(--line); background: #fff; }
.contact__card p { margin: 0 0 8px; font-size: .9rem; }
.contact__card--muted { background: var(--paper); border-color: transparent; }
/* Client cards in the panels hold 3D links and option lists without spaces: they wrap instead of widening the card. */
.contact__info, .contact__card { grid-template-columns: minmax(0, 1fr); }
.contact__card { justify-items: stretch; }
.contact__card > * { min-width: 0; max-width: 100%; justify-self: start; overflow-wrap: anywhere; }
.contact__card--muted p { font-size: .8rem; color: var(--muted); }
.contact__card a:not(.btn) { color: var(--navy); }
.contact__big { font-size: clamp(1.3rem, 2.4vw, 1.7rem); font-weight: 500; margin-bottom: 10px; }
.hours { display: grid; width: 100%; margin: 0 0 12px; font-size: .86rem; }
.hours div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.hours dt { font-weight: 300; }
.hours dd { margin: 0; font-weight: 500; }
.cat-head p a { color: var(--navy); text-decoration: underline; }
.flow { list-style: none; counter-reset: flow; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin: 0; padding: 0; }
.flow li { counter-increment: flow; position: relative; padding-top: 56px; font-size: .9rem; }
.flow li::before { content: counter(flow, decimal-leading-zero); position: absolute; top: 0; left: 0; font-size: 2rem; font-weight: 300; color: var(--sand-text); }
.flow b { display: block; margin-bottom: 6px; color: var(--ink); font-weight: 500; }
@media (max-width: 900px) { .contact { grid-template-columns: minmax(0, 1fr); } .flow { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .flow { grid-template-columns: 1fr; } }

/* ---------- Silniki Yamaha and Sklep (moved from prototype/motors.html, shop.html) ---------- */
.m-hero { background: var(--navy); color: rgba(255,255,255,.8); padding: 8px 0 40px; }
.m-hero .breadcrumbs, .m-hero .breadcrumbs a { color: rgba(255,255,255,.55); }
.m-hero h1 { color: #fff; font-size: clamp(2rem, 4vw, 3rem); margin: 6px 0 12px; }
.m-hero p { max-width: 64ch; }
.power { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 24px; }
.power button { min-height: 40px; padding: 0 16px; border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; cursor: pointer; font: inherit; font-size: .8rem; }
.power button[aria-pressed="true"] { background: var(--sand); border-color: var(--sand); }
.power small { opacity: .6; margin-left: 6px; }
html:not(.js) .power, html:not(.js) .fit, html:not(.js) .side, html:not(.js) .toolbar__right { display: none; }
.fit { margin-top: 24px; display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; padding: 18px 22px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.fit b { color: #fff; font-weight: 500; }
.fit p { margin: 0; font-size: .86rem; }
.fit .select { min-width: 240px; color: var(--ink); }
.fit--light { margin: 0; grid-template-columns: 1fr auto; background: var(--paper); border-color: var(--line); }
.fit--light b { color: var(--ink); }
.fit-note { margin: -8px 0 24px; font-size: .86rem; color: var(--muted); }
@media (max-width: 760px) { .fit, .fit--light { grid-template-columns: 1fr; } .fit .select { min-width: 0; } }
.checks { display: grid; gap: 10px; }
.checks label { display: flex; justify-content: space-between; gap: 10px; font-size: .86rem; font-weight: 300; cursor: pointer; }
.checks small { color: var(--muted); }
.checks input { accent-color: var(--navy); margin-right: 8px; }
.products { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 28px 20px; }
.product { display: flex; flex-direction: column; border: 1px solid var(--line); background: #fff; transition: border-color .2s, box-shadow .3s var(--ease); }
.product[hidden] { display: none; }
.product:hover, .product--best { border-color: var(--sand); box-shadow: 0 18px 40px -30px rgba(12,27,53,.5); }
.product--best .product__img::after { content: "Polecana"; position: absolute; top: 12px; right: 12px; padding: 3px 8px; background: var(--navy); color: #fff; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.product__img { position: relative; aspect-ratio: 1; display: grid; place-items: center; padding: 18px; background: var(--paper); overflow: hidden; }
/* Absolutely placed so a tall photo cannot stretch the square box. */
.product__img img { position: absolute; inset: 40px 18px 18px; width: calc(100% - 36px); height: calc(100% - 58px); object-fit: contain; mix-blend-mode: multiply; }
.product__img svg { width: 46%; color: var(--silver); }
.product__hp { position: absolute; top: 12px; left: 12px; font-size: 1.6rem; font-weight: 600; color: var(--navy); line-height: 1; }
.product__hp small { font-size: .7rem; font-weight: 500; letter-spacing: .1em; margin-left: 2px; }
.product__body { padding: 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.product__body h3 { margin: 0; font-size: 1.05rem; }
.product__chips { display: flex; gap: 4px; flex-wrap: wrap; }
.product__chips span { font-size: .66rem; letter-spacing: .06em; padding: 3px 7px; background: var(--paper); color: var(--muted); }
.product__specs { font-size: .76rem; color: var(--muted); }
.product__aka { font-size: .72rem; color: var(--muted); }
.product__badge { position: absolute; top: 12px; right: 12px; z-index: 1; padding: 3px 8px; background: var(--navy); color: #fff; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.product__badge--muted { background: var(--silver); color: var(--ink); }
.product__foot { margin-top: auto; padding-top: 12px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.product__foot .price-from { font-size: .66rem; }
.product__ask { min-height: 40px; padding: 0 14px; display: inline-flex; align-items: center; border: 1px solid var(--navy); font-size: .7rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
.product__ask:hover { background: var(--navy); color: #fff; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 24px; }
.chip { min-height: 38px; padding: 0 16px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #fff; font-size: .8rem; }
.chip small { color: var(--muted); }
.chip--motors { border-color: var(--navy); color: var(--navy); font-weight: 500; }
.benefits { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; font-size: .84rem; }
.benefits b { display: block; color: var(--ink); font-weight: 500; }
@media (max-width: 760px) { .benefits { grid-template-columns: 1fr 1fr; } }
#przyczepy .section__head { align-items: end; gap: 24px; flex-wrap: wrap; }

/* ---------- Dealerzy (public list) and Strefa dealera ---------- */
.dealers { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.dealer { padding: 24px; border: 1px solid var(--line); background: #fff; }
.dealer h3 { margin: 6px 0 10px; }
.dealer p { margin: 0 0 8px; font-size: .9rem; }
.dealer a { color: var(--navy); }
.dealer--main { background: var(--navy); color: rgba(255,255,255,.8); border-color: var(--navy); }
.dealer--main h3, .dealer--main a, .dealer--main .label { color: #fff; }
.zone-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.zone-head h2 { margin: 0; }
.zone-head small { color: var(--muted); font-weight: 400; }
.zone-table-wrap { overflow-x: auto; }
.zone-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.zone-table th { text-align: left; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 500; padding: 10px 12px; border-bottom: 1px solid var(--ink); }
.zone-table td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.zone-table a { color: var(--navy); }
.zone-expired, .zone-lock { font-size: .8rem; color: var(--warn); }
.zone-lock { color: var(--muted); }
.zone-login form p { display: grid; gap: 6px; margin: 0 0 12px; }
.zone-login input[type=text], .zone-login input[type=password] { width: 100%; min-height: 46px; padding: 10px 14px; border: 1px solid var(--line); }
.zone-login .login-remember label { display: flex; gap: 8px; align-items: center; font-size: .85rem; }
.zone-login input[type=submit] { min-height: 46px; padding: 0 22px; border: 0; background: var(--navy); color: #fff; font: inherit; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.grand-log { list-style: none; margin: 0; padding: 0; }
.grand-log li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .9rem; }
.grand-log small { color: var(--muted); }

/* ---------- Panel dystrybutora ---------- */
.panel-head { padding-bottom: 0; }
.panel-tabs { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 24px; }
.panel-tabs a { padding: 12px 18px; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; border-bottom: 2px solid transparent; color: var(--muted); }
.panel-tabs a[aria-current] { color: var(--navy); border-color: var(--navy); font-weight: 500; }
.panel-tabs a:hover { color: var(--navy); }
.panel-tabs__wp { margin-left: auto; }
.panel-body { padding-top: 36px; }
.panel-hint { color: var(--muted); font-size: .9rem; margin: 0 0 20px; }
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 40px; }
.kpi-tile { display: grid; gap: 6px; padding: 20px 22px; background: var(--navy); color: rgba(255,255,255,.75); }
.kpi-tile span { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; }
.kpi-tile b { font-size: 2.2rem; font-weight: 500; color: #fff; line-height: 1; }
.kpi-tile small { font-size: .8rem; }
a.kpi-tile:hover { background: var(--navy-2); }
.kpi-tile--sand { background: var(--sand); color: rgba(255,255,255,.85); }
.kpi-tile--alert { background: #8f2a22; }
.panel-cols { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 48px; }
.panel-cols h2, .panel h2 { font-size: 1.2rem; margin: 0 0 16px; }
@media (max-width: 900px) { .panel-cols { grid-template-columns: 1fr; } }
.stage-bars { display: grid; gap: 2px; }
.stage-bar { display: grid; grid-template-columns: 170px 1fr 36px 120px; gap: 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: .86rem; }
.stage-bar:hover { background: var(--paper); }
.stage-bar__track { height: 8px; background: var(--paper); }
.stage-bar__fill { display: block; height: 100%; min-width: 2px; background: var(--navy); }
.stage-bar__num { text-align: right; font-weight: 500; }
.stage-bar__val { text-align: right; color: var(--muted); white-space: nowrap; }
@media (max-width: 560px) { .stage-bar { grid-template-columns: 1fr 40px; } .stage-bar__track, .stage-bar__val { display: none; } }
.stage--zamowienie, .stage--produkcja { background: var(--sand) !important; }
.stage--wydanie { background: var(--ok) !important; }
.stage--przegrana { background: var(--silver) !important; }
.recent { list-style: none; margin: 0; padding: 0; }
.recent li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .88rem; }
.recent a { color: var(--ink); }
.recent small { display: block; color: var(--muted); }
.board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 12px; }
.board__col { background: var(--paper); padding: 12px; min-height: 240px; display: grid; align-content: start; gap: 8px; }
.board__col header { display: grid; gap: 2px; padding: 4px 4px 10px; border-bottom: 2px solid var(--navy); margin-bottom: 4px; }
.board__col header b { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 500; }
.board__col header span { font-size: .78rem; color: var(--muted); }
.board__card { display: grid; gap: 3px; padding: 12px; background: #fff; border-left: 3px solid var(--navy); font-size: .86rem; box-shadow: 0 6px 16px -14px rgba(12,27,53,.5); }
.board__card:hover { border-left-color: var(--sand); }
.board__card span { color: var(--muted); font-size: .8rem; }
.board__card.is-conflict { border-left-color: #b3261e; }
.board__card.is-expired { opacity: .7; }
.panel-filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 20px; }
.panel-filters .input { flex: 1 1 260px; min-height: 42px; }
.panel-filters .select { width: auto; min-height: 42px; }
.panel-count { margin-left: auto; color: var(--muted); font-size: .85rem; }
.panel-table th[data-sort] { cursor: pointer; user-select: none; white-space: nowrap; }
.panel-table th[data-sort]::after { content: "↕"; margin-left: 6px; opacity: .35; }
.panel-table th[aria-sort="ascending"]::after { content: "↑"; opacity: 1; }
.panel-table th[aria-sort="descending"]::after { content: "↓"; opacity: 1; }
.zone-table .num { text-align: right; white-space: nowrap; }
.stage-pill { display: inline-block; padding: 3px 9px; font-size: .74rem; background: var(--navy); color: #fff; white-space: nowrap; }
.tag-conflict { display: inline-block; padding: 1px 6px; background: #b3261e; color: #fff; font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; vertical-align: middle; }
.grand-log__internal { background: #fcf9e8; padding-left: 8px !important; }

/* ---------- Strefa armatora, zgłoszenia ---------- */
.owner-boats { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.owner-boat { padding: 24px; border: 1px solid var(--line); background: #fff; display: grid; gap: 12px; }
.owner-boat h2 { margin: 0; }
.warranty-rows { display: grid; gap: 12px; }
.warranty-rows div { display: grid; gap: 4px; font-size: .86rem; }
.w-bar { display: block; height: 6px; background: var(--paper); }
.w-bar span { display: block; height: 100%; background: var(--ok); }
.ticket-card { border: 1px solid var(--line); background: #fff; padding: clamp(18px, 3vw, 32px); display: grid; gap: 20px; }
.ticket-card__head { display: flex; justify-content: space-between; gap: 16px; align-items: start; flex-wrap: wrap; }
.ticket-card__head h2 { margin: 4px 0; }
.ticket-card__head p { margin: 0; color: var(--muted); font-size: .88rem; }
.ticket-status { display: inline-block; padding: 4px 10px; font-size: .74rem; letter-spacing: .06em; background: var(--navy); color: #fff; white-space: nowrap; }
.ticket-status--0 { background: #b5642a; }
.ticket-status--3 { background: var(--ok); }
.ticket-status--4 { background: var(--silver); color: var(--ink); }
.ticket-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; font-size: .72rem; color: var(--muted); }
.ticket-steps li { padding-top: 8px; border-top: 4px solid var(--line); }
.ticket-steps li.is-done { border-color: var(--navy); color: var(--ink); }
.ticket-files { display: flex; gap: 8px; flex-wrap: wrap; }
.ticket-files a { width: 96px; height: 96px; display: grid; place-items: center; background: var(--paper); overflow: hidden; }
.ticket-files img { width: 100%; height: 100%; object-fit: cover; }
.ticket-msgs { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ticket-msg { padding: 12px 16px; background: var(--paper); max-width: 80ch; }
.ticket-msg p { margin: 4px 0 0; font-size: .92rem; }
.ticket-msg small { color: var(--muted); }
.ticket-msg--serwis { background: #eef1f6; justify-self: end; }
.ticket-msg.is-internal { background: #fcf9e8; }

/* ---------- Karta łodzi klienta: wyposażenie i dokumenty ---------- */
.owner-hull { margin-top: 40px; }
.hull-card { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 32px; padding: clamp(18px, 3vw, 32px); border: 1px solid var(--line); background: #fff; }
.hull-card h3 { margin: 0 0 14px; font-size: 1rem; }
.hull-card .eq-list { margin-bottom: 18px; }
.doc-group { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .88rem; }
.doc-group ul { list-style: none; margin: 6px 0 0; padding: 0; }
.doc-group a { color: var(--navy); text-decoration: underline; word-break: break-all; }
.doc-group small { color: var(--muted); margin-left: 6px; }
.hull-form { margin-top: 16px; padding: clamp(18px, 3vw, 32px); background: var(--paper); }
.hull-form h3 { margin: 0; font-size: 1rem; }
@media (max-width: 860px) { .hull-card { grid-template-columns: 1fr; } }

/* ---------- Koszty i Części (strefa armatora) ---------- */
.hull-extras { margin-top: 48px; }
.costs { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 32px; align-items: start; }
.costs__sum { display: grid; gap: 16px; }
.cost-form { margin-top: 20px; padding: 20px; background: var(--paper); }
/* Receipts and invoices attached to a cost / service entry */
.cost-actions { white-space: nowrap; }
.cost-actions form { display: inline; }
.cost-actions .link-btn { vertical-align: middle; padding: 4px 6px; }
.cost-actions [aria-expanded="true"] { color: var(--navy); background: var(--paper); }
.cost-edit-row > td { padding: 0 0 16px !important; border-bottom: 1px solid var(--line); }
.cost-form--edit { margin-top: 0; border-left: 2px solid var(--navy); animation: pd-drop .3s var(--ease); }
.cost-form__actions { display: flex; flex-wrap: wrap; gap: 10px; }
@keyframes pd-drop { from { opacity: 0; transform: translateY(-6px); } }
.cost-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.cost-file { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border: 1px solid var(--line); background: #fff; font-size: .74rem; color: var(--navy); text-decoration: none; transition: border-color .2s; }
.cost-file:hover { border-color: var(--navy); }
.cost-file--img { padding: 0; width: 44px; height: 44px; overflow: hidden; }
.cost-file--img img { width: 100%; height: 100%; object-fit: cover; }
.tag-ok { color: var(--ok); }
.link-btn { border: 0; background: none; color: var(--muted); font-size: 1.1rem; cursor: pointer; }
.link-btn:hover { color: #b3261e; }
.parts { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.part { display: grid; gap: 8px; align-content: space-between; padding: 16px; border: 1px solid var(--line); background: #fff; font-size: .88rem; }
.part__foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
@media (max-width: 900px) { .costs { grid-template-columns: minmax(0, 1fr); } }

/* Motor cards: brand emblem instead of the brand name as text */
.product__brand { display: flex; align-items: center; gap: 10px; }
.product__brand h3 { margin: 0; }
.brand-logo { width: 30px; height: 30px; flex: none; object-fit: contain; }

/* Boat card: picture, owner's gallery (publish consent / approval), change of owner */
.hull-card__img { display: block; width: 100%; max-height: 320px; object-fit: contain; background: var(--paper); margin: 0 0 18px; }
.hull-gallery { margin: 28px 0 8px; display: grid; gap: 14px; }
.hull-gallery h3 { margin: 0; }
.hull-gallery__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
.hull-gallery__item { margin: 0; border: 1px solid var(--line); background: #fff; }
.hull-gallery__item.is-public { border-color: var(--sand, #a49889); box-shadow: inset 0 0 0 1px var(--sand, #a49889); }
.hull-gallery__item img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.hull-gallery__item figcaption { padding: 8px 10px; display: grid; gap: 4px; font-size: .78rem; }
.hull-gallery__item small { color: var(--muted); }
.hull-transfer { margin: 18px 0; padding: 14px 18px; border: 1px dashed var(--line); }
.hull-transfer summary { cursor: pointer; font-weight: 500; }
.hull-transfer[open] summary { margin-bottom: 12px; }
/* Model page: owners' photos */
.owners-gallery__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.owners-gallery__grid a { display: block; overflow: hidden; }
.owners-gallery__grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .4s; }
.owners-gallery__grid a:hover img { transform: scale(1.04); }
.owners-gallery__grid button { display: block; padding: 0; border: 0; background: none; cursor: zoom-in; overflow: hidden; }
.owners-gallery__grid button:hover img { transform: scale(1.04); }

/* Orders and promo codes (dealer zone, distributor panel) */
.order-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.order-form .select--sm, .select--sm { height: 36px; padding: 0 30px 0 10px; font-size: .8rem; min-width: 170px; }
.order-form .btn { padding: 0 14px; min-height: 36px; font-size: .72rem; }
.order-form__notify { font-size: .74rem; }
.zone-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: -16px 0 40px; }
.zone-table tr.is-off td { opacity: .5; }
.zone-code-actions { display: flex; gap: 6px; }
.zone-code-actions .btn { padding: 0 12px; min-height: 32px; font-size: .7rem; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { padding: 6px 12px; border: 1px solid var(--line); font-size: .78rem; text-decoration: none; color: var(--ink); background: #fff; }
.chip.is-on { background: var(--navy); color: #fff; border-color: var(--navy); }

/* Motors: power boxes in columns (as on grand.ua), motor page */
.checks--grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px 10px; }
.checks--grid label { font-size: .8rem; }
.product__brand h3 a { color: inherit; text-decoration: none; }
.product__brand h3 a:hover { text-decoration: underline; }
.motor-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; margin-top: 18px; }
.motor-top__img { background: var(--paper); aspect-ratio: 1; display: grid; place-items: center; padding: 24px; }
.motor-top__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.motor-top__noimg .brand-logo--xl { width: 120px; height: 120px; }
.motor-top__info { display: grid; gap: 14px; }
.motor-top__info h1 { margin: 0; }
.motor-top__price .price { display: block; font-size: 2rem; }
.motor-top__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.motor-specs { width: 100%; max-width: 900px; border-collapse: collapse; background: #fff; }
.motor-specs th, .motor-specs td { text-align: left; padding: 11px 16px; border-bottom: 1px solid var(--line); font-size: .9rem; vertical-align: top; }
.motor-specs th { width: 42%; font-weight: 500; color: var(--muted); }
@media (max-width: 860px) { .motor-top { grid-template-columns: 1fr; } }

/* Motors filter: folding groups, power chips, the sidebar scrolls on its own so all of it can be seen */
.side .fgroup { border-bottom: 1px solid var(--line); }
.side .fgroup summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 12px 0; font-size: .72rem; letter-spacing: var(--track); text-transform: uppercase; font-weight: 500; }
.side .fgroup summary::-webkit-details-marker { display: none; }
.side .fgroup summary::after { content: ""; margin-left: auto; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
.side .fgroup[open] summary::after { transform: rotate(-135deg) translateY(-2px); }
.side .fgroup output { min-width: 20px; height: 20px; padding: 0 6px; display: inline-grid; place-items: center; border-radius: 10px; background: var(--navy); color: #fff; font-size: .68rem; letter-spacing: 0; }
.side .fgroup > .checks, .side .fgroup > .chip-checks { padding: 2px 0 16px; }
.chip-checks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.chip-checks label { position: relative; cursor: pointer; }
.chip-checks input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-checks span { display: block; padding: 7px 0; text-align: center; font-size: .78rem; border: 1px solid var(--line); background: #fff; transition: background .15s, color .15s, border-color .15s; }
.chip-checks label:hover span { border-color: var(--ink); }
.chip-checks input:checked + span { background: var(--navy); border-color: var(--navy); color: #fff; }
.chip-checks input:focus-visible + span { outline: 2px solid var(--sand); outline-offset: 2px; }
@media (min-width: 981px) {
  [data-motors] .side { gap: 0; max-height: calc(100vh - var(--header-h) - 40px); overflow-y: auto; padding-right: 10px; scrollbar-width: thin; }
  [data-motors] .side > div:first-child { margin-bottom: 8px; }
  [data-motors] .side [data-reset] { margin-top: 18px; }
}
/* The whole motor card opens the motor page; "Zapytaj" stays its own link. */
[data-motors] .product { position: relative; }
[data-motors] .product__brand h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
[data-motors] .product__ask { position: relative; z-index: 2; }
[data-motors] .product:hover { border-color: var(--ink); }

/* Motor page text and the buying guide on /silniki/ */
.motor-story { max-width: 860px; }
.motor-story h2 { margin: 8px 0 18px; }
.motor-story p { font-size: 1rem; line-height: 1.75; font-weight: 300; margin: 0 0 14px; }
.motors-guide h2 { margin: 8px 0 28px; }
.motors-guide__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); }
.motors-guide h3 { font-size: 1.05rem; margin: 22px 0 8px; }
.motors-guide h3:first-child { margin-top: 0; }
.motors-guide p { font-weight: 300; line-height: 1.7; margin: 0; }
.motors-guide__cols { margin-top: 12px; }
.motors-guide__cols th { width: 48px; color: var(--ink); font-weight: 600; }
@media (max-width: 860px) { .motors-guide__grid { grid-template-columns: 1fr; } }

/* Owner zone in tabs (page-templates/owner-zone.php, assets/js/owner.js) — as prototype/konto.html. */
.acc-head__row { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.acc-head__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.acc-boats { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 24px; }
.acc-boats a { padding: 8px 14px; border: 1px solid var(--line); font-size: .82rem; color: var(--ink); background: #fff; }
.acc-boats a[aria-current="true"] { border-color: var(--navy); background: var(--navy); color: #fff; }
.acc-boats small { opacity: .7; margin-left: 4px; }
.acc-tabs { display: flex; gap: 28px; margin-top: 28px; overflow-x: auto; scrollbar-width: none; scroll-margin-top: calc(var(--header-h) + 8px); }
.acc-tabs::-webkit-scrollbar { display: none; }
.acc-tabs button { border: 0; background: none; padding: 14px 0; border-bottom: 2px solid transparent; cursor: pointer; font: inherit; font-size: .76rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.acc-tabs button[aria-selected="true"] { color: var(--ink); border-color: var(--navy); }
.acc .count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--sand); color: #fff; font-size: .62rem; margin-left: 4px; letter-spacing: 0; }
.acc-body { padding-top: 40px; }
.acc-h { font-size: 1.25rem; margin: 0 0 20px; }
.acc-h:not(:first-child) { margin-top: 48px; }
.dash { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 24px; }
@media (max-width: 960px) { .dash { grid-template-columns: 1fr; } }
.card { border: 1px solid var(--line); background: #fff; padding: 24px; }
.card--wide { grid-column: 1 / -1; }
.card h3 { margin: 0 0 16px; font-size: 1.05rem; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.card h3 a { font-size: .7rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); }
.card .big { font-size: 2rem; font-weight: 500; color: var(--ink); }
.boat-card { display: grid; grid-template-columns: minmax(120px, 200px) minmax(0, 1fr); gap: 24px; align-items: start; }
.boat-card img { width: 100%; max-height: 260px; object-fit: contain; }
.boat-card h2 { margin: 6px 0 14px; }
@media (max-width: 560px) { .boat-card { grid-template-columns: 1fr; } }
.kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 0; font-size: .88rem; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; color: var(--ink); }
.next { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); font-size: .86rem; color: var(--muted); }
.next b { display: block; color: var(--ink); font-weight: 500; margin-bottom: 2px; }
.warranty { display: grid; gap: 18px; }
.w-row { display: grid; gap: 6px; margin-bottom: 14px; }
.w-row__top { display: flex; justify-content: space-between; gap: 12px; font-size: .88rem; }
.w-row small { color: var(--muted); font-size: .78rem; }
.w-bar.is-soon span { background: var(--sand); }
.w-bar.is-over span { background: var(--line); }
.acc-docs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.acc-docs > * { display: grid; gap: 4px; padding: 16px 18px; background: #fff; }
.acc-docs b { font-weight: 500; color: var(--ink); }
.acc-docs span { font-size: .8rem; color: var(--muted); word-break: break-all; }
.acc-docs a:hover b { color: var(--navy); text-decoration: underline; }
.acc .hull-form { margin-top: 32px; }
.hull-card--single { grid-template-columns: 1fr; }
.costs--single { grid-template-columns: minmax(0, 1fr); }
.costs__h { font-size: .95rem; margin: 28px 0 12px; }

.hours-form { display: flex; justify-content: space-between; align-items: center; gap: 12px 20px; flex-wrap: wrap; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.hours-form label { display: grid; gap: 2px; font-size: .86rem; color: var(--ink); }
.hours-form label b { font-weight: 500; }
.hours-form label small { color: var(--muted); font-size: .76rem; }
.hours-form__row { display: flex; align-items: center; gap: 8px; }
.hours-form__row .input { width: 110px; }
.hours-form__row span { font-size: .82rem; color: var(--muted); }

/* Dealer zone: materials */
.dealer-materials .acc-docs { margin-top: 20px; }
.dealer-materials .acc-docs .label { font-size: .62rem; }
.dealer-materials__h { font-size: 1.05rem; margin: 40px 0 14px; }
.dealer-materials td a { color: var(--navy); text-decoration: underline; }

/* Blog "Aktualności" (home.php, archive.php, single.php) */
.posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 28px; }
.post-card { display: flex; flex-direction: column; border: 1px solid var(--line); background: #fff; }
.post-card__img { display: block; aspect-ratio: 16 / 9; background: var(--paper); overflow: hidden; }
.post-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.post-card:hover .post-card__img img { transform: scale(1.04); }
.post-card__body { padding: 20px 22px 24px; display: grid; gap: 8px; }
.post-card time, .post__meta { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.post-card h2 { font-size: 1.05rem; line-height: 1.4; margin: 0; }
.post-card h2 a:hover { color: var(--navy); text-decoration: underline; }
.post-card p { font-size: .88rem; margin: 0; color: var(--muted); }
.post__wrap { max-width: 900px; }
.post .label a { color: inherit; }
.post__hero { margin: 32px 0; }
.post__hero img { width: 100%; height: auto; }
.post__content { padding-bottom: 64px; font-size: 1rem; line-height: 1.8; }
.post__content img { max-width: 100%; height: auto; margin: 16px 0; }
.post__content h1 { font-size: 1.6rem; }
.post__content h2 { font-size: 1.35rem; margin-top: 40px; }
.post__tags { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 64px; }
.post__tags a { padding: 6px 12px; border: 1px solid var(--line); font-size: .78rem; }
.press-list { list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 20px; }
.press-list a { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--line); background: #fff; }
.press-list img { width: 100%; height: auto; aspect-ratio: 400 / 535; object-fit: cover; }
.press-list span { font-size: .78rem; color: var(--muted); }
/* Image carousels of the old site's posts (Shortcodes Ultimate markup, without its script): a photo grid. */
.post__content .su-image-carousel-slides, .post__content .su-image-carousel { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; margin: 24px 0; }
.post__content .su-image-carousel-item { margin: 0; }
.post__content .su-image-carousel img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; margin: 0; background: var(--paper); }
.post__content .su-image-carousel-item a { display: block; }

/* ---------- Owner's gallery: swipeable strip + full-screen viewer (assets/js/gallery.js) ---------- */
.hg { display: grid; gap: 14px; min-width: 0; }
.hg__track { display: grid; grid-auto-flow: column; grid-auto-columns: min(85%, 420px); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; padding-bottom: 4px; scrollbar-width: none; }
.hg__track::-webkit-scrollbar { display: none; }
.hg__track:focus-visible { outline: 2px solid var(--sand); outline-offset: 4px; }
.hg__slide { margin: 0; scroll-snap-align: start; display: grid; grid-template-rows: auto auto; background: #fff; border: 1px solid var(--line); transition: border-color .3s; }
.hg__slide.is-public { border-color: var(--sand); }
.hg__open { position: relative; display: block; padding: 0; border: 0; background: var(--paper); cursor: zoom-in; overflow: hidden; }
.hg__open img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .7s var(--ease); }
.hg__open:hover img, .hg__open:focus-visible img { transform: scale(1.04); }
.hg__badge { position: absolute; left: 10px; top: 10px; padding: 5px 9px; background: rgba(12,27,53,.82); color: #fff; font-size: .66rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; backdrop-filter: blur(4px); }
.is-public .hg__badge { background: var(--sand); }
.hg__zoom { position: absolute; right: 10px; bottom: 10px; width: 34px; height: 34px; display: grid; place-items: center; background: rgba(255,255,255,.9); color: var(--navy); opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s var(--ease); }
.hg__open:hover .hg__zoom, .hg__open:focus-visible .hg__zoom { opacity: 1; transform: none; }
@media (hover: none) { .hg__zoom { opacity: 1; transform: none; } }
.hg__slide figcaption { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 10px 12px; font-size: .8rem; }
.hg__bar { display: flex; align-items: center; gap: 14px; }
.hg__arrow { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); background: #fff; color: var(--navy); cursor: pointer; transition: background .2s, color .2s, opacity .2s; }
.hg__arrow:hover:not(:disabled) { background: var(--navy); color: #fff; border-color: var(--navy); }
.hg__arrow:disabled { opacity: .35; cursor: default; }
.hg__progress { flex: 1; height: 2px; background: var(--line); position: relative; overflow: hidden; }
.hg__progress span { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--navy); transition: width .25s var(--ease), left .25s var(--ease); }
.hg__count { font-size: .76rem; letter-spacing: .1em; color: var(--muted); font-variant-numeric: tabular-nums; min-width: 4.5em; text-align: right; }

/* Viewer: the site's .lightbox look, plus swipe and a sliding image */
.lightbox--hg .lightbox__stage { position: relative; overflow: hidden; touch-action: pan-y; }
.lightbox--hg .lightbox__stage img { transition: transform .35s var(--ease), opacity .35s; user-select: none; -webkit-user-drag: none; }
.lightbox--hg .lightbox__stage img.is-out-l { transform: translateX(-40px); opacity: 0; }
.lightbox--hg .lightbox__stage img.is-out-r { transform: translateX(40px); opacity: 0; }
.lightbox--hg .lightbox__thumbs { justify-content: safe center; }
@media (max-width: 640px) { .lightbox--hg .lightbox__stage { padding: 0 8px; } .lightbox--hg .lightbox__nav { display: none; } .lightbox--hg .lightbox__stage img { max-height: 70vh; } }
@media (prefers-reduced-motion: reduce) { .hg__track { scroll-behavior: auto; } .hg__open img, .lightbox--hg .lightbox__stage img { transition: none; } }

/* Motor card: throttle and shift, steering, Helm Master EX (wp-admin "Sterowanie i układ kierowniczy") */
.product__steer { display: grid; gap: 2px; margin: 4px 0 2px; padding: 8px 10px 8px 12px; border-left: 3px solid var(--line); background: var(--paper); line-height: 1.25; }
.product__steer b { font-size: .78rem; font-weight: 600; color: var(--ink); }
.product__steer small { font-size: .72rem; color: var(--muted); }
.product__steer em { font-style: normal; font-size: .68rem; font-weight: 500; letter-spacing: .06em; color: var(--sand-text); }
.product__steer--lodz { border-left-color: #9aa3ae; }
.product__steer--hyd { border-left-color: var(--sand); }
.product__steer--ehyd, .product__steer--des { border-left-color: var(--navy); background: var(--navy); }
.product__steer--ehyd b, .product__steer--des b { color: #fff; }
.product__steer--ehyd small, .product__steer--des small { color: rgba(255,255,255,.75); }
.product__steer--ehyd em, .product__steer--des em { color: var(--sand-2); }
.product__steer--rumpel { border-left-color: var(--silver); }

/* Motors filter: the kinds of remote steering nested under "Zdalne" (as on grand.ua) */
.checks--nested { margin: 2px 0 4px 26px; padding-left: 10px; border-left: 1px solid var(--line); }