/* ===  Kanzlei Toy – Modern Theme  === */

:root {
    --surface: #f7f4ee;
    --surface-strong: #ffffff;
    --ink: #1a2332;
    --ink-soft: #3d4f5f;
    --brand: #0f766e;
    --brand-strong: #0b5e58;
    --light: #f0fdfa;
    --line: rgba(15, 118, 110, 0.18);
    --shadow-soft: 0 12px 32px rgba(25, 44, 52, 0.10);
    --radius-lg: 18px;
}

/* ── Base ── */

html, body {
    background:
        radial-gradient(circle at 15% 10%, rgba(245, 158, 11, 0.12), transparent 34%),
        radial-gradient(circle at 85% 5%, rgba(15, 118, 110, 0.12), transparent 38%),
        var(--surface);
    color: var(--ink);
}

body { line-height: 1.65; }

/* ── Navigation ── */

.foFqY.css-q2nxa6,
.G4Yk_.ny2yc.SLguW.uOhr5 {
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(15, 118, 110, 0.08);
}

/* Logo was designed white-on-transparent for the original black header */
.AKcQs img,
.foFqY .zofC1 img {
    filter: brightness(0) opacity(0.82);
}

.d6OwN,
.L8XKw {
    color: var(--ink) !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em;
    transition: color 180ms ease;
}

.d6OwN:hover,
.L8XKw:hover,
.lwNfy {
    color: var(--brand) !important;
}

/* ── Sections ── */

.oXRwe {
    border-radius: var(--radius-lg);
    margin: 18px auto;
    overflow: hidden;
    box-shadow: var(--shadow-soft);
}

/* White/light sections */
.css-9s1hn,
.css-zeaaen {
    background-color: var(--surface-strong) !important;
}

/* Dark gradient sections */
.css-q2nxa6 {
    background: linear-gradient(140deg, #0c3547 0%, #145a6b 58%, #1a7a8c 100%) !important;
}

.css-qah884 {
    background: linear-gradient(140deg, #0c3547 0%, #145a6b 58%, #1a7a8c 100%) !important;
}

/* ── Image Overlays – neutral, no color tint ── */

.css-1jyyyen {
    opacity: 1 !important;
}

.css-1g64zgr {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.30), rgba(0, 0, 0, 0.10)) !important;
}

.css-1luggn5 {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.08)) !important;
}

.css-1xo07ii {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0.12)) !important;
}

/* Standalone images (not in covers) should never have an overlay */
section:not([data-block-type="cover"]) .qTwpq {
    opacity: 0 !important;
}

/* ── Typography – Light sections ── */

h1, h2, h3 {
    color: var(--ink);
    font-weight: 600 !important;
    letter-spacing: 0.01em;
}

p, li {
    color: var(--ink-soft);
}

/* ── Typography – Cover / Dark sections ── */

[data-block-type="cover"].css-qah884 h1,
[data-block-type="cover"].css-qah884 h2,
[data-block-type="cover"].css-qah884 h3,
[data-block-type="cover"].css-qah884 h4,
[data-block-type="cover"].css-qah884 p,
[data-block-type="cover"].css-qah884 li,
[data-block-type="cover"].css-qah884 strong,
[data-block-type="cover"].css-q2nxa6 h1,
[data-block-type="cover"].css-q2nxa6 h2,
[data-block-type="cover"].css-q2nxa6 h3,
[data-block-type="cover"].css-q2nxa6 h4,
[data-block-type="cover"].css-q2nxa6 p,
[data-block-type="cover"].css-q2nxa6 li,
[data-block-type="cover"].css-q2nxa6 strong {
    color: var(--light) !important;
    text-shadow: 0 2px 14px rgba(5, 18, 24, 0.40);
}

.css-qah884 h1,
.css-qah884 h2,
.css-qah884 h3,
.css-qah884 p,
.css-qah884 li,
.css-qah884 strong {
    color: var(--light) !important;
    text-shadow: 0 2px 14px rgba(5, 18, 24, 0.40);
}

section.css-q2nxa6 h1,
section.css-q2nxa6 h2,
section.css-q2nxa6 h3,
section.css-q2nxa6 p,
section.css-q2nxa6 li,
section.css-q2nxa6 strong {
    color: var(--light) !important;
    text-shadow: 0 2px 14px rgba(5, 18, 24, 0.40);
}

/* override for css-1lrl7ql (already on some dark-section text) */
.css-1lrl7ql h1,
.css-1lrl7ql h2,
.css-1lrl7ql h3,
.css-1lrl7ql h4,
.css-1lrl7ql h5,
.css-1lrl7ql h6,
.css-1lrl7ql p,
.css-1lrl7ql li {
    color: var(--light) !important;
    text-shadow: 0 2px 12px rgba(5, 18, 24, 0.35);
}

/* Hero heading card – stays dark-on-white */
.BBBLo.css-9s1hn {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(8px);
    border-radius: 14px;
}

.BBBLo.css-9s1hn h1,
.BBBLo.css-9s1hn h2,
.BBBLo.css-9s1hn h3,
.BBBLo.css-9s1hn p {
    color: var(--ink) !important;
    text-shadow: none !important;
}

/* Dark heading card – keeps light text */
.BBBLo.css-q2nxa6 {
    background: rgba(12, 53, 71, 0.85) !important;
    backdrop-filter: blur(8px);
    border-radius: 14px;
}

/* ── Spacing ── */

.plfvA,
.voqP8,
.YFaUZ {
    padding: clamp(20px, 3.2vw, 38px);
}

/* ── Images ── */

.rhaBK,
.neGLE {
    border-radius: 14px;
    overflow: hidden;
}

.FHs03 {
    border-radius: 14px;
    overflow: hidden;
}

/* No rounded corners on logo */
.AKcQs .FHs03,
.foFqY .FHs03 {
    border-radius: 0;
}

/* ── Buttons ── */

.U1eE3 {
    border: none !important;
    border-radius: 999px !important;
    transform: translateY(0);
    transition: transform 220ms ease, box-shadow 220ms ease;
}

.css-1fnmwxk,
.css-xi3bv8,
.css-1pl69kz {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-strong) 100%) !important;
    border-radius: 999px !important;
    box-shadow: 0 8px 20px rgba(11, 94, 88, 0.22);
}

.U1eE3:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(11, 94, 88, 0.26) !important;
}

/* Buttons on dark sections – add subtle glow for visibility */
.css-qah884 .U1eE3,
section.css-q2nxa6 .U1eE3 {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.css-qah884 .U1eE3:hover,
section.css-q2nxa6 .U1eE3:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.30), 0 0 0 1px rgba(255, 255, 255, 0.18) !important;
}

.pSsxA {
    color: #ecfeff !important;
    border-color: transparent !important;
    font-weight: 500;
}

/* ── Footer ── */

footer.WbFOy {
    border-top: 1px solid var(--line);
    padding-top: 12px;
}

.css-zeaaen .L8XKw {
    color: var(--ink-soft) !important;
}

.css-zeaaen .L8XKw:hover {
    color: var(--brand) !important;
}

/* ── Utility ── */

.text-align-center {
    text-wrap: balance;
}

/* ── Responsive ── */

@media (max-width: 900px) {
    .oXRwe {
        margin: 10px 0;
        border-radius: 12px;
    }

    .plfvA,
    .voqP8,
    .YFaUZ {
        padding: 16px;
    }

    .d6OwN,
    .L8XKw {
        font-size: 0.96rem;
    }
}

/* ── Animation ── */

@media (prefers-reduced-motion: no-preference) {
    .oXRwe,
    .U1eE3,
    .foFqY {
        animation: softReveal 520ms ease both;
    }
}

@keyframes softReveal {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}