* { margin: 0; padding: 0; box-sizing: border-box; }
body {
    background: #0d0c0a;
    font-family: Arial, sans-serif;
    color: #f2efe6;
    line-height: 1.6;
    overflow-x: hidden;
}
.bg-pattern {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 15% 20%, rgba(215,180,130,0.05) 0%, transparent 45%),
        radial-gradient(circle at 85% 80%, rgba(180,130,80,0.04) 0%, transparent 50%),
        repeating-linear-gradient(45deg, rgba(255,215,150,0.008) 0px, rgba(255,215,150,0.008) 2px, transparent 2px, transparent 10px);
}
.container { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.section { padding: 80px 0 60px; border-bottom: 1px solid rgba(255,215,150,0.06); }
.section:last-of-type { border-bottom: none; }

.label {
    font-size: 12px; letter-spacing: 4px; text-transform: uppercase;
    color: #b8a48c; margin-bottom: 12px; display: block; font-weight: 400;
}
h1, h2, h3 { font-family: Georgia, 'Times New Roman', serif; font-weight: 700; letter-spacing: -0.02em; }
h1 {
    font-size: clamp(3.2rem, 12vw, 6.8rem);
    line-height: 1.05;
    font-style: italic;
    background: linear-gradient(135deg, #f7efe0 0%, #d4b48c 80%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    margin-bottom: 20px;
}
h2 { font-size: clamp(2.4rem, 5vw, 3.6rem); color: #f2e6d5; margin-bottom: 16px; }
h3 { font-size: 1.5rem; color: #efe6d8; margin-bottom: 8px; }
.subhead { font-size: 1.25rem; color: #c2b3a0; max-width: 680px; font-weight: 300; line-height: 1.7; }
.accent-line { width: 80px; height: 2px; background: linear-gradient(90deg, #d4b48c, transparent); margin: 24px 0 32px; }

/* HERO */
.hero { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: 40px 0; }
.hero__badge {
    display: inline-flex; align-items: center; gap: 12px;
    background: rgba(255,215,150,0.05); backdrop-filter: blur(4px);
    padding: 8px 20px 8px 16px; border-radius: 60px;
    border: 1px solid rgba(255,215,150,0.08); width: fit-content;
    font-size: 14px; color: #dccfc0; margin-bottom: 40px;
}
.hero__badge span { width: 8px; height: 8px; background: #d4b48c; border-radius: 50%; display: inline-block; animation: pulse-dot 2s infinite; }
@keyframes pulse-dot { 0%,100%{opacity:0.3;transform:scale(0.9);} 50%{opacity:1;transform:scale(1.2);} }

.hero__stats { display: flex; gap: 48px; margin-top: 40px; flex-wrap: wrap; }
.stat-item { display: flex; flex-direction: column; }
.stat-number { font-size: 2.8rem; font-weight: 600; font-family: Georgia, 'Times New Roman', serif; color: #f2e6d5; line-height: 1; }
.stat-label { font-size: 13px; text-transform: uppercase; letter-spacing: 2px; color: #8f7e6a; margin-top: 4px; }

.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap: 28px; margin-top: 32px; }
.card {
    background: rgba(255,245,230,0.02); backdrop-filter: blur(4px);
    border: 1px solid rgba(255,215,150,0.06); border-radius: 32px;
    padding: 32px 28px 36px;
    transition: all 0.3s ease;
}
.card:hover { background: rgba(255,245,230,0.06); border-color: rgba(255,215,150,0.18); transform: translateY(-4px); }
.card__icon { font-size: 2.6rem; margin-bottom: 12px; display: block; }
.card p { color: #b7a897; font-weight: 300; font-size: 0.98rem; line-height: 1.6; }

.blockquote {
    background: rgba(255,215,150,0.02);
    border-left: 3px solid #d4b48c;
    padding: 36px 40px;
    border-radius: 20px;
    margin: 40px 0 10px;
    font-family: Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 1.7rem;
    line-height: 1.4;
    color: #e8dbc9;
}
.blockquote footer { margin-top: 16px; font-style: normal; font-size: 1rem; font-family: Arial, sans-serif; color: #9a8a78; letter-spacing: 0.5px; }

/* SVG-иллюстрации */
.illustration {
    border-radius: 28px;
    background: #1a1713;
    border: 1px solid rgba(255,215,150,0.06);
    width: 100%;
    height: auto;
    display: block;
    margin: 20px 0 10px;
}

.mosaic {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 16px;
    margin: 24px 0 10px;
}
.mosaic-item {
    aspect-ratio: 1/1;
    background: #1a1713;
    border-radius: 24px;
    border: 1px solid rgba(255,215,150,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.6rem;
    color: #857460;
    transition:0.2s;
    overflow: hidden;
}
.mosaic-item:hover { background: #2a231d; border-color: #b8a088; }
.mosaic-item:nth-child(1) { grid-column: span 2; grid-row: span 2; background: #1f1a15; }

.btn {
    display: inline-flex; align-items: center; gap: 12px;
    background: #d4b48c; color: #16120e; font-weight: 600;
    padding: 16px 40px; border-radius: 60px; text-decoration: none;
    font-size: 1rem; letter-spacing: 0.5px; border: none;
    transition: 0.25s ease; margin-top: 12px; cursor: default;
}
.btn:hover { background: #e6caa8; transform: scale(1.02); box-shadow: 0 12px 30px -8px rgba(212,180,140,0.25); }
.btn-ghost { background: transparent; border: 1px solid rgba(255,215,150,0.2); color: #dccfc0; }
.btn-ghost:hover { background: rgba(255,215,150,0.05); border-color: #d4b48c; color: #f2efe6; }
.flex-btns { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }

.footer {
    padding: 40px 0 48px;
    border-top: 1px solid rgba(255,215,150,0.05);
    display: flex; justify-content: space-between; flex-wrap: wrap;
    gap: 20px; color: #706050; font-size: 14px;
}
.footer a { color: #b09a84; text-decoration: none; border-bottom: 1px dotted transparent; transition:0.15s; }
.footer a:hover { border-color: #b09a84; }

.story-text { color: #c8bbaa; font-weight: 300; max-width: 780px; line-height: 1.8; }
.story-text strong { color: #e6d6c0; font-weight: 400; }

@media (max-width:640px) {
    .hero__stats { gap: 24px; }
    .blockquote { font-size: 1.2rem; padding: 24px; }
    .mosaic { grid-template-columns: repeat(2,1fr); }
    .mosaic-item:nth-child(1) { grid-column: span 2; grid-row: span 1; }
    .section { padding: 48px 0 32px; }
}

/* Styles extracted from element attributes; kept after the base rules. */
.local-style-1 { margin-top:48px; }
.local-style-2 { margin-top:50px; }
.local-style-3 { margin-top:12px; }
.local-style-4 { color:#c2b3a0; max-width:640px; font-weight:300; font-size:1.1rem; }
.local-style-5 { padding-top:20px; }
.local-style-6 { font-size:2.2rem; }
.local-style-7 { color:#8f7e6a; margin-top:16px; font-size:13px; letter-spacing:1px; }
.local-style-8 { display:flex; flex-wrap:wrap; gap:30px; margin-top:12px; }
.local-style-9 { flex:1; min-width:240px; }
.local-style-10 { display:flex; gap:32px; margin-top:24px; }
.local-style-11 { color:#d4b48c; font-weight:600; }
.local-style-12 { color:#8f7e6a; }
.local-style-13 { flex:1; min-width:200px; background:rgba(255,215,150,0.02); border-radius:28px; padding:28px 32px; border:1px solid rgba(255,215,150,0.05); }
.local-style-14 { font-size:3.2rem; display:block; }
.local-style-15 { color:#b7a897; font-size:0.95rem; margin-top:8px; }
.local-style-16 { border-bottom:none; padding-bottom:20px; }
.local-style-17 { max-width:700px; }
.local-style-18 { display:flex; gap:24px; flex-wrap:wrap; margin-top:32px; }
.local-style-19 { background:transparent; border:1px solid #d4b48c; color:#dccfc0; cursor:default; }
.local-style-20 { border-color:#4a3f35; cursor:default; }
.local-style-21 { color:#4f4338; }