/* === PAGE CONTENT === */
.page-content-section {
    padding: 0 0 80px;
    background: var(--color-bg);
}

/* === PAGE HERO BANNER (rikasale.ru breadcrumb style) === */
.page-hero {
    background: #f5f5f5;
    padding: 24px 0;
    margin-bottom: 32px;
}
.page-breadcrumb {
    font-size: 13px;
    color: var(--color-text-muted);
    margin-bottom: 12px;
}
.page-breadcrumb a {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color 0.2s;
}
.page-breadcrumb a:hover { color: var(--color-primary); }
.page-hero h1 {
    font-size: 32px;
    font-weight: 800;
    margin: 0;
    color: var(--color-black);
}

/* ================================================================
   RIKASALE.RU STYLE LAYOUT — 2 columns: cards left + photo right
   ================================================================ */
.info-layout-rikasale {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 24px;
    align-items: start;
}
.info-layout-rikasale--warranty {
    grid-template-columns: 2fr 1fr;
}

/* Cards column */
.info-cards-column {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.info-cards-column--2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Individual rika card */
.info-rika-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 12px;
    padding: 28px 24px;
    transition: box-shadow 0.3s ease;
}
.info-rika-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}
.info-rika-card h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--color-black);
    line-height: 1.4;
}
.info-rika-card p {
    font-size: 14px;
    line-height: 1.7;
    color: #666;
    margin: 0 0 8px;
}
.info-rika-card p:last-child { margin-bottom: 0; }

/* Row layout inside cards column */
.info-rika-card-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Half-width card */
.info-rika-card--half {
    /* Inherits from .info-rika-card */
}

/* Accent card — orange/warm (rikasale.ru warranty style) */
.info-rika-card--accent {
    background: #E8601C;
    border: none;
    color: #fff;
}
.info-rika-card--accent h3 { color: #fff; }
.info-rika-card--accent p { color: rgba(255,255,255,0.9); }

.info-rika-card--accent-full {
    background: linear-gradient(135deg, #1a2a14, #2E4528);
    border: none;
    color: #fff;
}
.info-rika-card--accent-full h3 { color: #fff; font-size: 20px; }
.info-rika-card--accent-full p { color: rgba(255,255,255,0.85); }

/* Lists inside rika cards */
.info-rika-list {
    list-style: none;
    padding: 0;
    margin: 12px 0 0;
}
.info-rika-list li {
    font-size: 14px;
    color: #444;
    padding: 6px 0 6px 20px;
    position: relative;
    line-height: 1.6;
}
.info-rika-list li::before {
    content: '•';
    position: absolute;
    left: 4px;
    color: var(--color-primary);
    font-weight: bold;
}
.info-rika-list--bullets li::before {
    content: '•';
    color: var(--color-primary);
}
.info-rika-list--check li::before {
    content: '✦';
    color: var(--color-primary);
}
.info-rika-list--accent li {
    color: rgba(255,255,255,0.9);
}
.info-rika-list--accent li::before {
    content: '✦';
    color: rgba(255,255,255,0.7);
}

/* Photo column (right side) */
.info-photo-column {
    position: sticky;
    top: 100px;
    border-radius: 12px;
    overflow: hidden;
    max-height: 600px;
}
.info-photo-column img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    min-height: 400px;
}
.info-photo-placeholder {
    width: 100%;
    min-height: 400px;
    background: linear-gradient(135deg, #1a2e15, #2d4a25, #1a2e15);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    position: relative;
    overflow: hidden;
}
.info-photo-placeholder::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(circle at 30% 70%, rgba(61,90,53,0.3) 0%, transparent 60%);
}
.info-photo-placeholder svg {
    width: 100px;
    height: 100px;
    color: var(--color-primary);
    opacity: 0.4;
    position: relative;
    z-index: 1;
}

/* Form column (warranty page) */
.info-form-column {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 12px;
    padding: 28px 24px;
}
.info-form-column h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--color-black);
}
.info-form-column p {
    font-size: 14px;
    line-height: 1.7;
    color: #666;
}

/* Address badge (rikasale.ru style) */
.info-address-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #f5f7f3;
    border-radius: 10px;
    margin-top: 12px;
}
.info-address-badge svg {
    width: 20px;
    height: 20px;
    color: var(--color-primary);
    flex-shrink: 0;
}
.info-address-badge span {
    font-size: 14px;
    color: var(--color-text);
}

/* Warranty services */
.info-warranty-services {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
}
.info-warranty-service {
    background: rgba(255,255,255,0.12);
    border-radius: 10px;
    padding: 16px;
}
.info-warranty-service h4 {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 8px;
}
.info-warranty-service p {
    font-size: 13px;
    color: rgba(255,255,255,0.8);
    margin: 0;
}
.info-warranty-service ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.info-warranty-service li {
    font-size: 13px;
    color: rgba(255,255,255,0.85);
    padding: 4px 0 4px 18px;
    position: relative;
    line-height: 1.5;
}
.info-warranty-service li::before {
    content: '✦';
    position: absolute;
    left: 0;
    color: rgba(255,255,255,0.6);
}

/* Warranty bottom row */
.info-warranty-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 40px;
}

/* ================================================================
   CTA BAR — rikasale.ru style horizontal call-to-action
   ================================================================ */
.info-cta-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 28px 32px;
    background: #f5f5f5;
    border-radius: 12px;
    margin-bottom: 40px;
    gap: 24px;
}
.info-cta-text h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 4px;
    color: var(--color-black);
}
.info-cta-text p {
    font-size: 14px;
    color: #666;
    margin: 0;
}
.info-cta-actions {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}
.info-cta-actions .btn-outline {
    border: 1px solid #333;
    color: #333;
    background: transparent;
}
.info-cta-actions .btn-outline:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* ================================================================
   ABOUT PAGE — 2-column text+image block
   ================================================================ */
.info-layout-2col {
    margin-bottom: 40px;
}
.info-text-block--with-image {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 32px;
    align-items: start;
}
.info-text-side p {
    font-size: 15px;
    line-height: 1.8;
    color: #444;
    margin: 0 0 16px;
}
.info-image-side {
    border-radius: 12px;
    overflow: hidden;
}
.info-image-side img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
}

/* Highlight block (orange line at bottom) */
.info-highlight-block {
    border-top: 3px solid #E8601C;
    padding: 24px 0;
    margin-bottom: 32px;
}
.info-highlight-block p {
    font-size: 15px;
    line-height: 1.7;
    color: #444;
    margin: 0 0 8px;
    font-style: italic;
}
.info-highlight-block a {
    color: var(--color-primary);
    text-decoration: underline;
}
.info-highlight-block a:hover {
    color: #E8601C;
}

/* Section block */
.info-section-block {
    margin-bottom: 32px;
}
.info-section-block h2 {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-black);
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--color-border-light);
}
.info-requisites p {
    font-size: 14px;
    color: #555;
    margin: 4px 0;
    line-height: 1.6;
}
.requisites-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.requisites-table td {
    padding: 10px 14px;
    border-bottom: 1px solid #eee;
    vertical-align: top;
    line-height: 1.5;
}
.requisites-table td:first-child {
    width: 200px;
    color: #888;
    font-size: 13px;
    white-space: nowrap;
}
.requisites-table td:last-child {
    color: #333;
}
.requisites-table tr:nth-child(even) td {
    background: #fafafa;
}
.requisites-table tr:last-child td {
    border-bottom: none;
}
@media(max-width:768px) {
    .requisites-table td:first-child { white-space: normal; width: 40%; }
}

/* ================================================================
   EXISTING COMPONENTS — kept from before
   ================================================================ */

/* === INFO GRID === */
.info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 48px;
}

/* === INFO CARD (premium) === */
.info-card {
    background: #fff;
    border-radius: 16px;
    padding: 32px 28px;
    border: 1px solid var(--color-border-light);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}
.info-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color-primary), #6B9B5E);
    opacity: 0;
    transition: opacity 0.3s;
}
.info-card::after {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 120px;
    height: 120px;
    background: radial-gradient(circle, rgba(61,90,53,0.05) 0%, transparent 70%);
    border-radius: 50%;
    transition: transform 0.4s ease;
}
.info-card:hover {
    box-shadow: 0 16px 48px rgba(0,0,0,0.1);
    transform: translateY(-4px);
    border-color: rgba(61,90,53,0.2);
}
.info-card:hover::before { opacity: 1; }
.info-card:hover::after { transform: scale(1.5); }

/* Card icon */
.info-card-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(61,90,53,0.1), rgba(61,90,53,0.05));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}
.info-card-icon svg {
    width: 28px;
    height: 28px;
    color: var(--color-primary);
}

/* Card headings */
.info-card h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--color-black);
    position: relative;
    z-index: 1;
}
.info-card p {
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-text-light);
    margin: 0;
    position: relative;
    z-index: 1;
}
.info-card p + p { margin-top: 8px; }

/* === INFO LINKS === */
.info-link {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    transition: color 0.2s;
    position: relative;
}
.info-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--color-primary);
    transition: width 0.3s;
}
.info-link:hover { color: var(--color-primary-hover); }
.info-link:hover::after { width: 100%; }
.info-muted { color: var(--color-text-muted) !important; font-size: 13px !important; margin-top: 4px !important; }

/* === PAGE PROSE === */
.page-prose {
    max-width: 800px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.8;
    color: var(--color-text);
}
.page-prose h2 {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-black);
    margin: 40px 0 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--color-border-light);
}
.page-prose h3 { font-size: 20px; font-weight: 600; margin: 32px 0 12px; color: var(--color-black); }
.page-prose p { margin-bottom: 16px; }
.page-prose ul, .page-prose ol { margin: 16px 0; padding-left: 24px; }
.page-prose li { margin-bottom: 8px; }
.page-prose img { max-width: 100%; border-radius: 12px; margin: 24px 0; }

/* === STATS ROW === */
.info-stats-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 32px 0 40px;
    padding: 32px 24px;
    background: linear-gradient(135deg, #f8f9f7, #eef1eb);
    border-radius: 16px;
    border: 1px solid var(--color-border-light);
}
.info-stat {
    text-align: center;
    padding: 8px 0;
}
.info-stat-num {
    display: block;
    font-size: 32px;
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1.2;
    margin-bottom: 4px;
}
.info-stat-label {
    display: block;
    font-size: 13px;
    color: var(--color-text-muted);
    font-weight: 500;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 1024px) {
    .info-layout-rikasale {
        grid-template-columns: 1fr;
    }
    .info-layout-rikasale--warranty {
        grid-template-columns: 1fr;
    }
    .info-photo-column {
        position: static;
        max-height: 300px;
        order: -1;
    }
    .info-photo-column img {
        min-height: 200px;
        max-height: 300px;
    }
    .info-text-block--with-image {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .info-cards-column--2col {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 768px) {
    .info-grid { grid-template-columns: 1fr; }
    .info-card { padding: 24px 20px; }
    .page-hero h1 { font-size: 24px; }
    .info-stats-row { grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 24px 16px; }
    .info-stat-num { font-size: 24px; }
    .info-rika-card-row { grid-template-columns: 1fr; }
    .info-warranty-bottom { grid-template-columns: 1fr; }
    .info-cta-bar {
        flex-direction: column;
        text-align: center;
        padding: 24px 20px;
    }
    .info-cta-actions {
        flex-direction: column;
        width: 100%;
    }
    .info-cta-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

/* ================================================================
   BUTIK FISH — Оформление внутренних страниц (графит + синий)
   ================================================================ */
.page-hero{
  background: linear-gradient(135deg, #1E2526 0%, #2D3436 55%, #243A45 100%);
  padding: 40px 0;
  margin-bottom: 40px;
  position: relative;
  overflow: hidden;
}
.page-hero::after{
  content:''; position:absolute; right:-60px; top:-60px; width:220px; height:220px;
  background: radial-gradient(circle, rgba(22,143,209,.30) 0%, rgba(22,143,209,0) 70%);
  pointer-events:none;
}
.page-hero h1{ color:#fff; font-size:34px; font-weight:800; letter-spacing:.5px; }
.page-hero .page-breadcrumb,
.page-hero .page-breadcrumb a{ color:rgba(255,255,255,.6); }
.page-hero .page-breadcrumb a:hover{ color:var(--color-accent); }

/* Cards */
.info-rika-card{
  border:1px solid var(--color-border-light);
  border-radius:14px;
  transition:border-color .25s, box-shadow .25s, transform .25s;
}
.info-rika-card:hover{
  border-color:var(--color-accent);
  box-shadow:0 10px 28px rgba(22,143,209,.12);
  transform:translateY(-2px);
}
.info-rika-card h3{ color:var(--color-black); }
.info-rika-card--accent,
.info-rika-card--accent-full{
  background:linear-gradient(135deg,#1E2526,#2D3436)!important;
  border:none!important;
}
.info-rika-card--accent h3,.info-rika-card--accent-full h3{ color:#fff!important; }

/* Bullet/checkmarks in brand blue */
.info-rika-list li::before{ color:var(--color-accent)!important; }
.info-rika-list--check li::before{ color:var(--color-accent)!important; }

/* Address badge */
.info-address-badge{
  background:rgba(22,143,209,.08);
  border:1px solid rgba(22,143,209,.20);
  border-radius:10px;
}
.info-address-badge svg{ color:var(--color-accent); }

/* Photo column */
.info-photo-column img{ border-radius:14px; box-shadow:0 12px 30px rgba(0,0,0,.12); }
.info-photo-placeholder{
  background:linear-gradient(135deg,#1E2526,#2D3436); color:var(--color-accent); border-radius:14px;
}

/* Contacts cards */
.info-card{
  border:1px solid var(--color-border-light); border-radius:14px; transition:all .25s; text-align:center;
}
.info-card:hover{ border-color:var(--color-accent); box-shadow:0 10px 28px rgba(22,143,209,.12); transform:translateY(-2px); }
.info-card-icon{
  width:60px;height:60px;border-radius:50%;
  background:linear-gradient(135deg,#1E2526,#2D3436); color:var(--color-accent);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.info-card-icon svg{ width:28px;height:28px; }
.info-link{ color:var(--color-accent); font-weight:700; }

/* CTA bar */
.info-cta-bar{
  background:linear-gradient(135deg,#1E2526 0%,#2D3436 60%,#243A45 100%);
  border-radius:16px; border:none;
}
.info-cta-bar h3{ color:#fff; }
.info-cta-bar p{ color:rgba(255,255,255,.7); }

/* Requisites table */
.requisites-table{ width:100%; border-collapse:collapse; }
.requisites-table td{ padding:10px 14px; border-bottom:1px solid var(--color-border-light); font-size:14px; }
.requisites-table tr:nth-child(even){ background:var(--color-bg-alt); }
.requisites-table td:first-child{ width:42%; color:var(--color-text-light); }

/* Highlight block */
.info-highlight-block{
  background:rgba(22,143,209,.06);
  border-left:3px solid var(--color-accent);
  padding:18px 20px; border-radius:0 10px 10px 0; margin:22px 0;
}
.info-section-block h2{ position:relative; padding-bottom:10px; margin-bottom:16px; }
.info-section-block h2::after{ content:''; display:block; width:48px; height:3px; background:var(--color-accent); border-radius:2px; margin-top:8px; }

@media(max-width:768px){ .page-hero h1{ font-size:26px; } .page-hero{ padding:28px 0; } }

/* ============ BUTIK FISH — guarantee readable text on dark cards ============ */
.info-rika-card--accent,
.info-rika-card--accent-full{ color:#fff; }
.info-rika-card--accent h2, .info-rika-card--accent h3, .info-rika-card--accent h4,
.info-rika-card--accent-full h2, .info-rika-card--accent-full h3, .info-rika-card--accent-full h4{ color:#fff !important; }
.info-rika-card--accent p, .info-rika-card--accent li, .info-rika-card--accent span, .info-rika-card--accent strong,
.info-rika-card--accent-full p, .info-rika-card--accent-full li, .info-rika-card--accent-full span{ color:rgba(255,255,255,.88) !important; }
.info-rika-card--accent .info-warranty-service{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:14px 16px; }
.info-rika-card--accent .info-rika-list--accent li::before{ color:var(--color-accent-light) !important; }
/* Photo placeholder: brand graphite with visible blue icon */
.info-photo-placeholder{ background:linear-gradient(135deg,#1E2526,#2D3436) !important; color:var(--color-accent) !important; }
.info-photo-placeholder svg{ color:var(--color-accent) !important; opacity:.9; }

/* ============ BUTIK FISH v4.5 — readability + de-templating ============ */
/* Contact card icons: bright on graphite */
.info-card-icon svg{ color:#fff !important; stroke:#fff !important; }
.info-card{ position:relative; overflow:hidden; }
.info-card::before{ content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--color-accent),var(--color-accent-light)); }

/* CTA bar buttons readable on graphite */
.info-cta-bar .btn-primary{ background:var(--color-accent) !important; color:#fff !important; }
.info-cta-bar .btn-primary:hover{ background:var(--color-accent-hover) !important; }
.info-cta-bar .btn-outline{ background:transparent !important; border:2px solid rgba(255,255,255,.55) !important; color:#fff !important; }
.info-cta-bar .btn-outline:hover{ background:#fff !important; color:var(--color-primary-dark) !important; }

/* Messenger row → real branded buttons */
.info-stats-row{ background:linear-gradient(135deg,#1E2526,#2D3436) !important; border-radius:16px; padding:26px 20px !important; gap:16px !important; }
.info-stat{ background:rgba(255,255,255,.05) !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:12px; padding:18px 10px !important; transition:all .25s; }
.info-stat:hover{ background:rgba(22,143,209,.18) !important; border-color:var(--color-accent) !important; transform:translateY(-3px); }
.info-stat-label{ color:#fff !important; font-weight:600; }
.info-stat-num{ filter:saturate(1.1); }

/* Page hero: refined, with bottom wave */
.page-hero{ padding:44px 0 56px !important; }
.page-hero .container{ position:relative; z-index:2; }
.page-hero h1{ display:inline-block; }
.page-hero h1::after{ content:''; display:block; width:54px; height:4px; border-radius:2px; background:var(--color-accent); margin-top:14px; }
.page-hero::before{ content:''; position:absolute; left:0; right:0; bottom:-1px; height:46px; background-repeat:no-repeat; background-size:cover; background-position:center top;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0,40 C240,75 480,5 720,28 C960,52 1200,8 1440,34 L1440,60 L0,60 Z'/%3E%3C/svg%3E"); }

/* Contacts map */
.info-map-wrap{ margin-top:28px; border-radius:16px; overflow:hidden; border:1px solid var(--color-border-light); box-shadow:0 10px 30px rgba(0,0,0,.08); }
.info-map-wrap iframe{ display:block; width:100%; border:0; filter:grayscale(.1); }

/* Page hero: full-width banner, no borders/box */
.page-hero{ border:none !important; border-radius:0 !important; box-shadow:none !important; width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
.page-content-section{ overflow:hidden; }