@charset "UTF-8";

/*
 * Visual redesign based on the supplied reference LPs.
 * Existing layout rules remain as a fallback; this file owns the final skin.
 */

:root {
    --lp-content-max: 1120px;
    --r-ink: #092f54;
    --r-navy: #073c72;
    --r-navy-deep: #042a52;
    --r-blue: #0878c9;
    --r-sky: #dff4ff;
    --r-sky-2: #f1faff;
    --r-yellow: #ffe100;
    --r-orange: #ff7900;
    --r-red: #e72d2d;
    --r-green: #22aa58;
    --r-cream: #fffbea;
    --r-line: #b9d9ef;
    --r-shadow: 0 8px 20px rgba(4, 42, 82, .08);
    --r-shadow-sm: 0 3px 10px rgba(4, 42, 82, .07);
}

body {
    color: var(--r-ink);
    background: #fff;
    overflow-x: clip;
}

.l-inner {
    width: min(1080px, calc(100% - 48px));
}

/* Reviews use the same PC content measure as the campaign and newer sections. */
.p-review > .l-inner {
    width: min(var(--lp-content-max), calc(100% - 40px));
}

.p-review__list,
.p-review__item {
    width: 100%;
}

.l-section {
    padding-block: 96px;
}

.c-sectionEn {
    margin-bottom: 8px;
    color: var(--r-blue);
    font-size: 1.3rem;
    font-weight: 900;
    letter-spacing: .22em;
}

.c-sectionTitle {
    position: relative;
    z-index: 1;
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    font-size: clamp(3.2rem, 3.6vw, 4.6rem);
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1.32;
}

.c-sectionTitle::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 50%;
    bottom: .05em;
    width: 72%;
    height: .28em;
    transform: translateX(-50%);
    background: var(--r-yellow);
    opacity: .82;
}

.c-sectionTitle--white::after {
    opacity: 1;
}

.c-sectionIcon {
    position: relative;
    width: 52px;
    height: 52px;
    margin-bottom: 12px;
    border: 5px solid #fff;
    background: var(--r-yellow);
    box-shadow: 0 0 0 2px var(--r-navy);
}

.c-sectionIcon::after {
    content: "!";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: var(--r-navy);
    font: 900 2.3rem/1 Inter, sans-serif;
}

/* Hero */
.p-fv {
    min-height: 700px;
    background:
        linear-gradient(90deg, rgba(255,255,255,.18) 0 47%, rgba(255,255,255,0) 62%),
        url("../img/hero-generated-v2.png") center / cover no-repeat;
    isolation: isolate;
}

.p-fv::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgba(8,120,201,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(8,120,201,.055) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(90deg, #000, transparent 72%);
}

.p-fv__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 640px) 1fr;
    grid-template-rows: auto 1fr;
    gap: 22px 44px;
    width: min(1180px, calc(100% - 48px));
    min-height: 700px;
    margin-inline: auto;
    padding: 26px 0 38px;
}

.p-fv__logo {
    grid-column: 1 / -1;
    text-align: left;
}

.p-fv__logo img {
    width: 230px;
    height: auto;
}

.p-fv__body {
    position: relative;
    z-index: 2;
    align-self: center;
    width: 100%;
    padding: 18px 0 16px;
}

.p-fv__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    color: var(--r-blue);
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.p-fv__eyebrow::before {
    content: "";
    width: 34px;
    height: 4px;
    background: var(--r-yellow);
}

.p-fv__area {
    padding: 8px 20px 9px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--r-navy), var(--r-blue));
    box-shadow: 5px 5px 0 var(--r-yellow);
    font-size: clamp(2.1rem, 2.15vw, 2.7rem);
    font-weight: 900;
    white-space: nowrap;
}

.p-fv__lead {
    margin-top: 22px;
    font-size: clamp(2.3rem, 2.7vw, 3.4rem);
    font-weight: 900;
    letter-spacing: -.03em;
}

.p-fv__catch {
    margin-top: 2px;
    font-size: clamp(3.8rem, 4.1vw, 5.2rem);
    font-weight: 900;
    text-shadow: 0 2px 0 #fff;
}

.p-fv__catch-em {
    display: block;
    position: relative;
    width: fit-content;
}

.p-fv__catch-em::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 0;
    bottom: 0;
    height: .26em;
    background: var(--r-yellow);
}

.p-fv__sub {
    margin-top: 8px;
    font-size: 2.2rem;
    font-weight: 900;
}

.p-fv__offerGraphic {
    position: relative;
    width: min(100%, 620px);
    margin-top: 22px;
}

.p-fv__offerGraphic img {
    display: block;
    width: 100%;
    height: auto;
}

.p-fv__offerTel,
.p-fv__offerMail {
    position: absolute;
    z-index: 2;
    top: 75.8%;
    height: 18.8%;
}

.p-fv__offerTel { left: 2.5%; width: 55.8%; }
.p-fv__offerMail { left: 60%; width: 37.5%; }

.p-fv__price,
.p-fv__badges,
.p-fv__action {
    display: none !important;
}

.p-fv__price {
    align-items: stretch;
    gap: 10px;
    margin-top: 22px;
}

.p-fv__priceItem {
    padding: 8px 12px;
    border: 2px solid var(--r-navy);
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--r-shadow-sm);
}

.p-fv__priceLabel {
    padding-right: 9px;
    border-right: 1px solid var(--r-line);
    font-size: 1.25rem;
    font-weight: 900;
}

.p-fv__priceNum {
    margin-left: 10px;
    font-size: 4.4rem;
    font-weight: 700;
}

.p-fv__priceTax { font-size: 1rem; }
.p-fv__priceUnit { padding-bottom: 5px; font-size: 1.5rem; font-weight: 900; }

.p-fv__cheapest {
    align-self: center;
    padding: 9px 10px;
    border-radius: 4px;
    background: var(--r-yellow);
    font-size: 1.2rem;
    font-weight: 900;
}

.p-fv__cheapest::before {
    border-right-color: var(--r-yellow);
}

.p-fv__badges {
    gap: 12px;
    margin-top: 20px;
}

.p-fv__badge {
    position: relative;
    width: 126px;
    height: 142px;
    padding: 0 18px 18px;
    border: 0;
    border-radius: 0;
    background: url("../img/badge-gold-generated-v3.png") center / contain no-repeat;
    color: var(--r-navy-deep);
    font-size: 1.35rem;
    font-weight: 900;
    text-shadow: 0 1px 0 rgba(255,255,255,.8);
    box-shadow: none;
}

.p-fv__badge::before,
.p-fv__badge::after {
    display: none;
}

.p-fv__badge::before { left: 16px; transform: rotate(18deg); }
.p-fv__badge::after { right: 16px; transform: rotate(-18deg); }

.p-fv__action {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 10px;
    margin-top: 26px;
}

.p-fv__tel,
.p-fv__mail {
    min-height: 68px;
    border-radius: 8px;
    box-shadow: none;
}

.p-fv__tel {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border: 2px solid var(--r-blue);
    background: #fff;
    color: var(--r-blue);
}

.p-fv__telLead {
    font-size: 1.15rem;
    writing-mode: vertical-rl;
}

.p-fv__telNum {
    font: 900 3rem/1 Inter, sans-serif;
}

.p-fv__mail {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding-left: 60px;
    background: url("../img/cta-plate-generated-v3.png") center / 100% 100% no-repeat;
    color: #fff;
    font-size: 1.7rem;
    font-weight: 900;
}

.p-fv__mail .c-mailIcon { display: none; }

.p-fv__photo {
    display: none;
}

.p-fv__photo::before {
    content: "雨漏り診断のプロ";
    position: absolute;
    z-index: 2;
    top: 24px;
    right: 18px;
    padding: 9px 15px;
    border-radius: 999px;
    background: var(--r-yellow);
    color: var(--r-navy);
    font-size: 1.25rem;
    font-weight: 900;
}

.p-fv__photo img {
    object-position: 44% center;
    filter: saturate(.96) contrast(1.03);
}

.p-fv__photo::after {
    content: "";
    position: absolute;
    inset: 45% 0 0;
    background: linear-gradient(transparent, rgba(3,39,73,.86));
}

.p-fv__photoCaption {
    position: absolute;
    z-index: 2;
    right: 24px;
    bottom: 26px;
    left: 24px;
    color: #fff;
    font-size: 1.55rem;
    text-align: center;
}

.p-fv__photoCaption span { color: var(--r-yellow); font-size: 2rem; font-weight: 900; }

.p-emergency {
    position: relative;
    z-index: 3;
    margin-top: -1px;
    background: repeating-linear-gradient(-45deg, var(--r-yellow) 0 18px, #111 18px 36px);
    padding: 8px 0;
}

.p-emergency__inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 15px 24px;
    border: 3px solid #111;
    background: #fff;
}

.p-emergency__label {
    padding: 8px 14px;
    background: var(--r-red);
    color: #fff;
    font-size: 1.5rem;
    font-weight: 900;
    transform: rotate(-2deg);
}

.p-emergency__text { font-size: 1.85rem; font-weight: 900; text-align: center; }
.p-emergency__text span { color: var(--r-red); }
.p-emergency__link { padding: 12px 18px; border-radius: 5px; background: var(--r-orange); color: #fff; font-size: 1.4rem; font-weight: 900; }

/* Causes */
.p-causes {
    padding-top: 110px;
    padding-bottom: 120px;
    background:
        radial-gradient(circle at 12% 12%, rgba(35,151,221,.35), transparent 28%),
        linear-gradient(145deg, var(--r-navy-deep), #075294 62%, var(--r-navy));
}

.p-causes::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 70px;
    background: #fff;
    clip-path: polygon(0 100%, 50% 0, 100% 100%);
}

.p-causes__lead {
    max-width: 760px;
    margin: 22px auto 34px;
    font-size: 1.8rem;
    line-height: 1.8;
}

.p-causes__em {
    display: inline;
    padding-inline: 3px;
    background: linear-gradient(transparent 55%, var(--r-yellow) 55%);
    color: #fff;
}

.p-causes__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.p-causes__item {
    position: relative;
    border: 4px solid #fff;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    overflow: hidden;
}

.p-causes__item::before {
    content: "";
    display: block;
    height: 8px;
    background: repeating-linear-gradient(-45deg, var(--r-yellow) 0 8px, #111 8px 16px);
}

.p-causes__imgWrap { aspect-ratio: 16 / 9; }
.p-causes__imgWrap img { width: 100%; height: 100%; object-fit: cover; }
.p-causes__stamp { top: 15px; left: 10px; padding: 4px 8px; border: 2px solid var(--r-red); background: #fff; color: var(--r-red); font-size: 1.2rem; font-weight: 900; transform: rotate(-9deg); }
.p-causes__name { padding: 15px 16px 4px; color: var(--r-navy); font-size: 1.75rem; }
.p-causes__text { padding: 0 16px 18px; color: #48647d; font-size: 1.25rem; }

.p-causes__diagram {
    position: relative;
    margin-top: 40px;
    padding: 24px 24px 54px;
    border: 5px solid var(--r-yellow);
    border-radius: 12px;
    background: #fff;
    box-shadow: none;
}

.p-causes__diagram img { width: 100%; max-height: 580px; object-fit: contain; }
.p-causes__diagramCap { right: 24px; bottom: 15px; left: 24px; color: var(--r-navy); font-size: 2rem; font-weight: 900; text-align: center; }
.p-causes__diagramCap em { color: var(--r-red); }

/* Cost comparison */
.p-compare { padding-block: 105px; background: var(--r-cream); }
.p-compare::before { content: "失敗しない雨漏り修理のために"; display: block; width: fit-content; margin: 0 auto 16px; padding: 7px 18px; border-radius: 999px; background: var(--r-navy); color: #fff; font-size: 1.35rem; letter-spacing: .08em; }
.p-compare__cases { gap: 12px; margin-top: 34px; }
.p-compare__case { position: relative; padding: 20px 10px; border: 2px solid var(--r-navy); border-radius: 8px; background: #fff; color: var(--r-navy); box-shadow: var(--r-shadow-sm); font-size: 1.45rem; }
.p-compare__case::before { content: "!"; position: absolute; top: -14px; left: 50%; display: grid; place-items: center; width: 28px; height: 28px; transform: translateX(-50%); border-radius: 50%; background: var(--r-yellow); color: var(--r-navy); font-family: Inter,sans-serif; font-weight: 900; }
.p-compare__sub { margin-top: 54px; font-size: 2.7rem; }
.p-compare__sub em { display: inline-block; margin-left: .3em; color: var(--r-red); }
.p-compare__cols { position: relative; gap: 18px; max-width: 900px; margin: 30px auto 0; }
.p-compare__cols::after { content: "VS"; position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; place-items: center; width: 62px; height: 62px; transform: translate(-50%,-50%); border: 5px solid #fff; border-radius: 50%; background: var(--r-yellow); color: var(--r-navy); font: 900 2rem/1 Inter,sans-serif; box-shadow: var(--r-shadow-sm); }
.p-compare__col { border-radius: 8px; box-shadow: none; overflow: hidden; }
.p-compare__col--other { border: 2px solid #98a8b7; background: #fff; }
.p-compare__col--ours { border: 4px solid var(--r-blue); background: #fff; transform: scale(1.025); }
.p-compare__colHead { padding: 15px; font-size: 2.3rem; }
.p-compare__col--other .p-compare__colHead { background: #8c9bab; color: #fff; }
.p-compare__col--ours .p-compare__colHead { background: linear-gradient(90deg,var(--r-navy),var(--r-blue)); color: #fff; }
.p-compare__colBody { padding-top: 20px; }
.p-compare__colUnit { font-size: 4.2rem; }
.p-compare__colTotal { margin-top: 8px; padding: 14px; font-size: 5.5rem; }
.p-compare__colTotal--ours { color: var(--r-red); background: #fff3b8; }

/* Inspection */
.p-inspect { padding-block: 105px; background: #fff; }
.p-inspect__lead { width: fit-content; margin: 0 auto 10px; padding: 7px 18px; border-radius: 999px; background: var(--r-yellow); color: var(--r-navy); font-size: 1.5rem; }
.p-inspect__desc { max-width: 900px; margin: 24px auto 40px; font-size: 1.55rem; line-height: 1.9; }
.p-inspect__body { align-items: stretch; gap: 30px; }
.p-inspect__steps { display: grid; gap: 15px; }
.p-inspect__step { position: relative; padding: 20px 20px 20px 72px; border: 2px solid var(--r-line); border-radius: 10px; background: var(--r-sky-2); box-shadow: var(--r-shadow-sm); }
.p-inspect__step::before { position: absolute; top: 50%; left: 18px; display: grid; place-items: center; width: 40px; height: 40px; transform: translateY(-50%); border-radius: 50%; background: var(--r-navy); color: #fff; font: 900 1.6rem/1 Inter,sans-serif; }
.p-inspect__step:nth-child(1)::before { content: "01"; }
.p-inspect__step:nth-child(2)::before { content: "02"; }
.p-inspect__step:nth-child(3)::before { content: "03"; }
.p-inspect__stepTitle { margin-bottom: 8px; padding: 0; background: none; color: var(--r-blue); font-size: 1.8rem; text-align: left; }
.p-inspect__stepText { font-size: 1.25rem; line-height: 1.8; }
.p-inspect__figure { padding: 8px; border: 3px solid var(--r-navy); border-radius: 8px; background: #fff; box-shadow: none; }

/* CTA */
.p-cta {
    position: relative;
    padding: 38px 0;
    background:
        radial-gradient(circle at 80% 15%, rgba(255,255,255,.16), transparent 22%),
        linear-gradient(120deg, var(--r-navy-deep), var(--r-blue));
}

.p-cta::before,
.p-cta::after { content: ""; position: absolute; top: 0; bottom: 0; width: 8px; background: var(--r-yellow); }
.p-cta::before { left: 18px; }
.p-cta::after { right: 18px; }
.p-cta__inner { display: block; padding: 28px 34px; border: 2px solid #fff; border-radius: 8px; background: #fff; box-shadow: none; }
.p-cta__graphic { position: relative; width: 100%; }
.p-cta__graphic img { display: block; width: 100%; height: auto; }
.p-cta__graphicTel,
.p-cta__graphicMail { position: absolute; z-index: 2; left: 46.3%; width: 49.8%; }
.p-cta__graphicTel { top: 40.6%; height: 23.4%; }
.p-cta__graphicMail { top: 68.9%; height: 21.7%; }
.p-cta__left,
.p-cta__right { display: none !important; }
.p-cta__left { position: relative; padding-left: 20px; border-left: 8px solid var(--r-yellow); }
.p-cta__limited { display: inline-block; padding: 5px 12px; background: #e9e9e9; color: #111; font-size: 1.4rem; }
.p-cta__price { font-size: 2rem; }
.p-cta__priceNum { color: var(--r-red); font-size: 4.5rem; }
.p-cta__campaign { margin: 3px 0 10px; color: var(--r-navy); font-size: 2.3rem; line-height: 1.3; }
.p-cta__tags { gap: 8px; }
.p-cta__tag { border-color: var(--r-navy); background: #fff; }
.p-cta__right { padding: 20px; border-radius: 10px; background: var(--r-sky); }
.p-cta__message { color: var(--r-navy); font-size: 1.8rem; }
.p-cta__tel { color: var(--r-blue); font-size: clamp(3rem,3.5vw,4.6rem); text-shadow: 0 2px 0 #fff; }
.p-cta__mail { padding-left: 74px; border: 0; border-radius: 0; background: url("../img/cta-mail.svg") center / 100% 100% no-repeat; box-shadow: none; color: transparent; }
.p-cta__mail .c-mailIcon { opacity: 0; width: 18px; }

/* Reviews and guarantee */
.p-review { padding-block: 100px; background: linear-gradient(180deg,#fff,var(--r-sky-2)); }
.p-review__title { margin-bottom: 38px; }
.p-review__list { gap: 20px; }
.p-review__item { position: relative; align-items: center; padding: 24px; border: 2px solid var(--r-line); border-radius: 8px; background: #fff; box-shadow: none; }
.p-review__avatar { flex: 0 0 112px; width: 112px; height: 112px; border: 4px solid #fff; border-radius: 50%; background: var(--r-blue); box-shadow: 0 0 0 2px var(--r-yellow); }
.p-review__avatar span { display: grid; place-items: center; width: 100%; height: 100%; color: #fff; font: 900 1.5rem/1.25 Inter,sans-serif; text-align: center; }
.p-review__avatar--02 { background: linear-gradient(145deg,#1697c7,#04548e); }
.p-review__balloon { flex: 1; border: 0; background: var(--r-sky-2); }
.p-review__stars { color: #f1a900; font-size: 2rem; }
.p-review__photos { gap: 18px; margin-top: 28px; }
.p-review__photos li { border: 5px solid #fff; border-radius: 6px; box-shadow: none; overflow: hidden; }

.p-guarantee { padding-block: 94px; background: var(--r-sky-2); }
.p-guarantee__inner { padding: 38px; border: 2px solid var(--r-blue); border-radius: 8px; background: #fff; box-shadow: none; }
.p-guarantee__label { display: inline-block; padding: 8px 14px; background: var(--r-red); color: #fff; transform: skew(-8deg); }
.p-guarantee__title { margin-top: 14px; font-size: 4rem; }
.p-guarantee__text { margin-top: 18px; line-height: 1.8; }
.p-guarantee__note { display: inline-block; margin-top: 18px; padding: 8px 12px; background: var(--r-yellow); color: var(--r-navy); }
.p-guarantee__figure { padding: 12px; border: 1px solid #cfd8df; background: #eef2f5; transform: none; box-shadow: none; }
.p-guarantee__certificate { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 290px; padding: 34px; border: 2px solid #9caab5; background: #fff; color: #333; text-align: center; }
.p-guarantee__certificateSub { font-size: 1.2rem; letter-spacing: .2em; }
.p-guarantee__certificateTitle { margin-top: 8px; color: var(--r-navy); font-family: serif; font-size: 3.2rem; font-weight: 700; letter-spacing: .28em; }
.p-guarantee__certificateName { margin-top: 24px; border-bottom: 1px solid #999; font-family: serif; font-size: 1.5rem; }
.p-guarantee__certificateText { margin-top: 18px; font-family: serif; font-size: 1.2rem; line-height: 1.8; text-align: left; }
.p-guarantee__certificateSeal { position: absolute; right: 25px; bottom: 20px; display: grid; place-items: center; width: 58px; height: 58px; border: 3px solid #c42b2b; border-radius: 50%; color: #c42b2b; font-family: serif; font-weight: 700; }
.p-insurance {
    position: relative;
    min-height: 340px;
    padding: 70px 0;
    background:
        linear-gradient(90deg,rgba(2,21,40,.2),rgba(2,21,40,0)),
        url("../img/inspection-cta-generated-v2.png") center / cover no-repeat;
}
.p-insurance__inner { position: relative; z-index: 1; }
.p-insurance__eyebrow { display: inline-block; margin-bottom: 12px; padding: 6px 12px; background: var(--r-yellow); color: var(--r-navy); font-size: 1.35rem; font-weight: 900; }
.p-insurance__text { max-width: 590px; color: #fff; font-size: 2.5rem; text-align: left; text-shadow: 0 2px 12px rgba(0,0,0,.55); }
.p-insurance__text em { color: var(--r-yellow); }
.p-insurance__link { display: inline-flex; align-items: center; justify-content: center; min-width: 360px; min-height: 66px; margin-top: 24px; padding: 15px 24px 15px 76px; border-radius: 6px; background: var(--r-orange); color: #fff; font-size: 1.5rem; font-weight: 900; text-shadow: none; }

/* Cases, costs, proof */
.p-case { padding-block: 100px; background: var(--r-cream); }
.p-case__item { margin-top: 38px; padding: 26px; border: 2px solid var(--r-navy); border-radius: 8px; background: #fff; box-shadow: none; }
.p-case__balloon { width: min(760px,90%); margin: -48px auto 28px; padding: 14px 20px; border: 2px solid var(--r-navy); border-radius: 6px; background: #fffef3; color: var(--r-navy); font-size: 2rem; font-weight: 900; box-shadow: 4px 4px 0 var(--r-yellow); }
.p-case__cols { gap: 22px; }
.p-case__col { padding: 16px; border-left: 4px solid var(--r-blue); background: var(--r-sky-2); }
.p-case__label { display: inline-block; padding: 5px 10px; background: var(--r-blue); color: #fff; }
.p-case__figure { border-radius: 8px; box-shadow: var(--r-shadow-sm); overflow: hidden; }
.p-case__tag { padding: 5px 10px; background: var(--r-blue); color: #fff; }

.p-cost { padding-block: 100px; background: linear-gradient(180deg,var(--r-sky-2),#d8f2ff); }
.p-cost__tabs { margin-top: 34px; }
.p-cost__tab { min-width: 180px; padding: 14px 28px; border: 2px solid var(--r-blue); background: #fff; color: var(--r-blue); }
.p-cost__tab.is-active { background: linear-gradient(90deg,var(--r-navy),var(--r-blue)); color: #fff; box-shadow: var(--r-shadow-sm); }
.p-cost__list { gap: 18px; }
.p-cost__item { border: 1px solid var(--r-line); border-radius: 6px; background: #fff; box-shadow: none; overflow: hidden; transition: border-color .2s; }
.p-cost__item:hover { border-color: var(--r-blue); }
.p-cost__item img { aspect-ratio: 3 / 2; object-fit: cover; }
.p-cost__name { padding: 14px 15px 0; color: var(--r-navy); }
.p-cost__price { padding: 4px 15px 15px; border-bottom: 5px solid var(--r-blue); color: var(--r-navy); }

.p-solved { padding-block: 100px; background: #fff; }
.p-solved__list { gap: 14px; }
.p-solved__item { border: 1px solid var(--r-line); border-radius: 10px; background: var(--r-cream); box-shadow: var(--r-shadow-sm); overflow: hidden; }
.p-solved__head { background: linear-gradient(90deg,var(--r-navy),var(--r-blue)); color: #fff; }

.p-comparison { padding-block: 100px; background: radial-gradient(circle,#fff 0 30%,var(--r-sky) 100%); }
.p-comparison__table { overflow: hidden; border: 2px solid var(--r-blue); border-radius: 8px; box-shadow: none; }
.p-comparison__ours { background: #fffdf1; border-inline: 3px solid var(--r-blue); }

/* Promise and flow */
.p-promise { padding-block: 86px; background: linear-gradient(145deg,var(--r-navy-deep),var(--r-navy) 65%,var(--r-blue)); }
.p-promise__lead { color: #fff; }
.p-promise__title { color: var(--r-yellow); font-size: 4rem; }
.p-promise__stars { color: var(--r-yellow); }
.p-promise__list { gap: 12px; margin-top: 30px; padding: 22px; border-radius: 8px; background: #fff; box-shadow: none; }
.p-promise__item { border-right: 1px solid var(--r-line); }
.p-promise__num { background: linear-gradient(145deg,#f8d85b,#bd8620); border: 5px solid #fff; box-shadow: 0 0 0 2px #d1a72d; }
.p-promise__num { border: 3px solid #c99818; border-radius: 50%; background: #f6cf46; color: var(--r-navy); text-shadow: none; box-shadow: none; }
.p-promise__text { color: var(--r-navy); }

.p-flow { padding-block: 100px; background: var(--r-cream); }
.p-flow__box { margin-top: 30px; padding: 30px; border: 2px solid var(--r-navy); border-radius: 8px; background: #fff; box-shadow: none; }
.p-flow__item { position: relative; border: 2px solid var(--r-blue); border-radius: 7px; background: #fff; }
.p-flow__item::after { content: ""; position: absolute; top: 50%; right: -17px; width: 14px; height: 14px; border-top: 4px solid var(--r-yellow); border-right: 4px solid var(--r-yellow); transform: translateY(-50%) rotate(45deg); }
.p-flow__item:last-child::after { display: none; }
.p-flow__item--free { background: linear-gradient(180deg,#159fe4,var(--r-blue)); color: #fff; }
.p-flow__freeLabel { background: var(--r-yellow); color: var(--r-navy); }

/* Locations, company, FAQ, form */
.p-place { padding-block: 96px; background: #fff; }
.p-place__list { gap: 24px; margin-top: 34px; }
.p-place__item { position: relative; border: 5px solid #fff; border-radius: 8px; box-shadow: none; overflow: hidden; }
.p-place__item img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.p-place__name { position: absolute; right: 14px; bottom: 14px; left: 14px; padding: 10px; border-radius: 5px; background: rgba(4,42,82,.88); color: #fff; }

.p-about { padding-block: 100px; background-image: linear-gradient(rgba(8,120,201,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(8,120,201,.06) 1px,transparent 1px); background-size: 28px 28px; }
.p-about__address { margin-top: 34px; border-radius: 10px; background: #fff; box-shadow: var(--r-shadow-sm); overflow: hidden; }
.p-about__addressLabel { background: var(--r-navy); color: #fff; }
.p-about__message { position: relative; margin-top: 36px; padding: 36px 32px 0; border: 2px solid var(--r-line); border-radius: 8px; background: linear-gradient(120deg,#fff,var(--r-sky)); box-shadow: none; overflow: hidden; }
.p-about__catch { color: var(--r-red); font-size: 2.8rem; }
.p-about__area { display: inline-block; margin-top: 8px; padding: 6px 12px; background: var(--r-yellow); color: var(--r-blue); }
.p-about__figure img { filter: drop-shadow(0 10px 12px rgba(0,0,0,.18)); }

.p-faq { padding-block: 100px; background: linear-gradient(180deg,#dff4ff,#c7ebfc); }
.p-faq__list { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-top: 36px; }
.p-faq__item { border: 0; border-radius: 10px; background: #fff; box-shadow: var(--r-shadow-sm); overflow: hidden; }
.p-faq__q { padding: 16px 18px; background: linear-gradient(90deg,var(--r-navy),var(--r-blue)); color: #fff; }
.p-faq__a { padding: 18px; background: #fff; color: #334d63; line-height: 1.75; }
.p-faq__mark { background: #fff; color: var(--r-blue); }
.p-faq__mark--a { background: var(--r-yellow); color: var(--r-navy); }

.p-contact { padding-block: 100px 130px; background: linear-gradient(145deg,var(--r-navy-deep),var(--r-blue)); }
.p-contact .c-sectionTitle { color: #fff; }
.p-contact__lead { color: var(--r-yellow); }
.p-contact__form { max-width: 820px; margin: 40px auto 0; padding: 38px; border-radius: 8px; background: #fff; box-shadow: none; }
.p-contact__row { display: grid; grid-template-columns: 190px 1fr; align-items: center; gap: 18px; margin-bottom: 18px; }
.p-contact__label { color: var(--r-navy); }
.p-contact__input { border: 2px solid #c7d9e6; border-radius: 7px; background: #f8fbfd; transition: border-color .2s,box-shadow .2s; }
.p-contact__input:focus { border-color: var(--r-blue); outline: 0; box-shadow: 0 0 0 4px rgba(8,120,201,.14); }
.p-contact__privacy { border-radius: 8px; background: var(--r-sky-2); }
.p-contact__submit { min-width: 360px; min-height: 72px; padding: 18px 34px 18px 88px; border-radius: 0; background: url("../img/cta-submit.svg") center / 100% 100% no-repeat; box-shadow: none; color: transparent; font-size: 1.8rem; }
.p-contact__submit:hover { transform: translateY(2px); filter: brightness(1.05); }

.l-footer { padding: 26px 0 calc(var(--cta-h) + 24px); background: var(--r-navy-deep); }
.l-footer__logo img { filter: brightness(0) invert(1); }
.l-footer__copy { color: rgba(255,255,255,.72); }

.c-pagetop { border-radius: 8px; background: var(--r-navy); box-shadow: var(--r-shadow-sm); }

.p-fixedCta { border-top: 3px solid var(--r-yellow); background: var(--r-navy); box-shadow: 0 -3px 12px rgba(0,0,0,.14); }
.p-fixedCta__inner { height: 100%; }
.p-fixedCta__badge { background: var(--r-yellow); color: var(--r-navy); }
.p-fixedCta__operator { align-self: flex-end; height: 102px; background: transparent; overflow: hidden; }
.p-fixedCta__operator img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; }
.p-fixedCta__message { color: #fff; }
.p-fixedCta__free { background: var(--r-yellow); color: var(--r-navy); }
.p-fixedCta__tel { flex: 0 0 290px; }
.p-fixedCta__telNum { color: #fff; font-size: 3.7rem; white-space: nowrap; }
.p-fixedCta__mail { border-radius: 0; background: url("../img/cta-mail.svg") center / 100% 100% no-repeat; box-shadow: none; color: transparent; }
.p-fixedCta__mail .c-mailIcon { opacity: 0; width: 12px; }

@media (max-width: 768px) {
    :root { --cta-h: 116px; }

    .l-inner { width: min(100% - 28px, 680px); }
    .l-section { padding-block: 68px; }
    .c-sectionTitle { font-size: clamp(2.6rem,8vw,3.6rem); }
    .c-sectionIcon { width: 46px; height: 46px; }

    .p-fv {
        min-height: auto;
        padding: 0;
        background:
            linear-gradient(180deg, rgba(255,255,255,.08) 0 46%, #fff 66%),
            url("../img/hero-generated-v2.png") 62% 118px / auto 430px no-repeat,
            #eefaff;
    }
    .p-fv::before { opacity: .8; mask-image: linear-gradient(#000,transparent 70%); }
    .p-fv__inner { display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 12px; width: 100%; min-height: auto; padding: 14px 14px 24px; }
    .p-fv__logo { grid-row: 1; text-align: center; }
    .p-fv__logo img { width: 170px; }
    .p-fv__body { grid-row: 2; padding: 4px 0 0; text-align: left; }
    .p-fv__eyebrow { display: flex; width: fit-content; margin-inline: auto; font-size: 1.15rem; }
    .p-fv__area { padding: 6px 12px; box-shadow: 5px 5px 0 var(--r-yellow); font-size: clamp(1.8rem,6vw,2.4rem); }
    .p-fv__lead { width: 64%; margin-top: 20px; font-size: clamp(1.45rem,4.3vw,1.85rem); line-height: 1.45; }
    .p-fv__catch { width: 68%; margin-top: 5px; font-size: clamp(2.55rem,7.3vw,3.2rem); line-height: 1.15; }
    .p-fv__catch-sm { font-size: .48em; }
    .p-fv__sub { width: 64%; margin-top: 9px; font-size: 1.45rem; }
    .p-fv__offerGraphic { width: 100%; margin-top: 112px; }
    .p-fv__price { justify-content: center; flex-wrap: wrap; margin-top: 112px; text-align: center; }
    .p-fv__priceItem { padding: 6px 8px; }
    .p-fv__priceNum { font-size: 3.5rem; }
    .p-fv__cheapest { order: 3; width: fit-content; }
    .p-fv__badges { justify-content: center; gap: 8px; }
    .p-fv__badge { width: 96px; height: 110px; padding: 0 13px 14px; font-size: .95rem; }
    .p-fv__action { grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 20px; }
    .p-fv__tel,.p-fv__mail { min-height: 58px; }
    .p-fv__tel { gap: 6px; }
    .p-fv__telLead { display: none; }
    .p-fv__telNum { font-size: clamp(2rem,6.4vw,2.8rem); }
    .p-fv__mail { font-size: 1.35rem; }
    .p-fv__photo { display: none; }

    .p-emergency__inner { grid-template-columns: 1fr; gap: 8px; padding: 12px; text-align: center; }
    .p-emergency__label { width: fit-content; margin: auto; font-size: 1.2rem; }
    .p-emergency__text { font-size: 1.45rem; }
    .p-emergency__link { font-size: 1.2rem; }

    .p-causes { padding-top: 78px; padding-bottom: 90px; }
    .p-causes__lead { font-size: 1.4rem; }
    .p-causes__list { grid-template-columns: repeat(2,1fr); gap: 10px; }
    .p-causes__item { border-width: 3px; }
    .p-causes__name { padding: 10px 10px 2px; font-size: 1.35rem; }
    .p-causes__text { padding: 0 10px 12px; font-size: 1rem; }
    .p-causes__diagram { margin-top: 22px; padding: 10px 10px 48px; border-width: 3px; }
    .p-causes__diagramCap { font-size: 1.4rem; }

    .p-compare::before { font-size: 1.1rem; }
    .p-compare__cases { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
    .p-compare__case { padding: 17px 8px 13px; font-size: 1.15rem; }
    .p-compare__sub { margin-top: 36px; font-size: 2.1rem; }
    .p-compare__sub em { display: block; margin: 4px 0 0; }
    .p-compare__cols { gap: 8px; }
    .p-compare__cols::after { width: 42px; height: 42px; border-width: 3px; font-size: 1.25rem; }
    .p-compare__col--ours { transform: none; }
    .p-compare__colHead { font-size: 1.55rem; }
    .p-compare__colBody { font-size: 1.2rem; }
    .p-compare__colUnit { font-size: 3rem; }
    .p-compare__colTotal { font-size: 3.7rem; }

    .p-inspect__desc { font-size: 1.3rem; text-align: left; }
    .p-inspect__body { display: flex; flex-direction: column-reverse; }
    .p-inspect__step { padding: 16px 14px 16px 60px; }
    .p-inspect__step::before { left: 12px; width: 34px; height: 34px; font-size: 1.2rem; }
    .p-inspect__stepTitle { font-size: 1.5rem; }
    .p-inspect__stepText { font-size: 1.15rem; }

    .p-cta { padding: 22px 0; }
    .p-cta::before,.p-cta::after { width: 4px; }
    .p-cta::before { left: 5px; }
    .p-cta::after { right: 5px; }
    .p-cta__inner { padding: 20px 16px; }
    .p-cta__left { padding-left: 12px; border-left-width: 5px; }
    .p-cta__priceNum { font-size: 3.8rem; }
    .p-cta__campaign { font-size: 1.8rem; }
    .p-cta__right { margin-top: 16px; padding: 15px 12px; }
    .p-cta__tel { font-size: 3.1rem; }

    .p-review__item { padding: 16px; }
    .p-review__avatar { flex-basis: 76px; width: 76px; height: 76px; border-width: 4px; }
    .p-review__avatar span { font-size: 1.05rem; }
    .p-review__balloon { padding: 14px; }
    .p-review__photos { grid-template-columns: 1fr; }

    .p-guarantee { background: linear-gradient(165deg,#fff 0 48%,var(--r-sky) 48%); }
    .p-guarantee__inner { padding: 22px 16px; }
    .p-guarantee__title { font-size: 3rem; }
    .p-guarantee__figure { margin-top: 24px; }
    .p-guarantee__certificate { min-height: 240px; padding: 24px 18px; }
    .p-guarantee__certificateTitle { font-size: 2.2rem; }
    .p-insurance { min-height: 430px; padding: 52px 0 190px; background-position: 64% center; }
    .p-insurance__text { max-width: 100%; font-size: 1.7rem; }
    .p-insurance__link { min-width: 300px; min-height: 58px; margin-top: 16px; padding-left: 68px; font-size: 1.15rem; }

    .p-case__item { padding: 16px 12px; }
    .p-case__balloon { margin-top: -36px; padding: 10px; font-size: 1.45rem; }
    .p-case__col { padding: 10px; }
    .p-cost__list { gap: 10px; }
    .p-cost__item img { aspect-ratio: 4 / 3; }
    .p-cost__name { padding: 10px 10px 0; }
    .p-cost__price { padding: 2px 10px 10px; }

    .p-solved__list { display: grid; grid-template-columns: 1fr; }
    .p-promise__list { display: grid; grid-template-columns: 1fr; padding: 15px; }
    .p-promise__item { display: grid; grid-template-columns: 76px 1fr; align-items: center; gap: 12px; padding: 10px 0; border-right: 0; border-bottom: 1px solid var(--r-line); }
    .p-promise__item:last-child { border-bottom: 0; }
    .p-promise__num { width: 68px; height: 68px; }
    .p-promise__text { text-align: left; }

    .p-flow__box { padding: 16px 10px; }
    .p-flow__list { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
    .p-flow__item::after { display: none; }
    .p-flow__name { font-size: 1.1rem; }
    .p-place__list { grid-template-columns: 1fr; }

    .p-about__message { padding: 25px 18px 0; }
    .p-about__catch { font-size: 2.2rem; }
    .p-about__figure { width: 170px; margin: 18px auto 0; }

    .p-faq__list { grid-template-columns: 1fr; gap: 12px; }
    .p-faq__q { padding: 13px 14px; }
    .p-faq__a { padding: 15px; }

    .p-contact { padding-bottom: calc(var(--cta-h) + 48px); }
    .p-contact__form { padding: 22px 14px; }
    .p-contact__row { grid-template-columns: 1fr; gap: 7px; }
    .p-contact__submit { min-width: 0; width: 100%; }

    .p-fixedCta { height: var(--cta-h); border-top-width: 3px; }
    .p-fixedCta__sp { background: linear-gradient(90deg,var(--r-navy-deep),var(--r-navy)); }
    .p-fixedCta__spHead { background: var(--r-yellow); color: var(--r-navy); }
    .p-fixedCta__spTel { background: #fff; color: var(--r-blue); }
    .p-fixedCta__spMail { background: url("../img/cta-mail.svg") center / 100% 100% no-repeat; color: transparent; }
    .p-fixedCta__spMail .c-mailIcon { opacity: 0; }
    .p-fixedCta__spFree { background: var(--r-yellow); color: var(--r-navy); }
}

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