
.bp-page {
    --bp-bg: #0a0d10;
    --bp-panel: rgba(16, 19, 24, 0.88);
    --bp-panel-2: rgba(22, 26, 33, 0.96);
    --bp-stroke: rgba(255, 255, 255, 0.09);
    --bp-text: #f2f5f7;
    --bp-muted: #a9b4be;
    --bp-green: #54b14f;
    --bp-green-2: #67cb61;
    --bp-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
    background:
        radial-gradient(circle at top left, rgba(84, 177, 79, 0.18), transparent 24%),
        radial-gradient(circle at top right, rgba(84, 177, 79, 0.08), transparent 22%),
        linear-gradient(180deg, #06080a 0%, #0d1116 100%);
    color: var(--bp-text);
    padding: 48px 0 88px;
}
.bp-page * { box-sizing: border-box; }
.bp-shell { width: min(1280px, calc(100% - 32px)); margin: 0 auto; }
.bp-kicker {
    display:inline-flex; align-items:center; gap:10px; padding:8px 14px; border-radius:999px;
    border:1px solid rgba(103,203,97,0.28); background:rgba(84,177,79,0.08); color:#d7ffd4;
    font-size:12px; line-height:1; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
}
.bp-btn {
    display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px;
    border-radius:999px; border:1px solid transparent; text-decoration:none; font-weight:700;
    transition:transform .2s ease, background .2s ease, border-color .2s ease; cursor:pointer;
}
.bp-btn:hover { transform:translateY(-2px); }
.bp-btn--primary { background:linear-gradient(135deg,var(--bp-green),var(--bp-green-2)); color:#061208; }
.bp-btn--ghost { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.12); color:var(--bp-text); }
.bp-btn--inquiry { background:linear-gradient(135deg,var(--bp-green),var(--bp-green-2)); border-color:transparent; color:#061208; box-shadow:0 14px 28px rgba(84,177,79,.22); }
.bp-btn--inquiry:hover { box-shadow:0 18px 34px rgba(84,177,79,.28); }
.bp-section { margin-top: 28px; }
.bp-section-head { display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:18px; }
.bp-section-head h2 { margin:14px 0 0; font-size:clamp(28px,3.3vw,44px); line-height:1.08; letter-spacing:-.03em; }
.bp-section-head--recommender { margin-bottom: 20px; }
.bp-hero {
    position:relative; min-height:690px; border-radius:32px; border:1px solid var(--bp-stroke);
    overflow:hidden; background:var(--bp-panel); box-shadow:var(--bp-shadow);
    display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,430px); margin-bottom:28px;
}
.bp-hero__media, .bp-hero__veil { position:absolute; inset:0; }
.bp-hero__media { background-size:cover; background-position:center; transform:scale(1.03); }
.bp-hero__veil { background:linear-gradient(90deg,rgba(6,8,10,.93) 0%,rgba(6,8,10,.80) 36%,rgba(6,8,10,.45) 100%), linear-gradient(180deg,rgba(12,16,20,.12),rgba(12,16,20,.8)); }
.bp-hero__content, .bp-hero__stack { position:relative; z-index:2; }
.bp-hero__content { padding:64px clamp(26px,4vw,54px); display:flex; flex-direction:column; justify-content:center; max-width:760px; }
.bp-hero h1 { margin:18px 0 14px; font-size:clamp(40px,6vw,78px); line-height:.94; letter-spacing:-.04em; }
.bp-lead { margin:0 0 16px; font-size:clamp(18px,2vw,24px); color:#eaf8ea; max-width:650px; }
.bp-copy { margin:0; max-width:650px; font-size:16px; line-height:1.75; color:var(--bp-muted); }
.bp-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.bp-points { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.bp-points span { display:inline-flex; align-items:center; padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); color:#d7dee4; font-size:13px; }
.bp-hero__stack { display:flex; align-items:flex-end; justify-content:flex-end; padding:36px 30px 28px 0; position:relative; }
.bp-hero__device { border-radius:28px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); box-shadow:0 30px 60px rgba(0,0,0,.26); backdrop-filter:blur(14px); overflow:hidden; }
.bp-hero__device img { display:block; width:100%; height:auto; object-fit:contain; }
.bp-hero__device--small { position:absolute; left:36px; bottom:34px; max-width:260px; transform:rotate(-10deg); }
.bp-hero__device--large { max-width:400px; margin-left:auto; transform:rotate(4deg); }
.bp-highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.bp-highlight-card, .bp-form-card, .bp-result-card, .bp-system-card, .bp-download-card, .bp-monitoring {
    border-radius:28px; border:1px solid var(--bp-stroke); background:var(--bp-panel-2); box-shadow:var(--bp-shadow);
}
.bp-highlight-card { padding:24px; }
.bp-highlight-card strong { display:block; margin-bottom:10px; font-size:18px; }
.bp-highlight-card p { margin:0; color:var(--bp-muted); line-height:1.7; }
.bp-recommender__grid { display:grid; grid-template-columns:1fr; gap:20px; }
.bp-form-card, .bp-result-card { width:100%; padding:26px; }
.bp-step-group + .bp-step-group { margin-top:22px; }
.bp-label { display:block; margin-bottom:10px; font-size:13px; color:#dce4ea; text-transform:uppercase; letter-spacing:.12em; font-weight:700; }
.bp-boat-grid { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:14px; align-items:stretch; }
.bp-boat-card, .bp-chip, .bp-filter {
    cursor:pointer; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03); color:var(--bp-text);
    transition:border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.bp-boat-card:hover, .bp-chip:hover, .bp-filter:hover { transform:translateY(-2px); }
.bp-boat-card { padding:18px 14px; border-radius:22px; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:184px; }
.bp-boat-card img {
    display:block; width:min(160px,100%); height:100px; object-fit:contain; border-radius:18px; margin:0 auto;
    background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
}
.bp-boat-card span { display:block; margin-top:12px; font-weight:700; font-size:18px; line-height:1.2; }
.is-active.bp-boat-card, .is-active.bp-chip, .is-active.bp-filter {
    border-color:rgba(103,203,97,.6); background:rgba(84,177,79,.12); box-shadow:0 16px 34px rgba(84,177,79,.16);
}
.bp-chip-grid, .bp-filter-row { display:flex; flex-wrap:wrap; gap:10px; }
.bp-chip, .bp-filter { min-height:46px; padding:0 16px; border-radius:999px; font-weight:700; }
.bp-range-card { padding:18px 18px 14px; border-radius:22px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); }
.bp-range-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.bp-range-head strong { font-size:28px; letter-spacing:-.03em; }
.bp-range-card input[type='range'] { width:100%; accent-color:var(--bp-green); }
.bp-range-scale { display:flex; justify-content:space-between; margin-top:8px; font-size:12px; color:var(--bp-muted); }
.bp-range-note { margin-top:10px; font-size:12px; line-height:1.5; color:var(--bp-muted); }
.bp-form-actions { margin-top:22px; display:flex; justify-content:flex-start; }
.bp-result-card { display:grid; grid-template-columns:minmax(320px,430px) minmax(0,1fr); gap:26px; align-items:center; }
.bp-result-card[hidden] { display:none !important; }
.bp-result-card__media { min-width:0; }
.bp-result-card__body { min-width:0; }
.bp-result-label { display:inline-block; margin-bottom:10px; font-size:12px; text-transform:uppercase; letter-spacing:.14em; color:#c7d0d6; }
.bp-result-card__body h3 { margin:0; font-size:clamp(34px,4vw,52px); letter-spacing:-.04em; overflow-wrap:anywhere; }
.bp-result-series { margin:8px 0 12px; color:#d4f7d0; font-weight:700; }
.bp-result-summary { margin:0 0 18px; color:var(--bp-muted); line-height:1.75; }
.bp-result-specs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; }
.bp-result-specs div { padding:14px; border-radius:18px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06); }
.bp-result-specs dt { font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--bp-muted); margin-bottom:8px; }
.bp-result-specs dd { margin:0; font-weight:700; line-height:1.55; overflow-wrap:anywhere; }

.bp-slider { position:relative; overflow:hidden; border-radius:24px; background:linear-gradient(180deg, rgba(44,57,82,.20), rgba(10,14,22,.96) 68%); border:1px solid rgba(255,255,255,.06); }
.bp-slider__track { display:flex; transition:transform .35s ease; }
.bp-slider__slide { min-width:100%; display:flex; align-items:center; justify-content:center; aspect-ratio: 16 / 10; }
.bp-slider__slide img { display:block; width:100%; height:100%; object-fit:contain; padding:18px; background:#f5f6f7; }
.bp-slider__nav { position:absolute; inset:0; display:flex; align-items:center; justify-content:space-between; padding:0 10px; pointer-events:none; }
.bp-slider__btn {
    pointer-events:auto; width:38px; height:38px; border-radius:999px; border:1px solid rgba(255,255,255,.14);
    background:rgba(7,10,16,.62); color:#fff; display:grid; place-items:center; cursor:pointer; backdrop-filter:blur(8px);
}
.bp-slider__dots { position:absolute; left:0; right:0; bottom:12px; display:flex; justify-content:center; gap:8px; }
.bp-slider__dot { width:8px; height:8px; border-radius:999px; background:rgba(255,255,255,.42); border:0; padding:0; cursor:pointer; }
.bp-slider__dot.is-active { width:22px; background:var(--bp-green); }
.bp-slider--product .bp-slider__slide { min-height:250px; }
.bp-slider--product .bp-slider__slide img { background:linear-gradient(180deg, rgba(250,252,255,.98), rgba(232,236,242,.94)); }
.bp-slider--result .bp-slider__slide { min-height:330px; }
.bp-slider--result .bp-slider__slide img { background:linear-gradient(180deg, rgba(250,252,255,.98), rgba(232,236,242,.94)); }
.bp-filter-row { margin-bottom:18px; }
.bp-systems-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.bp-system-card { overflow:hidden; }
.bp-system-card__body { padding:22px; }
.bp-system-card__series { display:inline-block; margin-bottom:10px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#b7c3cb; }
.bp-system-card h3 { margin:0; font-size:30px; letter-spacing:-.03em; }
.bp-system-card__specs { list-style:none; padding:0; margin:18px 0 16px; display:grid; gap:10px; }
.bp-system-card__specs li { display:flex; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.07); }
.bp-system-card__specs strong { color:#e9eef2; font-size:13px; }
.bp-system-card__specs span, .bp-system-card__fit, .bp-system-card__use { color:var(--bp-muted); }
.bp-system-card__fit, .bp-system-card__use { margin:0; line-height:1.7; }
.bp-system-card__use { margin-top:10px; }
.bp-monitoring { display:grid; grid-template-columns:minmax(0,.92fr) minmax(320px,.88fr); overflow:hidden; }
.bp-monitoring__copy { padding:32px; }
.bp-monitoring__copy h2 { margin:16px 0 14px; font-size:clamp(28px,4vw,42px); line-height:1.05; }
.bp-monitoring__copy p, .bp-monitoring__copy li { color:var(--bp-muted); line-height:1.8; }
.bp-monitoring__copy ul { margin:18px 0 0; padding-left:20px; }
.bp-monitoring__media { min-height:100%; background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)); }
.bp-monitoring__media img { display:block; width:100%; height:100%; object-fit:cover; }
.bp-download-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.bp-download-card { display:flex; flex-direction:column; gap:8px; min-height:160px; padding:24px; text-decoration:none; }
.bp-download-card strong { font-size:22px; line-height:1.15; }
.bp-download-card span { color:var(--bp-muted); line-height:1.7; }
.bp-benefit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.bp-benefit-card { border-radius:28px; border:1px solid var(--bp-stroke); background:var(--bp-panel-2); box-shadow:var(--bp-shadow); padding:24px; }
.bp-benefit-card strong { display:block; margin-bottom:10px; font-size:20px; line-height:1.2; }
.bp-benefit-card p { margin:0; color:var(--bp-muted); line-height:1.75; }
.bp-inquiry__grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:20px; align-items:start; }
.bp-inquiry__points { display:grid; gap:12px; }
.bp-inquiry__points span { display:flex; align-items:center; min-height:58px; padding:14px 16px; border-radius:18px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); color:#dfe7ec; font-weight:700; }
.bp-gallery, .bp-gallery-grid, .bp-gallery-card, [data-bps-gallery] { display:none !important; }
@media (max-width: 1100px) {
    .bp-hero { grid-template-columns:1fr; }
    .bp-hero__stack { min-height:360px; padding:0 24px 24px; }
    .bp-hero__device--small { left:22px; }
    .bp-systems-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .bp-shell { width:min(100%, calc(100% - 20px)); }
    .bp-highlights, .bp-boat-grid, .bp-systems-grid, .bp-download-grid, .bp-monitoring, .bp-result-card, .bp-section-head { grid-template-columns:1fr; }
    .bp-section-head { align-items:start; }
    .bp-result-specs { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
    .bp-page { padding-top:24px; }
    .bp-hero__content, .bp-form-card, .bp-result-card, .bp-system-card__body, .bp-highlight-card, .bp-monitoring__copy, .bp-download-card { padding:20px; }
    .bp-hero__stack { min-height:280px; padding:0 18px 18px; }
    .bp-hero__device--small { left:14px; max-width:180px; bottom:20px; }
    .bp-hero__device--large { max-width:300px; }
    .bp-boat-grid { grid-template-columns:1fr; }
    .bp-boat-card img { height:120px; }
    .bp-slider--result .bp-slider__slide { min-height:260px; }
}


.bp-result-actions {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:18px;
}
.bp-system-card__actions {
    margin-top:18px;
}
.bp-btn--card {
    min-height:42px;
    padding:0 16px;
    font-size:14px;
}
.bp-inquiry__card {
    border-radius:28px;
    border:1px solid var(--bp-stroke);
    background:linear-gradient(135deg, rgba(84,177,79,.10), rgba(16,19,24,.94));
    box-shadow:var(--bp-shadow);
    padding:32px;
}
.bp-inquiry__card h2 {
    margin:16px 0 12px;
    font-size:clamp(28px,4vw,42px);
    line-height:1.08;
}
.bp-inquiry__card p {
    margin:0;
    max-width:860px;
    color:var(--bp-muted);
    line-height:1.8;
}
.bp-download-card strong {
    font-size:20px;
}
.bp-download-card {
    min-height:150px;
}
@media (max-width: 1100px) {
    .bp-highlights { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .bp-benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .bp-inquiry__grid { grid-template-columns:1fr; }
}
@media (max-width: 900px) {
    .bp-highlights, .bp-systems-grid, .bp-download-grid, .bp-monitoring, .bp-benefit-grid { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
    .bp-boat-grid { grid-template-columns:1fr !important; }
    .bp-boat-card { min-height:unset; }
}
