/* ================= RESPONSIVE GENERAL ================= */

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

img,
video,
canvas,
svg {
    max-width: 100%;
}

/* ================= PANTALLAS MEDIANAS ================= */

@media (max-width: 1180px) {
    .navbar {
        gap: 20px;
    }

    .nav-menu {
        gap: 18px;
    }

    .nav-menu a,
    .nav-dropdown-toggle {
        font-size: 0.88rem;
    }

    .team-profile-card,
    .team-profile-card-reverse {
        grid-template-columns: 1fr;
        gap: 28px;
        min-height: unset;
    }

    .team-profile-card-reverse .team-profile-photo,
    .team-profile-card-reverse .team-profile-content {
        order: initial;
    }

    .team-profile-photo {
        min-height: 420px;
    }

    .team-profile-photo img {
        min-height: 420px;
    }

    .team-profile-content,
    .team-profile-card-reverse .team-profile-content {
        padding: 0;
    }

    .footer-grid {
        grid-template-columns: 1.2fr 1fr 1fr;
    }

    .footer-brand {
        grid-column: 1 / -1;
        max-width: 100%;
    }
}

/* ================= CARRUSEL TABLET ================= */

@media (max-width: 1100px) {
    .area-card {
        flex-basis: calc((100% - 28px) / 2);
    }
}

/* ================= CONTACTO TABLET ================= */

@media (max-width: 1040px) {
    .contact-layout {
        grid-template-columns: 1fr;
        gap: 46px;
        align-items: start;
    }

    .contact-content {
        height: auto;
        display: block;
    }

    .contact-info-list {
        margin-top: 0;
    }

    .contact-content > p {
        max-width: 100%;
    }

    .contact-form-card {
        height: auto;
        min-height: unset;
    }
}

/* ================= TABLET / MENÚ DESPLEGABLE ================= */

@media (max-width: 1024px) {
    .section,
    .services-section,
    .about-hero,
    .mission-hero,
    .plans-hero,
    .support-section {
        padding: 86px 0;
    }

    .site-header {
        overflow: visible;
    }

    .navbar {
        position: relative;
        min-height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 16px;
        padding: 22px 0 18px;
        text-align: center;
    }

    .brand {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        order: 1;
    }

    .brand-logo,
    .brand-logo-im {
        height: 68px;
        width: auto;
        object-fit: contain;
    }

    .navbar > .btn {
        order: 2;
        width: fit-content;
        min-width: 210px;
        max-width: 260px;
        min-height: 50px;
        padding: 0 32px;
        justify-self: center;
        border-radius: 14px;
    }

    .nav-toggle,
    .mobile-menu-toggle {
        position: absolute;
        top: 14px;
        right: 0;
        z-index: 20;
        display: inline-flex;
        margin: 0;
    }

    .nav-menu {
        order: 4;
        width: min(100%, 420px);
        display: none;
        flex: none;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 6px;
        overflow: visible;
        padding: 12px;
        margin-top: 2px;
        border: 1px solid rgba(226, 232, 240, 0.95);
        border-radius: 20px;
        background: #ffffff;
        box-shadow: 0 18px 44px rgba(15, 23, 42, 0.10);
        scrollbar-width: none;
    }

    .nav-menu::-webkit-scrollbar {
        display: none;
    }

    .nav-menu.is-open {
        display: flex;
    }

    .nav-menu a,
    .nav-dropdown-toggle {
        width: 100%;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 11px 13px;
        border-radius: 13px;
        color: #24324a;
        font-size: 0.94rem;
        font-weight: 900;
        text-align: center;
        white-space: normal;
    }

    .nav-menu a:hover,
    .nav-menu a.active,
    .nav-dropdown-toggle:hover {
        color: #2563eb;
        background: rgba(37, 99, 235, 0.08);
    }

    .nav-dropdown {
        width: 100%;
    }

    .nav-dropdown-toggle {
        gap: 8px;
    }

    .nav-dropdown-menu {
        position: static;
        left: auto;
        top: auto;
        min-width: 100%;
        display: none;
        padding: 6px;
        margin-top: 6px;
        border: 0;
        border-radius: 15px;
        background: #f8fafc;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
    }

    .nav-dropdown:hover .nav-dropdown-menu {
        transform: none;
    }

    .nav-dropdown-menu.dropdown-open {
        display: block;
        transform: none;
    }

    .nav-dropdown-menu a {
        min-height: 40px;
        padding: 10px 12px;
        font-size: 0.9rem;
    }

    .hero-section {
        min-height: auto;
        padding: 86px 0;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 54px;
    }

    .hero-content {
        text-align: center;
    }

    .hero-content h1,
    .hero-content p {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-content h1,
    .hero-section .hero-content h1,
    .hero-section .hero-text h1 {
        max-width: min(100%, 12.6ch);
        font-size: clamp(3.2rem, 7.2vw, 4.55rem);
        line-height: 1.03;
        letter-spacing: -0.055em;
        text-wrap: balance;
    }

    .hero-actions {
        justify-content: center;
    }

    .hero-highlights {
        max-width: 760px;
        margin-left: auto;
        margin-right: auto;
    }

    .services-grid,
    .why-grid,
    .tech-grid,
    .testimonials-grid,
    .grid-3,
    .plans-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-grid,
    .support-grid,
    .about-page-layout,
    .mission-page-layout {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .mission-page-visual {
        order: -1;
    }

    .about-page-content,
    .mission-page-content {
        max-width: 100%;
    }

    .about-page-visual img,
    .mission-page-visual img {
        height: 460px;
    }

    .mission-values {
        grid-template-columns: repeat(3, 1fr);
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-bottom-content {
        flex-direction: column;
        justify-content: center;
        text-align: center;
        padding: 22px 0;
    }
}

/* ================= ALIANZAS TABLET ================= */

@media (max-width: 820px) {
    .alliances-section {
        padding: 52px 0 60px;
    }

    .alliances-header {
        margin-bottom: 30px;
    }

    .alliances-header h2 {
        font-size: 2rem;
    }

    .alliances-header p {
        font-size: 1rem;
    }

    .alliance-card {
        grid-template-columns: 1fr;
        padding: 24px;
        border-radius: 28px;
    }

    .alliance-logo {
        min-height: 220px;
        padding: 28px;
    }

    .alliance-content h3 {
        font-size: 1.7rem;
        text-align: center;
    }

    .alliance-content p {
        font-size: 0.98rem;
        text-align: justify;
        text-align-last: left;
    }

    .alliance-actions {
        display: flex;
        justify-content: center;
    }
}

/* ================= MÓVIL ================= */

@media (max-width: 768px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    body {
        position: relative;
    }

    main,
    section {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .container,
    .section-container {
        width: calc(100% - 32px);
        max-width: calc(100% - 32px);
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    .hero-section,
    .services-section,
    .magi-areas-section,
    .section,
    .section-light,
    .section-soft,
    .site-footer,
    main {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .section,
    .services-section,
    .about-hero,
    .mission-hero,
    .plans-hero,
    .support-section {
        padding: 72px 0;
    }

    .brand-logo,
    .brand-logo-im {
        height: 62px;
    }

    .navbar > .btn {
        width: fit-content;
        min-width: 200px;
        max-width: 250px;
        min-height: 48px;
        padding-left: 28px;
        padding-right: 28px;
    }

    /* ================= HERO INICIO ================= */

    .hero-section {
        padding: 72px 0;
    }

    .hero-section .container,
    .hero-grid,
    .hero-content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .hero-grid {
        justify-items: center;
        overflow: visible;
    }

    .hero-content {
        padding-left: 0;
        padding-right: 0;
    }

    .hero-content h1,
    .hero-section .hero-content h1,
    .hero-section .hero-text h1 {
        max-width: min(100%, 13.2ch);
        margin-left: auto;
        margin-right: auto;
        font-size: clamp(1.95rem, 7.2vw, 3rem);
        line-height: 1.04;
        letter-spacing: -0.045em;
        overflow-wrap: normal;
        word-break: keep-all;
        hyphens: none;
        text-wrap: balance;
    }

    .hero-content p {
        max-width: min(100%, 36ch);
        margin-left: auto;
        margin-right: auto;
        font-size: 1rem;
        line-height: 1.68;
        text-align: center;
        text-align-last: auto;
        overflow-wrap: break-word;
        word-break: normal;
        text-wrap: pretty;
    }

    .hero-actions {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 14px;
    }

    .hero-actions .btn {
        width: min(100%, 280px);
        min-width: 230px;
        max-width: 280px;
        min-height: 54px;
        padding-left: 26px;
        padding-right: 26px;
    }

    .hero-highlights {
        width: min(100%, 430px);
        max-width: 100%;
        grid-template-columns: 1fr;
        gap: 14px;
        margin-left: auto;
        margin-right: auto;
        justify-items: center;
    }

    .hero-highlight-item {
        width: calc(100% - 24px);
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding: 22px 18px;
        border: 1px solid rgba(255, 255, 255, 0.34);
        border-radius: 24px;
        box-shadow:
            inset 0 0 0 1px rgba(191, 219, 254, 0.10),
            0 14px 32px rgba(2, 8, 23, 0.16);
    }

    .hero-highlight-item strong,
    .hero-highlight-item span {
        overflow-wrap: anywhere;
    }

    .hero-card {
        width: min(calc(100% - 10px), 430px);
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        min-height: auto;
        padding: 34px 22px;
        border: 1px solid rgba(255, 255, 255, 0.34);
        border-radius: 28px;
        box-shadow:
            inset 0 0 0 1px rgba(191, 219, 254, 0.10),
            0 18px 44px rgba(2, 8, 23, 0.22);
        overflow: hidden;
    }

    .hero-card img {
        max-width: 260px;
        margin-bottom: 26px;
    }

    .hero-card *,
    .preview-ui *,
    .preview-content *,
    .preview-cards * {
        min-width: 0;
        box-sizing: border-box;
    }

    .maintenance-preview,
    .preview-ui,
    .preview-content,
    .preview-cards,
    .hero-card-info {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .preview-ui {
        grid-template-columns: 1fr;
    }

    .preview-content {
        padding: 0;
    }

    .preview-cards {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .preview-cards span {
        width: 100%;
        max-width: 100%;
        min-height: 84px;
        height: auto;
        margin-left: 0;
        margin-right: 0;
        border-radius: 22px;
    }

    .hero-card-info h2,
    .hero-card-info p {
        max-width: 100%;
        overflow-wrap: break-word;
    }

    /* ================= TITULARES GENERALES ================= */

    .section-heading,
    .section-header,
    .plans-header {
        margin-bottom: 42px;
    }

    .section-title,
    .section-heading h2,
    .section-header h2,
    .support-content h2 {
        font-size: clamp(1.85rem, 9vw, 2.55rem);
    }

    .section-description,
    .section-heading p,
    .section-header p {
        font-size: 0.96rem;
    }

    .services-grid,
    .why-grid,
    .tech-grid,
    .testimonials-grid,
    .grid-3,
    .plans-grid,
    .mission-values {
        grid-template-columns: 1fr;
    }

    .service-card,
    .why-item,
    .tech-card,
    .testimonial-card,
    .plan-card,
    .support-card,
    .mission-value-card {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding: 26px 22px;
        border-radius: 24px;
        box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
    }

    .service-card,
    .why-item,
    .tech-card,
    .testimonial-card,
    .mission-value-card {
        min-height: auto;
        align-items: center;
        text-align: center;
    }

    .service-icon,
    .why-icon,
    .tech-icon,
    .testimonial-icon,
    .mission-value-card i {
        margin-left: auto;
        margin-right: auto;
    }

    .service-card h3,
    .service-card p,
    .why-item h3,
    .why-item p,
    .tech-card h3,
    .tech-card p,
    .testimonial-card p,
    .testimonial-author,
    .testimonial-author strong,
    .testimonial-author span,
    .mission-value-card h3,
    .mission-value-card p {
        width: 100%;
        text-align: center;
    }

    .project-preview {
        height: 190px;
    }

    .project-body h3,
    .project-body p {
        text-align: center;
    }

    .project-footer {
        width: 100%;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .project-footer .badge {
        flex: 0 1 auto;
        text-align: left;
    }

    .project-footer .card-link {
        flex: 0 1 auto;
        text-align: right;
        white-space: nowrap;
    }

    .testimonial-card {
        display: flex;
        flex-direction: column;
    }

    .testimonial-card::before {
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }

    /* ================= CARRUSEL ÁREAS ================= */

    .magi-areas-section {
        padding: 42px 0 50px;
    }

    .magi-areas-section .section-container {
        width: calc(100% - 32px);
        max-width: calc(100% - 32px);
    }

    .section-header.compact {
        margin-bottom: 32px;
    }

    .section-pill {
        padding: 9px 18px;
        margin-bottom: 18px;
        font-size: 0.78rem;
    }

    .section-header.compact h2 {
        font-size: 1.9rem;
        line-height: 1.12;
    }

    .section-header.compact p {
        margin-top: 20px;
        font-size: 1rem;
    }

    .areas-carousel-wrapper {
        gap: 0;
    }

    .areas-carousel {
        gap: 18px;
        padding: 4px 2px 18px;
        scroll-padding-inline: 2px;
    }

    .area-card {
        flex-basis: 100%;
        min-height: 330px;
        padding: 44px 28px 40px;
        border-radius: 26px;
    }

    .area-icon {
        width: 82px;
        height: 82px;
        margin-bottom: 24px;
        border-radius: 24px;
    }

    .area-card h3 {
        font-size: 1.32rem;
    }

    .area-card p {
        font-size: 0.98rem;
    }

    .carousel-btn {
        display: none;
    }

    .carousel-dots {
        margin-top: 18px;
    }

    /* ================= CONTACTO RESPONSIVE ================= */

    .contact-section,
    .contact-layout,
    .contact-content,
    .contact-form-card,
    .contact-form {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .contact-section {
        padding: 64px 0;
    }

    .contact-layout {
        grid-template-columns: 1fr;
        gap: 38px;
        align-items: start;
    }

    .contact-content {
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .contact-content h2 {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        font-size: clamp(2.05rem, 9.5vw, 2.65rem);
        line-height: 1.08;
        letter-spacing: -0.055em;
        text-align: center;
        overflow-wrap: break-word;
        word-break: normal;
    }

    .contact-content > p {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        font-size: 1rem;
        line-height: 1.56;
        text-align: center;
        text-align-last: auto;
        overflow-wrap: break-word;
        word-break: normal;
    }

    .contact-info-list {
        width: 100%;
        max-width: 100%;
        margin-top: 0;
        justify-items: center;
    }

    .contact-info-card {
        width: 100%;
        max-width: 100%;
        padding: 20px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .contact-info-icon {
        width: 54px;
        height: 54px;
        flex: 0 0 54px;
        border-radius: 18px;
        font-size: 1.2rem;
    }

    .contact-form-card {
        height: auto;
        min-height: unset;
        padding: 28px 22px;
        border-radius: 38px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .contact-form {
        display: grid;
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 0;
        border-radius: 28px;
        background: transparent;
        border: 0;
        box-shadow: none;
        overflow: hidden;
        justify-items: center;
    }

    .contact-form .form-group,
    .contact-form .form-group:nth-of-type(7),
    .other-service-group,
    .contact-submit,
    .form-message {
        grid-column: 1 / -1;
    }

    .contact-form .form-group,
    .other-service-group {
        width: 100%;
        text-align: center;
    }

    .contact-form label {
        text-align: center;
    }

    .contact-form input,
    .contact-form textarea,
    .contact-form select {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        text-align: center;
    }

    .contact-form select {
        text-align-last: center;
    }

    .contact-submit {
        width: 100%;
        justify-self: stretch;
    }

    .contact-grid {
        gap: 38px;
    }

    .contact-item {
        align-items: flex-start;
    }

    /* ================= ACOM NEXOS RESPONSIVE ================= */

    .alliances-section,
    .alliances-grid,
    .alliance-card,
    .alliance-content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .alliance-card {
        padding: 24px;
        border-radius: 28px;
        text-align: center;
    }

    .alliance-content h3 {
        text-align: center;
    }

    .alliance-content p {
        text-align: center;
        text-align-last: auto;
        overflow-wrap: break-word;
        word-break: normal;
    }

    .alliance-actions {
        display: flex;
        justify-content: center;
    }

    .alliance-btn {
        text-align: center;
    }

    /* ================= QUIÉNES SOMOS RESPONSIVE ================= */

    .team-hero {
        padding: 118px 0 54px;
    }

    .team-hero-content h1 {
        font-size: 2.05rem;
        line-height: 1.12;
    }

    .team-hero-content p {
        font-size: 1rem;
    }

    .team-section {
        padding: 42px 0 62px;
    }

    .team-list {
        gap: 26px;
    }

    .team-page,
    .team-section,
    .team-list,
    .team-profile-card,
    .team-profile-card-reverse,
    .team-profile-content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .team-profile-card {
        padding: 22px;
        border-radius: 28px;
    }

    .team-profile-photo {
        min-height: 300px;
        border-radius: 22px;
    }

    .team-profile-photo img {
        min-height: 300px;
    }

    .team-profile-photo-brand {
        padding: 42px 26px;
        min-height: 240px;
    }

    .team-profile-photo-brand img {
        min-height: auto;
    }

    .team-profile-kicker {
        padding: 8px 14px;
        margin: 0 auto 16px;
        font-size: 0.78rem;
        justify-content: center;
    }

    .team-profile-content h2 {
        margin-bottom: 18px;
        text-align: center;
        font-size: clamp(1.85rem, 8.5vw, 2.4rem);
        line-height: 1.08;
        max-width: 100%;
        overflow-wrap: break-word;
    }

    .team-profile-content p {
        max-width: 34ch;
        margin-left: auto;
        margin-right: auto;
        font-size: 0.98rem;
        line-height: 1.65;
        text-align: center;
        text-align-last: auto;
        overflow-wrap: break-word;
        word-break: normal;
    }

    /* ================= NOSOTROS / MISIÓN RESPONSIVE ================= */

    .about-page,
    .mission-page,
    .about-hero,
    .mission-hero,
    .about-page-layout,
    .mission-page-layout,
    .about-page-content,
    .mission-page-content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .mission-page-content {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .about-page-content {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .about-page-content .section-label,
    .about-page-content .section-label-left,
    .mission-page-content .section-label,
    .mission-page-content .section-label-left {
        margin-left: auto;
        margin-right: auto;
    }

    .about-page-content h1,
    .mission-page-content h1,
    .plans-header h1 {
        max-width: 100%;
        font-size: clamp(1.95rem, 6.8vw, 2.55rem);
        line-height: 1.1;
        letter-spacing: -0.045em;
        overflow-wrap: anywhere;
        word-break: normal;
        text-wrap: balance;
    }

    .about-page-content h2,
    .mission-page-content h2 {
        max-width: 100%;
        font-size: clamp(1.95rem, 6.8vw, 2.55rem);
        line-height: 1.1;
        letter-spacing: -0.045em;
        overflow-wrap: anywhere;
        word-break: normal;
        text-wrap: balance;
    }

    .about-page-content p,
    .mission-page-content p {
        width: 100%;
        max-width: 100%;
        font-size: 1rem;
        line-height: 1.68;
        text-align: justify;
        text-align-last: left;
        overflow-wrap: anywhere;
        word-break: normal;
        white-space: normal;
        hyphens: none;
        text-wrap: pretty;
    }

    .mission-page-content h1,
    .mission-page-content h2,
    .mission-page-text p,
    .mission-page-content p {
        text-align: center;
        text-align-last: auto;
    }

    .about-page-content h1,
    .about-page-content h2,
    .about-page-text p,
    .about-page-content p {
        text-align: center;
        text-align-last: auto;
    }

    .about-page-visual img,
    .mission-page-visual img {
        height: 360px;
    }

    .about-page-visual::after,
    .mission-page-visual::after {
        display: none;
    }

    .plan-card {
        min-height: auto;
    }

    .plan-featured::before {
        position: static;
        display: inline-flex;
        width: fit-content;
        margin-bottom: 16px;
    }

    .plan-featured .plan-top {
        padding-top: 0;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 58px 0 42px;
        justify-items: center;
        text-align: center;
    }

    .footer-brand,
    .footer-column {
        width: 100%;
        max-width: 360px;
        margin-left: auto;
        margin-right: auto;
        align-items: center;
        text-align: center;
    }

    .footer-logo img {
        width: 145px;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .footer-brand p,
    .footer-column h3,
    .footer-column a {
        text-align: center;
    }

    .footer-column p {
        justify-content: center;
        text-align: center;
    }
}

/* ================= MÓVIL PEQUEÑO ================= */

@media (max-width: 480px) {
    .container,
    .section-container {
        width: calc(100% - 32px);
        max-width: calc(100% - 32px);
    }

    .navbar {
        position: relative;
        justify-content: center;
        text-align: center;
        gap: 14px;
        padding: 18px 0 16px;
    }

    .brand {
        width: 100%;
        justify-content: center;
    }

    .brand-logo,
    .brand-logo-im {
        height: 58px;
    }

    .nav-toggle,
    .mobile-menu-toggle {
        top: 12px;
        right: 0;
    }

    .navbar > .btn {
        width: fit-content;
        min-width: 190px;
        max-width: 230px;
        min-height: 46px;
        padding-left: 24px;
        padding-right: 24px;
        justify-self: center;
    }

    .nav-menu {
        width: min(100%, 360px);
        justify-content: flex-start;
    }

    .hero-content h1,
    .hero-section .hero-content h1,
    .hero-section .hero-text h1 {
        max-width: min(100%, 13.2ch);
        font-size: clamp(1.72rem, 7vw, 2.18rem);
        line-height: 1.06;
        letter-spacing: -0.04em;
    }

    .hero-content p {
        max-width: min(100%, 32ch);
        font-size: 0.98rem;
        line-height: 1.7;
        text-align: center;
        text-align-last: auto;
    }

    .hero-card {
        width: calc(100% - 12px);
        max-width: calc(100% - 12px);
        padding: 30px 18px;
    }

    .hero-card img {
        max-width: 225px;
    }

    .hero-card-info h2 {
        font-size: 1.45rem;
    }

    .hero-actions .btn {
        width: min(100%, 260px);
        min-width: 210px;
        max-width: 260px;
        min-height: 50px;
    }

    .hero-highlights {
        width: 100%;
        max-width: 100%;
        gap: 12px;
        justify-items: center;
    }

    .hero-highlight-item {
        width: calc(100% - 20px);
        max-width: 100%;
        padding: 20px 16px;
        border-width: 1px;
        border-radius: 22px;
    }

    .section-badge,
    .section-label {
        font-size: 0.72rem;
        padding: 7px 11px;
    }

    .service-icon,
    .why-icon,
    .tech-icon {
        width: 58px;
        height: 58px;
        font-size: 1.35rem;
    }

    .project-footer {
        flex-wrap: nowrap;
    }

    .badge {
        font-size: 0.72rem;
        padding: 7px 10px;
    }

    .card-link {
        font-size: 0.82rem;
    }

    .preview-ui {
        grid-template-columns: 1fr;
    }

    .preview-content {
        padding: 0;
    }

    .preview-cards {
        width: 100%;
        max-width: 100%;
        gap: 10px;
    }

    .preview-cards span {
        width: 100%;
        max-width: 100%;
        min-height: 78px;
        height: auto;
    }

    .contact-icon {
        width: 46px;
        height: 46px;
        font-size: 1rem;
    }

    .form-group input,
    .form-group textarea {
        padding: 13px 14px;
    }

    .contact-content h2 {
        font-size: clamp(1.95rem, 10vw, 2.45rem);
    }

    .contact-info-card {
        align-items: center;
        padding: 20px;
    }

    .contact-form-card {
        border-radius: 34px;
    }

    .contact-info-icon {
        width: 54px;
        height: 54px;
        flex: 0 0 54px;
        font-size: 1.15rem;
    }

    .alliance-content h3,
    .team-profile-content h2 {
        text-align: center;
    }

    .alliance-content p,
    .team-profile-content p,
    .contact-content > p {
        text-align: center;
        text-align-last: auto;
        font-size: 0.98rem;
        line-height: 1.68;
        hyphens: none;
        text-wrap: pretty;
    }

    .mission-page-content h1,
    .mission-page-content h2,
    .mission-page-text p,
    .mission-page-content p {
        text-align: center;
        text-align-last: auto;
    }

    .about-page-content h1,
    .about-page-content h2,
    .about-page-text p,
    .about-page-content p {
        text-align: center;
        text-align-last: auto;
    }

    .about-page-visual img,
    .mission-page-visual img {
        height: 300px;
    }

    .mission-value-card {
        padding: 20px;
    }

    .plan-price strong {
        font-size: 1.08rem;
    }
}
