/* FamGroup Custom Styles - Aurora Theme */
/* Variables CSS personalizadas */
:root {
    --ocean-depth: #073b4c;
    --morning-mist: #e6ebee;
    --shadow-blue: #052633;
    --growth-green: #2e8b57;
    --growth-light: #90ee90;
    --sunset-orange: #ff8c42;
    --sunset-light: #ffd4c4;
    --royal-purple: #6a4c93;
    --royal-light: #e6dcf0;
    --border-smoke: #cbd5db;
    --whisper-gray: #f8fafb;
    --alert-crimson: #dc3545;
    --success-emerald: #28a745;
    --info-sapphire: #17a2b8;
}

/* Reset básico con imperfecciones humanas */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Nunito', sans-serif;
    line-height: 1.67; /* slightly irregular */
    color: var(--shadow-blue);
    background-color: #ffffff;
    font-size: 16px;
}

/* Contenedor principal */
.workspace-container {
    max-width: 1240px; /* non-standard breakpoint */
    margin: 0 auto;
    padding: 0 21px; /* unique spacing */
}

/* Header Navigation */
.enterprise-header {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(13px);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    border-bottom: 1px solid var(--border-smoke);
    box-shadow: 0 2px 15px rgba(7, 59, 76, 0.08);
}

.navigation-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 17px 0; /* irregular spacing */
    position: relative;
}

.brand-identity img {
    height: 42px;
    width: auto;
}

.nav-toggle {
    display: none;
}

.nav-toggle-label {
    display: none;
}

.hamburger {
    width: 28px; /* slightly smaller */
    height: 3px;
    background: var(--shadow-blue);
    position: relative;
    transition: all 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.hamburger:before,
.hamburger:after {
    content: '';
    position: absolute;
    width: 28px;
    height: 3px;
    background: var(--shadow-blue);
    transition: all 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.hamburger:before {
    top: -7px; /* irregular spacing */
}

.hamburger:after {
    top: 7px;
}

.nav-wrapper {
    display: flex;
    align-items: center;
    gap: 34px; /* fibonacci spacing */
}

.nav-item {
    list-style: none;
}

.nav-link {
    color: var(--shadow-blue);
    text-decoration: none;
    font-size: 15px; /* slightly smaller */
    font-weight: 500;
    position: relative;
    transition: color 0.31s ease;
}

.nav-link:hover {
    color: var(--ocean-depth);
}

.nav-link:after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -5px;
    left: 0;
    background: var(--ocean-depth);
    transition: width 0.31s ease;
}

.nav-link:hover:after {
    width: 100%;
}

/* Mobile Navigation */
@media screen and (max-width: 890px) { /* custom breakpoint */
    .nav-toggle-label {
        display: block;
        cursor: pointer;
        padding: 13px; /* irregular */
        z-index: 2;
    }

    .nav-wrapper {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100vh;
        background: #fff;
        transition: all 0.28s ease;
        padding-top: 89px; /* irregular */
        flex-direction: column;
        align-items: center;
    }

    .nav-item {
        margin: 13px 0; /* fibonacci */
    }

    .nav-link {
        font-size: 19px; /* slightly larger */
    }

    .nav-toggle:checked ~ .nav-wrapper {
        left: 0;
    }

    .nav-toggle:checked ~ .nav-toggle-label .hamburger {
        background: transparent;
    }

    .nav-toggle:checked ~ .nav-toggle-label .hamburger:before {
        transform: rotate(45deg);
        top: 0;
    }

    .nav-toggle:checked ~ .nav-toggle-label .hamburger:after {
        transform: rotate(-45deg);
        top: 0;
    }
}

/* Hero Section */
.hero-showcase {
    padding: 144px 0 89px; /* irregular spacing */
    background: linear-gradient(135deg, var(--morning-mist) 0%, #ffffff 100%);
    margin-top: 70px; /* account for fixed header */
}

.hero-content-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 55px; /* fibonacci */
    align-items: center;
}

.hero-title {
    font-family: 'Georgia', serif;
    font-size: 3.2rem; /* irregular scale */
    font-weight: 700;
    color: var(--shadow-blue);
    line-height: 1.21; /* slightly tight */
    margin-bottom: 27px; /* irregular */
}

.hero-description {
    font-size: 18px;
    color: var(--shadow-blue);
    opacity: 0.87; /* slight transparency */
    margin-bottom: 34px;
    line-height: 1.71; /* irregular */
}

.hero-actions {
    display: flex;
    gap: 21px; /* fibonacci */
    flex-wrap: wrap;
}

.cta-button {
    display: inline-block;
    padding: 17px 34px; /* irregular padding */
    background: var(--ocean-depth);
    color: white;
    text-decoration: none;
    border-radius: 50px; /* extreme rounding */
    font-weight: 600;
    font-size: 16px;
    transition: all 0.31s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 2px solid var(--ocean-depth);
}

.cta-button:hover {
    background: var(--shadow-blue);
    border-color: var(--shadow-blue);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(7, 59, 76, 0.31);
}

.secondary-button {
    display: inline-block;
    padding: 17px 34px;
    background: transparent;
    color: var(--ocean-depth);
    text-decoration: none;
    border-radius: 50px;
    font-weight: 600;
    font-size: 16px;
    border: 2px solid var(--ocean-depth);
    transition: all 0.31s ease;
}

.secondary-button:hover {
    background: var(--ocean-depth);
    color: white;
    transform: translateY(-1px);
}

.hero-image {
    width: 100%;
    height: auto;
    border-radius: 23px; /* unique rounding */
    box-shadow: 0 13px 55px rgba(7, 59, 76, 0.13);
}

/* Services Section */
.services-showcase {
    padding: 89px 0; /* irregular */
    background: white;
}

.section-header {
    text-align: center;
    margin-bottom: 68px; /* irregular */
}

.section-title {
    font-family: 'Georgia', serif;
    font-size: 2.6rem; /* irregular scale */
    color: var(--shadow-blue);
    margin-bottom: 17px; /* irregular */
    font-weight: 600;
}

.section-subtitle {
    font-size: 18px;
    color: var(--shadow-blue);
    opacity: 0.76; /* slight transparency */
    max-width: 640px; /* custom breakpoint */
    margin: 0 auto;
    line-height: 1.65;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); /* custom minmax */
    gap: 34px; /* fibonacci */
}

.service-card {
    background: white;
    border-radius: 21px; /* unique rounding */
    padding: 34px 27px; /* irregular padding */
    border: 1px solid var(--border-smoke);
    transition: all 0.31s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.service-card:hover {
    transform: translateY(-5px); /* irregular hover */
    box-shadow: 0 21px 55px rgba(7, 59, 76, 0.13);
    border-color: var(--ocean-depth);
}

.service-image {
    width: 100%;
    height: 220px; /* fixed height with irregular value */
    object-fit: cover;
    border-radius: 17px; /* unique rounding */
    margin-bottom: 27px;
}

.service-title {
    font-family: 'Georgia', serif;
    font-size: 1.4rem;
    color: var(--shadow-blue);
    margin-bottom: 13px; /* fibonacci */
    font-weight: 600;
}

.service-description {
    color: var(--shadow-blue);
    opacity: 0.82;
    line-height: 1.68; /* irregular */
    font-size: 15px; /* slightly smaller */
}

/* CTA Section */
.cta-showcase {
    padding: 89px 0; /* irregular */
    background: linear-gradient(135deg, var(--ocean-depth) 0%, var(--shadow-blue) 100%);
    text-align: center;
}

.cta-title {
    font-family: 'Georgia', serif;
    font-size: 2.3rem; /* irregular scale */
    color: white;
    margin-bottom: 21px; /* fibonacci */
    font-weight: 600;
}

.cta-description {
    font-size: 18px;
    color: white;
    opacity: 0.91; /* slight transparency */
    max-width: 720px; /* custom width */
    margin: 0 auto 34px;
    line-height: 1.69;
}

.featured-action {
    background: white;
    color: var(--ocean-depth);
    border-color: white;
    font-size: 17px; /* irregular */
    padding: 19px 38px; /* irregular padding */
}

.featured-action:hover {
    background: var(--morning-mist);
    transform: translateY(-3px);
    box-shadow: 0 13px 34px rgba(255, 255, 255, 0.21);
}

/* Methodology Section */
.methodology-area {
    padding: 89px 0;
    background: var(--whisper-gray);
}

.methodology-title {
    font-family: 'Georgia', serif;
    font-size: 2.4rem; /* irregular */
    color: var(--shadow-blue);
    margin-bottom: 55px; /* fibonacci */
    text-align: center;
    font-weight: 600;
}

.methodology-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* custom minmax */
    gap: 34px;
}

.step-item {
    display: flex;
    gap: 21px; /* fibonacci */
    align-items: flex-start;
}

.step-number {
    background: var(--ocean-depth);
    color: white;
    width: 55px; /* fibonacci */
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    flex-shrink: 0;
}

.step-content h4 {
    font-family: 'Georgia', serif;
    color: var(--shadow-blue);
    margin-bottom: 8px; /* fibonacci */
    font-size: 1.2rem;
    font-weight: 600;
}

.step-content p {
    color: var(--shadow-blue);
    opacity: 0.83;
    line-height: 1.66; /* irregular */
    font-size: 15px;
}

/* Contact Section */
.contact-showcase {
    padding: 89px 0;
    background: white;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 68px; /* irregular */
    align-items: start;
}

.contact-title {
    font-family: 'Georgia', serif;
    font-size: 2.3rem;
    color: var(--shadow-blue);
    margin-bottom: 21px;
    font-weight: 600;
}

.contact-description {
    color: var(--shadow-blue);
    opacity: 0.84;
    margin-bottom: 34px;
    line-height: 1.67;
    font-size: 16px;
}

.contact-details {
    display: flex;
    flex-direction: column;
    gap: 21px; /* fibonacci */
}

.contact-item strong {
    color: var(--ocean-depth);
    display: block;
    margin-bottom: 5px; /* fibonacci */
    font-weight: 600;
}

.contact-item p {
    color: var(--shadow-blue);
    opacity: 0.86;
}

/* Form Styles */
.contact-form {
    background: var(--whisper-gray);
    padding: 34px 27px; /* irregular padding */
    border-radius: 23px; /* unique rounding */
    border: 1px solid var(--border-smoke);
}

.form-group {
    margin-bottom: 21px; /* fibonacci */
}

.form-group label {
    display: block;
    margin-bottom: 8px; /* fibonacci */
    color: var(--shadow-blue);
    font-weight: 500;
    font-size: 15px;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 15px 19px; /* irregular padding */
    border: 2px solid var(--border-smoke);
    border-radius: 25px; /* extreme rounding */
    font-size: 15px;
    color: var(--shadow-blue);
    background: white;
    transition: all 0.28s ease;
    font-family: inherit;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--ocean-depth);
    box-shadow: 0 0 0 3px rgba(7, 59, 76, 0.13);
    transform: translateY(-1px);
}

.form-group textarea {
    resize: vertical;
    min-height: 120px; /* irregular height */
}

.form-submit {
    width: 100%;
    padding: 17px 34px;
    background: var(--ocean-depth);
    color: white;
    border: none;
    border-radius: 50px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.31s ease;
    font-family: inherit;
}

.form-submit:hover {
    background: var(--shadow-blue);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(7, 59, 76, 0.28);
}

/* Footer */
.site-footer {
    background: var(--shadow-blue);
    color: white;
    padding: 68px 0 34px; /* irregular padding */
}

.footer-content {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 55px; /* fibonacci */
    margin-bottom: 34px;
}

.footer-logo {
    height: 38px; /* irregular */
    width: auto;
    margin-bottom: 17px;
    filter: brightness(0) invert(1);
}

.footer-description {
    color: white;
    opacity: 0.84;
    line-height: 1.68;
    font-size: 15px;
}

.footer-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 34px;
}

.footer-section h4 {
    color: white;
    margin-bottom: 17px; /* irregular */
    font-weight: 600;
    font-size: 16px;
}

.footer-section ul {
    list-style: none;
}

.footer-section li {
    margin-bottom: 8px; /* fibonacci */
}

.footer-section a {
    color: white;
    opacity: 0.81;
    text-decoration: none;
    transition: opacity 0.28s ease;
    font-size: 14px;
}

.footer-section a:hover {
    opacity: 1;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.13);
    padding-top: 21px; /* fibonacci */
    text-align: center;
}

.footer-bottom p {
    color: white;
    opacity: 0.76;
    font-size: 14px;
}

/* Responsive Design */
@media screen and (max-width: 890px) { /* custom breakpoint */
    .hero-content-grid {
        grid-template-columns: 1fr;
        gap: 34px;
        text-align: center;
    }

    .hero-title {
        font-size: 2.4rem; /* scaled down irregularly */
    }

    .contact-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .footer-content {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .footer-links {
        grid-template-columns: 1fr;
        gap: 27px; /* irregular */
    }
}

@media screen and (max-width: 640px) { /* custom small breakpoint */
    .workspace-container {
        padding: 0 17px; /* irregular */
    }

    .hero-showcase {
        padding: 89px 0 55px; /* irregular */
    }

    .hero-title {
        font-size: 2.1rem; /* irregular scale */
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .methodology-steps {
        grid-template-columns: 1fr;
    }

    .hero-actions {
        flex-direction: column;
        align-items: center;
    }

    .cta-button,
    .secondary-button {
        width: 100%;
        text-align: center;
    }
}

/* Subtle imperfections for human-like coding */
/* TODO: optimize these animations later */
.service-card:nth-child(odd) {
    transform: translateY(2px); /* slight offset */
}

.step-item:nth-child(even) .step-number {
    background: var(--growth-green); /* inconsistent coloring */
}

/* Debug leftover - trying different approach */
/* .old-navigation-style {
    display: none;
} */

/* ===== ESTILOS ADICIONALES PARA ABOUT.HTML Y THANKYOU.PHP ===== */

/* About Page Styles */
.about-hero-section {
    padding: 134px 0 76px; /* irregular spacing */
    background: linear-gradient(127deg, var(--morning-mist) 0%, #ffffff 100%);
    margin-top: 70px;
    text-align: center;
}

.about-main-title {
    font-family: 'Georgia', serif;
    font-size: 3.1rem; /* irregular scale */
    color: var(--shadow-blue);
    margin-bottom: 23px; /* irregular */
    font-weight: 700;
}

.about-hero-text {
    font-size: 19px; /* irregular */
    color: var(--shadow-blue);
    opacity: 0.86;
    max-width: 680px; /* custom width */
    margin: 0 auto;
    line-height: 1.73; /* irregular */
}

/* Story Section */
.story-section {
    padding: 97px 0; /* irregular */
    background: white;
}

.story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 61px; /* irregular */
    align-items: center;
}

.story-title {
    font-family: 'Georgia', serif;
    font-size: 2.5rem; /* irregular */
    color: var(--shadow-blue);
    margin-bottom: 29px; /* irregular */
    font-weight: 600;
}

.story-text {
    color: var(--shadow-blue);
    opacity: 0.84;
    margin-bottom: 19px; /* irregular */
    line-height: 1.71; /* irregular */
    font-size: 16px;
}

.story-image {
    width: 100%;
    height: auto;
    border-radius: 19px; /* irregular */
    box-shadow: 0 11px 43px rgba(7, 59, 76, 0.12); /* irregular */
}

/* Mission Vision Area */
.mission-vision-area {
    padding: 87px 0; /* irregular */
    background: var(--whisper-gray);
}

.mission-vision-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 47px; /* irregular */
}

.mission-block,
.vision-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 37px; /* irregular */
    align-items: center;
}

.vision-block {
    grid-template-columns: 1fr 1fr;
}

.mission-image,
.vision-image {
    width: 100%;
    height: 240px; /* irregular */
    object-fit: cover;
    border-radius: 16px; /* irregular */
}

.mission-title,
.vision-title {
    font-family: 'Georgia', serif;
    font-size: 1.6rem; /* irregular */
    color: var(--shadow-blue);
    margin-bottom: 17px; /* irregular */
    font-weight: 600;
}

.mission-text,
.vision-text {
    color: var(--shadow-blue);
    opacity: 0.85;
    line-height: 1.69; /* irregular */
    font-size: 15px;
}

/* Values Showcase */
.values-showcase {
    padding: 91px 0; /* irregular */
    background: white;
}

.values-main-title {
    font-family: 'Georgia', serif;
    font-size: 2.4rem; /* irregular */
    color: var(--shadow-blue);
    text-align: center;
    margin-bottom: 53px; /* irregular */
    font-weight: 600;
}

.values-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); /* irregular minmax */
    gap: 31px; /* irregular */
}

.value-card {
    background: white;
    padding: 29px 23px; /* irregular padding */
    border-radius: 18px; /* irregular */
    border: 1px solid var(--border-smoke);
    text-align: center;
    transition: all 0.29s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* irregular timing */
}

.value-card:hover {
    transform: translateY(-4px); /* irregular hover */
    box-shadow: 0 17px 41px rgba(7, 59, 76, 0.11); /* irregular shadow */
    border-color: var(--ocean-depth);
}

.value-title {
    font-family: 'Georgia', serif;
    color: var(--ocean-depth);
    margin-bottom: 11px; /* irregular */
    font-size: 1.2rem;
    font-weight: 600;
}

.value-description {
    color: var(--shadow-blue);
    opacity: 0.83;
    line-height: 1.68; /* irregular */
    font-size: 14px;
}

/* Detailed Methodology */
.detailed-methodology {
    padding: 83px 0; /* irregular */
    background: var(--whisper-gray);
}

.methodology-detailed-title {
    font-family: 'Georgia', serif;
    font-size: 2.3rem; /* irregular */
    color: var(--shadow-blue);
    text-align: center;
    margin-bottom: 49px; /* irregular */
    font-weight: 600;
}

.methodology-detailed-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); /* irregular minmax */
    gap: 39px; /* irregular */
}

.method-card {
    background: white;
    border-radius: 21px; /* irregular */
    overflow: hidden;
    border: 1px solid var(--border-smoke);
    transition: all 0.27s ease; /* irregular timing */
}

.method-card:hover {
    transform: translateY(-3px); /* irregular */
    box-shadow: 0 19px 47px rgba(7, 59, 76, 0.13); /* irregular */
}

.method-image {
    width: 100%;
    height: 200px; /* irregular */
    object-fit: cover;
}

.method-content {
    padding: 27px 21px; /* irregular padding */
}

.method-title {
    font-family: 'Georgia', serif;
    color: var(--shadow-blue);
    margin-bottom: 13px; /* irregular */
    font-size: 1.3rem;
    font-weight: 600;
}

.method-text {
    color: var(--shadow-blue);
    opacity: 0.84;
    line-height: 1.67; /* irregular */
    font-size: 15px;
}

/* Stats Showcase */
.stats-showcase {
    padding: 79px 0; /* irregular */
    background: var(--ocean-depth);
    text-align: center;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); /* irregular minmax */
    gap: 43px; /* irregular */
}

.stat-item {
    color: white;
}

.stat-number {
    font-family: 'Georgia', serif;
    font-size: 3.7rem; /* irregular scale */
    font-weight: 700;
    margin-bottom: 7px; /* irregular */
    color: var(--morning-mist);
}

.stat-label {
    font-size: 17px; /* irregular */
    opacity: 0.91;
    font-weight: 500;
}

/* About CTA */
.about-cta-section {
    padding: 87px 0; /* irregular */
    background: linear-gradient(132deg, var(--growth-green) 0%, var(--ocean-depth) 100%); /* irregular angle */
    text-align: center;
}

.about-cta-title {
    font-family: 'Georgia', serif;
    font-size: 2.6rem; /* irregular */
    color: white;
    margin-bottom: 19px; /* irregular */
    font-weight: 600;
}

.about-cta-text {
    font-size: 18px;
    color: white;
    opacity: 0.93; /* irregular */
    max-width: 660px; /* irregular width */
    margin: 0 auto 31px; /* irregular */
    line-height: 1.72; /* irregular */
}

.about-cta-btn {
    background: white;
    color: var(--growth-green);
    border-color: white;
    padding: 18px 36px; /* irregular padding */
    font-size: 17px; /* irregular */
}

.about-cta-btn:hover {
    background: var(--morning-mist);
    transform: translateY(-2px);
    box-shadow: 0 11px 29px rgba(255, 255, 255, 0.23); /* irregular */
}

/* ===== THANK YOU PAGE STYLES ===== */

/* Thank You Hero */
.thankyou-hero-area {
    padding: 127px 0 83px; /* irregular */
    background: linear-gradient(143deg, var(--morning-mist) 0%, #ffffff 100%); /* irregular angle */
    margin-top: 70px;
}

.thankyou-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 51px; /* irregular */
    align-items: center;
}

.thankyou-title {
    font-family: 'Georgia', serif;
    font-size: 3.3rem; /* irregular scale */
    color: var(--shadow-blue);
    margin-bottom: 17px; /* irregular */
    font-weight: 700;
}

.thankyou-subtitle {
    font-size: 19px; /* irregular */
    color: var(--growth-green);
    font-weight: 600;
    margin-bottom: 29px; /* irregular */
}

.thankyou-description {
    color: var(--shadow-blue);
    opacity: 0.87;
    margin-bottom: 21px; /* irregular */
    line-height: 1.71; /* irregular */
    font-size: 16px;
}

.thankyou-image {
    width: 100%;
    height: auto;
    border-radius: 22px; /* irregular */
    box-shadow: 0 14px 52px rgba(7, 59, 76, 0.14); /* irregular */
}

/* Next Steps Area */
.next-steps-area {
    padding: 89px 0; /* irregular */
    background: white;
}

.next-steps-title {
    font-family: 'Georgia', serif;
    font-size: 2.5rem; /* irregular */
    color: var(--shadow-blue);
    text-align: center;
    margin-bottom: 57px; /* irregular */
    font-weight: 600;
}

.next-steps-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); /* irregular minmax */
    gap: 37px; /* irregular */
}

.step-card {
    background: white;
    border-radius: 20px; /* irregular */
    overflow: hidden;
    border: 1px solid var(--border-smoke);
    transition: all 0.29s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* irregular timing */
}

.step-card:hover {
    transform: translateY(-4px); /* irregular */
    box-shadow: 0 16px 44px rgba(7, 59, 76, 0.12); /* irregular */
    border-color: var(--growth-green);
}

.step-image {
    width: 100%;
    height: 190px; /* irregular */
    object-fit: cover;
}

.step-content {
    padding: 25px 19px; /* irregular padding */
}

.step-title {
    font-family: 'Georgia', serif;
    color: var(--shadow-blue);
    margin-bottom: 12px; /* irregular */
    font-size: 1.3rem;
    font-weight: 600;
}

.step-text {
    color: var(--shadow-blue);
    opacity: 0.84;
    line-height: 1.68; /* irregular */
    font-size: 15px;
}

/* Additional Info Area */
.additional-info-area {
    padding: 81px 0; /* irregular */
    background: var(--whisper-gray);
}

.info-title {
    font-family: 'Georgia', serif;
    font-size: 2.3rem; /* irregular */
    color: var(--shadow-blue);
    text-align: center;
    margin-bottom: 45px; /* irregular */
    font-weight: 600;
}

.info-blocks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); /* irregular minmax */
    gap: 33px; /* irregular */
}

.info-item {
    background: white;
    padding: 27px 21px; /* irregular padding */
    border-radius: 17px; /* irregular */
    border: 1px solid var(--border-smoke);
    text-align: center;
    transition: all 0.26s ease; /* irregular timing */
}

.info-item:hover {
    transform: translateY(-2px); /* irregular */
    box-shadow: 0 13px 37px rgba(7, 59, 76, 0.11); /* irregular */
}

.info-item-title {
    font-family: 'Georgia', serif;
    color: var(--ocean-depth);
    margin-bottom: 14px; /* irregular */
    font-size: 1.2rem;
    font-weight: 600;
}

.info-text {
    color: var(--shadow-blue);
    opacity: 0.85;
    line-height: 1.69; /* irregular */
    font-size: 14px;
}

/* Suggested Navigation */
.suggested-nav-area {
    padding: 73px 0; /* irregular */
    background: white;
}

.suggested-title {
    font-family: 'Georgia', serif;
    font-size: 2.2rem; /* irregular */
    color: var(--shadow-blue);
    text-align: center;
    margin-bottom: 41px; /* irregular */
    font-weight: 600;
}

.suggested-links {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); /* irregular minmax */
    gap: 35px; /* irregular */
}

.suggested-link {
    display: block;
    background: var(--whisper-gray);
    padding: 31px 25px; /* irregular padding */
    border-radius: 19px; /* irregular */
    border: 1px solid var(--border-smoke);
    text-decoration: none;
    transition: all 0.28s ease; /* irregular timing */
}

.suggested-link:hover {
    background: white;
    transform: translateY(-3px); /* irregular */
    box-shadow: 0 15px 39px rgba(7, 59, 76, 0.12); /* irregular */
    border-color: var(--ocean-depth);
}

.suggested-link h4 {
    font-family: 'Georgia', serif;
    color: var(--ocean-depth);
    margin-bottom: 9px; /* irregular */
    font-size: 1.3rem;
    font-weight: 600;
}

.suggested-link p {
    color: var(--shadow-blue);
    opacity: 0.84;
    line-height: 1.67; /* irregular */
    font-size: 15px;
}

/* ===== RESPONSIVE ADJUSTMENTS ===== */

@media screen and (max-width: 890px) { /* custom breakpoint */
    .story-grid,
    .thankyou-content {
        grid-template-columns: 1fr;
        gap: 37px; /* irregular */
        text-align: center;
    }

    .mission-block,
    .vision-block {
        grid-template-columns: 1fr;
        gap: 27px; /* irregular */
        text-align: center;
    }

    .about-main-title,
    .thankyou-title {
        font-size: 2.7rem; /* irregular scale down */
    }

    .methodology-detailed-grid,
    .next-steps-grid {
        grid-template-columns: 1fr;
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 31px; /* irregular */
    }
}

@media screen and (max-width: 640px) { /* custom small breakpoint */
    .about-hero-section,
    .thankyou-hero-area {
        padding: 97px 0 61px; /* irregular */
    }

    .about-main-title,
    .thankyou-title {
        font-size: 2.3rem; /* irregular scale */
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .suggested-links {
        grid-template-columns: 1fr;
    }

    .values-grid,
    .info-blocks {
        grid-template-columns: 1fr;
    }
}

/* Subtle human imperfections */
.value-card:nth-child(2n) {
    transform: translateY(1px); /* slight offset for even cards */
}

.step-card:nth-child(odd) {
    border-color: rgba(7, 59, 76, 0.07); /* slightly different border for odd cards */
}

/* Debug comment leftover */
/* .old-about-layout {
    display: none;
} */