/* namu.style - Blobitecture Botanical */
/* Colors: #E0A8A0, #7AA890, #A89880, #FFFFFF, #F0E8E0, #E0E8E4, #E4EEF0, #6A7A70, #1A2A20 */
/* Fonts: Space Grotesk, Outfit */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: 'Outfit', sans-serif;
    color: #1A2A20;
    background: linear-gradient(160deg, #E4EEF0 0%, #F0E8E0 50%, #E0E8E4 100%);
    min-height: 100vh;
    overflow-x: hidden;
}

.scene {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 80px 40px;
    overflow: hidden;
}

.scene--hero { min-height: 100vh; }
.scene--footer { min-height: 30vh; justify-content: center; }

.scene__text {
    max-width: 480px;
    position: relative;
    z-index: 5;
}

.scene__text--left { margin-right: auto; margin-left: 8%; }
.scene__text--right { margin-left: auto; margin-right: 8%; }

.blob {
    position: absolute;
    border-radius: 50% 40% 60% 45% / 55% 50% 45% 50%;
    z-index: 1;
}

.blob--hero {
    width: 320px; height: 320px;
    left: 15%; top: 50%; transform: translateY(-50%);
    background: #7AA890; opacity: 0.08;
    animation: blobPulse 6s ease-in-out infinite;
}

.blob--accent {
    width: 260px; height: 260px;
    right: 10%; top: 30%;
    background: #E0A8A0; opacity: 0.1;
    border-radius: 45% 55% 50% 40% / 50% 45% 55% 45%;
    animation: blobPulse 7s ease-in-out 1s infinite;
}

.blob--sage {
    width: 280px; height: 280px;
    left: 12%; top: 40%;
    background: #7AA890; opacity: 0.08;
    border-radius: 55% 45% 40% 60% / 45% 55% 50% 50%;
    animation: blobPulse 8s ease-in-out 2s infinite;
}

.blob--pink {
    width: 240px; height: 240px;
    right: 15%; top: 35%;
    background: #E0A8A0; opacity: 0.1;
    border-radius: 40% 60% 55% 45% / 50% 40% 55% 50%;
    animation: blobPulse 6s ease-in-out 0.5s infinite;
}

.display-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(2.5rem, 6vw, 5rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #1A2A20;
    margin-bottom: 16px;
}

.section-heading {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(1.8rem, 4vw, 3rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #1A2A20;
    margin-bottom: 16px;
}

.body-text {
    font-family: 'Outfit', sans-serif;
    font-size: clamp(0.95rem, 1.1vw, 1.15rem);
    font-weight: 300;
    line-height: 1.8;
    color: #6A7A70;
}

.footer-text {
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    color: #A89880;
    text-align: center;
    width: 100%;
}

.scene-reveal {
    opacity: 0; transform: translateY(20px);
    transition: opacity 1s ease, transform 1s ease;
}
.scene-reveal.visible { opacity: 1; transform: translateY(0); }

@keyframes blobPulse {
    0%, 100% { transform: scale(1) translateY(-50%); }
    50% { transform: scale(1.03) translateY(-50%); }
}

@media (max-width: 768px) {
    .scene__text--left, .scene__text--right { margin: 0 auto; }
    .scene { padding: 60px 20px; }
    .blob { display: none; }
}
