/* ============================================================
   ARHA - EMERGENCY & TRAUMA CARE
   UNIQUE MILKY WHITE CLINICAL THEME
   ============================================================ */

#arhaTraumaPage {

    --trauma-milk:#FAF8F3;
    --trauma-cream:#FFFDF8;
    --trauma-white:#FFFFFF;

    --trauma-ink:#17313A;
    --trauma-slate:#36525B;
    --trauma-muted:#708187;

    --trauma-red:#B9473D;
    --trauma-red-dark:#92382F;
    --trauma-red-soft:#F5E8E4;

    --trauma-sage:#668F88;
    --trauma-sage-soft:#E8F0ED;

    --trauma-bronze:#B38A58;

    --trauma-border:#E6E0D7;

    --trauma-heading:'Outfit',sans-serif;
    --trauma-body:'Inter',sans-serif;

    width:100%;
    overflow:hidden;

    background:
        var(--trauma-milk);

    color:
        var(--trauma-ink);

    font-family:
        var(--trauma-body);
}


#arhaTraumaPage *,
#arhaTraumaPage *::before,
#arhaTraumaPage *::after {

    box-sizing:border-box;
}


#arhaTraumaPage img {

    display:block;
    width:100%;
}


#arhaTraumaPage a {

    text-decoration:none;
}


.trauma-container {

    width:min(
        1280px,
        calc(100% - 56px)
    );

    margin-inline:auto;
}


/* ============================================================
   REVEAL
   ============================================================ */

#arhaTraumaPage [data-trauma-reveal] {

    opacity:0;

    transform:
        translateY(28px);

    transition:
        opacity .75s ease,
        transform .75s
        cubic-bezier(.2,.7,.2,1);
}


#arhaTraumaPage
[data-trauma-reveal].trauma-visible {

    opacity:1;

    transform:none;
}


/* ============================================================
   HERO
   ============================================================ */

.trauma-hero {

    position:relative;

    padding:
        78px 0 92px;

    overflow:hidden;

    background:

        radial-gradient(
            circle at 87% 18%,
            rgba(102,143,136,.13),
            transparent 25%
        ),

        var(--trauma-milk);
}


.trauma-hero-shape {

    position:absolute;

    width:620px;
    height:620px;

    right:-280px;
    top:-260px;

    border-radius:50%;

    border:
        1px solid
        rgba(102,143,136,.15);
}


.trauma-hero-shape::after {

    content:"";

    position:absolute;

    inset:70px;

    border-radius:50%;

    border:
        1px solid
        rgba(185,71,61,.10);
}


/* particles */

.trauma-particles span {

    position:absolute;

    width:5px;
    height:5px;

    border-radius:50%;

    background:
        rgba(179,138,88,.46);

    animation:
        traumaParticle 5s
        ease-in-out infinite;
}


.trauma-particles span:nth-child(1){
    left:7%;
    top:18%;
}

.trauma-particles span:nth-child(2){
    left:39%;
    top:12%;
    animation-delay:1s;
}

.trauma-particles span:nth-child(3){
    left:52%;
    top:77%;
    animation-delay:2s;
}

.trauma-particles span:nth-child(4){
    left:91%;
    top:66%;
    animation-delay:.7s;
}

.trauma-particles span:nth-child(5){
    left:20%;
    top:82%;
    animation-delay:2.7s;
}


@keyframes traumaParticle {

    0%,
    100% {

        opacity:.15;
        transform:translateY(0);

    }

    50% {

        opacity:.8;
        transform:translateY(-12px);

    }
}


/* ============================================================
   HERO GRID
   ============================================================ */

.trauma-hero-grid {

    position:relative;

    display:grid;

    grid-template-columns:
        1fr .92fr;

    align-items:center;

    gap:80px;
}


.trauma-breadcrumb {

    display:flex;
    align-items:center;
    gap:9px;

    margin-bottom:27px;

    font-size:9px;

    color:
        var(--trauma-muted);
}


.trauma-breadcrumb a {

    color:
        var(--trauma-sage);
}


.trauma-breadcrumb i {

    font-size:6px;
}


.trauma-status {

    display:inline-flex;

    align-items:center;

    gap:9px;

    margin-bottom:18px;

    padding:
        7px 11px;

    border-radius:30px;

    background:
        var(--trauma-red-soft);

    font-size:9px;

    font-weight:800;

    letter-spacing:.9px;

    color:
        var(--trauma-red-dark);
}


.trauma-status-dot {

    width:7px;
    height:7px;

    border-radius:50%;

    background:
        var(--trauma-red);

    animation:
        traumaPulse 1.8s infinite;
}


@keyframes traumaPulse {

    0% {
        box-shadow:
            0 0 0
            0 rgba(185,71,61,.35);
    }

    70% {
        box-shadow:
            0 0 0
            8px rgba(185,71,61,0);
    }

    100% {
        box-shadow:
            0 0 0
            0 rgba(185,71,61,0);
    }
}


.trauma-hero h1 {

    margin:0;

    max-width:720px;

    font-family:
        var(--trauma-heading);

    font-size:
        clamp(47px,5vw,70px);

    font-weight:700;

    line-height:1;

    letter-spacing:-2.2px;

    color:
        var(--trauma-ink);
}


.trauma-hero h1 span {

    display:block;

    color:
        var(--trauma-red);
}


.trauma-hero-description {

    max-width:650px;

    margin:
        24px 0 0;

    font-size:15px;

    line-height:1.8;

    color:
        var(--trauma-slate);
}


/* buttons */

.trauma-hero-actions {

    margin-top:31px;

    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:10px;
}


.trauma-call {

    min-height:56px;

    padding:
        7px 19px;

    display:flex;
    align-items:center;

    gap:11px;

    border-radius:8px;

    background:
        var(--trauma-red);

    color:#fff !important;

    box-shadow:
        0 12px 28px
        rgba(146,56,47,.15);

    transition:
        transform .25s ease;
}


.trauma-call:hover {

    transform:
        translateY(-3px);
}


.trauma-call > i {

    font-size:18px;
}


.trauma-call > span {

    display:flex;
    flex-direction:column;

    font-family:
        var(--trauma-heading);

    font-size:15px;

    font-weight:800;
}


.trauma-call small {

    font-family:
        var(--trauma-body);

    font-size:7px;

    letter-spacing:.8px;

    color:#FAD6D1;
}


.trauma-ambulance {

    min-height:56px;

    padding:
        0 18px;

    display:flex;
    align-items:center;

    gap:9px;

    border:
        1px solid
        var(--trauma-border);

    border-radius:8px;

    background:
        var(--trauma-white);

    color:
        var(--trauma-ink) !important;

    font-size:11px;

    font-weight:700;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.trauma-ambulance:hover {

    transform:
        translateY(-3px);

    box-shadow:
        0 12px 27px
        rgba(23,49,58,.08);
}


.trauma-hero-note {

    max-width:580px;

    margin-top:18px;

    display:flex;

    gap:8px;

    color:
        var(--trauma-muted);

    font-size:9px;

    line-height:1.55;
}


.trauma-hero-note i {

    color:
        var(--trauma-bronze);
}


/* ============================================================
   HERO IMAGE
   ============================================================ */

.trauma-hero-visual {

    position:relative;
}


.trauma-main-image {

    position:relative;

    height:570px;

    overflow:hidden;

    border-radius:
        120px 18px 18px 18px;

    background:#ddd;

    box-shadow:
        0 28px 65px
        rgba(39,54,56,.14);
}


.trauma-main-image > img {

    height:100%;

    object-fit:cover;

    transition:
        transform 7s ease;
}


.trauma-main-image:hover > img {

    transform:
        scale(1.055);
}


.trauma-image-overlay {

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            to top,
            rgba(23,49,58,.72),
            transparent 50%
        );
}


.trauma-image-caption {

    position:absolute;

    left:25px;
    right:25px;
    bottom:24px;

    display:flex;
    flex-direction:column;
}


.trauma-image-caption span {

    margin-bottom:5px;

    font-size:8px;

    font-weight:800;

    letter-spacing:1px;

    color:#C2DDD7;
}


.trauma-image-caption strong {

    max-width:390px;

    font-family:
        var(--trauma-heading);

    font-size:20px;

    line-height:1.2;

    color:#fff;
}


.trauma-image-card {

    position:absolute;

    left:-54px;
    bottom:55px;

    max-width:270px;

    padding:
        14px 16px;

    display:flex;
    align-items:center;

    gap:11px;

    border:
        1px solid
        var(--trauma-border);

    border-radius:11px;

    background:
        rgba(255,253,248,.96);

    box-shadow:
        0 15px 35px
        rgba(23,49,58,.12);

    animation:
        traumaFloat
        4s ease-in-out infinite;
}


@keyframes traumaFloat {

    50% {
        transform:
            translateY(-7px);
    }
}


.trauma-card-icon {

    width:40px;
    height:40px;

    min-width:40px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:9px;

    background:
        var(--trauma-sage-soft);

    color:
        var(--trauma-sage);
}


.trauma-image-card div {

    display:flex;
    flex-direction:column;
}


.trauma-image-card small {

    margin-bottom:3px;

    font-size:7px;

    font-weight:800;

    letter-spacing:.7px;

    color:
        var(--trauma-red);
}


.trauma-image-card strong {

    font-family:
        var(--trauma-heading);

    font-size:11px;

    line-height:1.35;

    color:
        var(--trauma-ink);
}


/* ============================================================
   SHARED HEADING
   ============================================================ */

.trauma-heading {

    max-width:850px;

    margin-bottom:48px;
}


.trauma-kicker {

    display:block;

    margin-bottom:9px;

    font-size:9px;

    font-weight:800;

    letter-spacing:1.25px;

    color:
        var(--trauma-red);
}


.trauma-heading h2,
.trauma-response-content h2,
.trauma-family-content h2 {

    margin:0;

    font-family:
        var(--trauma-heading);

    font-size:
        clamp(34px,4vw,50px);

    line-height:1.05;

    letter-spacing:-1.2px;

    color:
        var(--trauma-ink);
}


.trauma-heading h2 em {

    font-style:normal;

    color:
        var(--trauma-sage);
}


.trauma-heading > p {

    max-width:700px;

    margin:
        17px 0 0;

    font-size:13px;

    line-height:1.8;

    color:
        var(--trauma-muted);
}


/* ============================================================
   TRAUMA TYPES
   ============================================================ */

.trauma-types {

    padding:
        105px 0;

    background:
        var(--trauma-cream);
}


.trauma-type-grid {

    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:12px;
}


.trauma-type-card {

    position:relative;

    min-height:240px;

    padding:24px;

    border:
        1px solid
        var(--trauma-border);

    border-radius:12px;

    background:
        var(--trauma-white);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.trauma-type-card:hover {

    transform:
        translateY(-6px);

    border-color:
        #D6C8BA;

    box-shadow:
        0 18px 38px
        rgba(23,49,58,.08);
}


.trauma-type-card > span {

    position:absolute;

    right:18px;
    top:17px;

    font-family:
        var(--trauma-heading);

    font-size:9px;

    color:#AFABA3;
}


.trauma-type-card > i {

    width:44px;
    height:44px;

    margin-bottom:25px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    background:
        var(--trauma-sage-soft);

    color:
        var(--trauma-sage);
}


.trauma-type-card.trauma-priority {

    background:
        #FDF8F6;
}


.trauma-type-card.trauma-priority > i {

    background:
        var(--trauma-red-soft);

    color:
        var(--trauma-red);
}


.trauma-type-card h3 {

    margin:0;

    font-family:
        var(--trauma-heading);

    font-size:17px;

    color:
        var(--trauma-ink);
}


.trauma-type-card p {

    margin:
        9px 0 0;

    font-size:10.5px;

    line-height:1.7;

    color:
        var(--trauma-muted);
}


/* ============================================================
   RESPONSE
   ============================================================ */

.trauma-response {

    padding:
        110px 0;

    background:
        var(--trauma-milk);
}


.trauma-response-grid {

    display:grid;

    grid-template-columns:
        1fr .9fr;

    align-items:center;

    gap:78px;
}


.trauma-response-photo {

    position:relative;

    height:590px;

    overflow:hidden;

    border-radius:
        18px 110px 18px 18px;
}


.trauma-response-photo img {

    height:100%;

    object-fit:cover;
}


.trauma-photo-tag {

    position:absolute;

    left:20px;
    right:20px;
    bottom:20px;

    padding:15px;

    display:flex;
    flex-direction:column;

    border-radius:8px;

    background:
        rgba(23,49,58,.77);

    backdrop-filter:
        blur(8px);
}


.trauma-photo-tag span {

    font-size:7px;

    letter-spacing:.8px;

    color:#C4DED8;
}


.trauma-photo-tag strong {

    margin-top:3px;

    font-family:
        var(--trauma-heading);

    color:#fff;
}


.trauma-response-content > p {

    margin:
        19px 0 0;

    font-size:13px;

    line-height:1.8;

    color:
        var(--trauma-muted);
}


.trauma-response-steps {

    margin-top:27px;

    border-top:
        1px solid
        var(--trauma-border);
}


.trauma-response-steps > div {

    padding:
        16px 0;

    display:grid;

    grid-template-columns:
        36px 1fr;

    gap:12px;

    border-bottom:
        1px solid
        var(--trauma-border);
}


.trauma-response-steps > div > span {

    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        var(--trauma-red-soft);

    font-size:8px;

    font-weight:800;

    color:
        var(--trauma-red);
}


.trauma-response-steps strong {

    font-family:
        var(--trauma-heading);

    font-size:13px;
}


.trauma-response-steps p {

    margin:
        4px 0 0;

    font-size:10px;

    line-height:1.55;

    color:
        var(--trauma-muted);
}


/* ============================================================
   MULTIDISCIPLINARY TEAM
   ============================================================ */

.trauma-team {

    padding:
        95px 0;

    background:
        #F2EEE7;
}


.trauma-heading-centre {

    max-width:760px;

    margin:
        0 auto 45px;

    text-align:center;
}


.trauma-team-grid {

    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    border-top:
        1px solid #DDD5CA;

    border-left:
        1px solid #DDD5CA;
}


.trauma-team-grid > div {

    min-height:165px;

    padding:25px;

    display:flex;
    flex-direction:column;

    border-right:
        1px solid #DDD5CA;

    border-bottom:
        1px solid #DDD5CA;

    background:
        rgba(255,255,255,.32);
}


.trauma-team-grid i {

    margin-bottom:18px;

    color:
        var(--trauma-red);
}


.trauma-team-grid strong {

    font-family:
        var(--trauma-heading);

    font-size:15px;
}


.trauma-team-grid span {

    margin-top:6px;

    font-size:9.5px;

    color:
        var(--trauma-muted);
}


/* ============================================================
   INFRASTRUCTURE
   ============================================================ */

.trauma-infra {

    padding:
        105px 0;

    background:
        var(--trauma-cream);
}


.trauma-infra-grid {

    display:grid;

    grid-template-columns:
        1.3fr 1fr 1fr;

    grid-template-rows:
        245px 245px;

    gap:12px;
}


.trauma-infra-grid figure {

    position:relative;

    margin:0;

    overflow:hidden;

    border-radius:12px;

    background:#ddd;
}


.trauma-infra-grid
.trauma-infra-large {

    grid-row:
        span 2;
}


.trauma-infra-grid img {

    height:100%;

    object-fit:cover;

    transition:
        transform .6s ease;
}


.trauma-infra-grid figure:hover img {

    transform:
        scale(1.045);
}


.trauma-infra-grid figure::after {

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            to top,
            rgba(23,49,58,.75),
            transparent 57%
        );
}


.trauma-infra-grid figcaption {

    position:absolute;

    z-index:2;

    left:18px;
    bottom:17px;

    display:flex;
    flex-direction:column;
}


.trauma-infra-grid small {

    font-size:7px;

    font-weight:800;

    letter-spacing:.8px;

    color:#D8E8E3;
}


.trauma-infra-grid strong {

    margin-top:3px;

    font-family:
        var(--trauma-heading);

    font-size:16px;

    color:#fff;
}


.trauma-infra-large strong {

    font-size:23px;
}


/* ============================================================
   FAMILY INFORMATION
   ============================================================ */

.trauma-family {

    padding:
        105px 0;

    background:
        var(--trauma-milk);
}


.trauma-family-grid {

    display:grid;

    grid-template-columns:
        1.15fr .65fr;

    align-items:center;

    gap:95px;
}


.trauma-family-content > p {

    max-width:650px;

    margin:
        18px 0 0;

    font-size:13px;

    line-height:1.8;

    color:
        var(--trauma-muted);
}


.trauma-family-points {

    margin-top:28px;
}


.trauma-family-points > div {

    padding:
        16px 0;

    display:grid;

    grid-template-columns:
        37px 1fr;

    gap:14px;

    border-top:
        1px solid
        var(--trauma-border);
}


.trauma-family-points i {

    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    background:
        var(--trauma-sage-soft);

    color:
        var(--trauma-sage);
}


.trauma-family-points span {

    display:flex;
    flex-direction:column;

    font-size:10px;

    line-height:1.55;

    color:
        var(--trauma-muted);
}


.trauma-family-points strong {

    margin-bottom:3px;

    font-family:
        var(--trauma-heading);

    font-size:12px;

    color:
        var(--trauma-ink);
}


/* emergency card */

.trauma-family-emergency {

    padding:38px;

    border-radius:
        80px 16px 16px 16px;

    background:
        var(--trauma-red);

    color:#fff;
}


.trauma-family-icon {

    width:50px;
    height:50px;

    margin-bottom:25px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        rgba(255,255,255,.13);
}


.trauma-family-emergency small {

    font-size:8px;

    font-weight:800;

    letter-spacing:.9px;

    color:#F7D4CF;
}


.trauma-family-emergency h3 {

    margin:
        8px 0 25px;

    font-family:
        var(--trauma-heading);

    font-size:30px;

    line-height:1.05;
}


.trauma-family-emergency > a {

    min-height:49px;

    padding:
        0 13px;

    display:flex;
    align-items:center;

    gap:9px;

    border-radius:7px;

    background:#fff;

    color:
        var(--trauma-red-dark) !important;

    font-family:
        var(--trauma-heading);

    font-weight:800;
}


.trauma-family-emergency
.trauma-directions {

    margin-top:8px;

    border:
        1px solid
        rgba(255,255,255,.25);

    background:
        transparent;

    color:#fff !important;
}


/* ============================================================
   RELATED
   ============================================================ */

.trauma-related {

    padding:
        90px 0;

    background:
        var(--trauma-cream);
}


.trauma-related-head {

    margin-bottom:32px;
}


.trauma-related-head h2 {

    margin:0;

    font-family:
        var(--trauma-heading);

    font-size:35px;
}


.trauma-related-grid {

    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:12px;
}


.trauma-related-grid > a {

    min-height:105px;

    padding:18px;

    display:grid;

    grid-template-columns:
        38px 1fr auto;

    align-items:center;

    gap:12px;

    border:
        1px solid
        var(--trauma-border);

    border-radius:10px;

    background:#fff;

    color:
        var(--trauma-ink) !important;

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


.trauma-related-grid > a:hover {

    transform:
        translateY(-4px);

    box-shadow:
        0 14px 30px
        rgba(23,49,58,.08);
}


.trauma-related-grid > a > i:first-child {

    width:38px;
    height:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    background:
        var(--trauma-sage-soft);

    color:
        var(--trauma-sage);
}


.trauma-related-grid span {

    display:flex;
    flex-direction:column;
}


.trauma-related-grid small {

    margin-bottom:4px;

    font-size:7px;

    font-weight:800;

    letter-spacing:.7px;

    color:
        var(--trauma-red);
}


.trauma-related-grid strong {

    font-family:
        var(--trauma-heading);

    font-size:13px;
}


/* ============================================================
   FINAL
   ============================================================ */

.trauma-final {

    padding:
        60px 0;

    background:
        #17313A;

    color:#fff;
}


.trauma-final-inner {

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:50px;
}


.trauma-final-inner > div:first-child > span {

    font-size:8px;

    font-weight:800;

    letter-spacing:1px;

    color:#BBCFC9;
}


.trauma-final h2 {

    margin:
        6px 0 0;

    font-family:
        var(--trauma-heading);

    font-size:
        clamp(30px,4vw,45px);
}


.trauma-final p {

    margin:
        8px 0 0;

    font-size:11px;

    color:#B9C8CC;
}


.trauma-final-actions {

    display:flex;

    gap:10px;
}


.trauma-final-call,
.trauma-final-location {

    min-height:52px;

    display:flex;

    align-items:center;

    gap:9px;

    border-radius:8px;
}


.trauma-final-call {

    padding:
        8px 16px;

    background:
        var(--trauma-red);

    color:#fff !important;
}


.trauma-final-call span {

    display:flex;
    flex-direction:column;

    font-family:
        var(--trauma-heading);

    font-weight:800;
}


.trauma-final-call small {

    font-family:
        var(--trauma-body);

    font-size:7px;
}


.trauma-final-location {

    padding:
        0 16px;

    border:
        1px solid
        rgba(255,255,255,.2);

    color:#fff !important;

    font-size:10px;
}


/* ============================================================
   MOBILE FIXED BAR
   ============================================================ */

.trauma-mobile-bar {

    display:none;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width:950px) {

    .trauma-hero-grid,
    .trauma-response-grid {

        grid-template-columns:1fr;

        gap:45px;
    }


    .trauma-hero-visual {

        max-width:680px;
    }


    .trauma-image-card {

        left:20px;
    }


    .trauma-type-grid {

        grid-template-columns:
            repeat(2,1fr);
    }


    .trauma-team-grid {

        grid-template-columns:
            repeat(2,1fr);
    }


    .trauma-family-grid {

        grid-template-columns:1fr;

        gap:40px;
    }


    .trauma-family-emergency {

        max-width:500px;
    }


    .trauma-related-grid {

        grid-template-columns:1fr;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width:600px) {

    #arhaTraumaPage {

        padding-bottom:60px;
    }


    .trauma-container {

        width:
            calc(100% - 30px);
    }


    /* mobile emergency bar */

    .trauma-mobile-bar {

        position:fixed;

        left:0;
        right:0;
        bottom:0;

        z-index:8500;

        height:60px;

        display:grid;

        grid-template-columns:
            repeat(3,1fr);

        background:#fff;

        border-top:
            1px solid
            var(--trauma-border);

        box-shadow:
            0 -7px 25px
            rgba(0,0,0,.10);
    }


    .trauma-mobile-bar a {

        display:flex;

        flex-direction:column;

        align-items:center;
        justify-content:center;

        gap:4px;

        font-size:8px;

        font-weight:700;

        color:
            var(--trauma-ink) !important;
    }


    .trauma-mobile-bar
    .trauma-mobile-emergency {

        background:
            var(--trauma-red);

        color:#fff !important;
    }


    .trauma-hero {

        padding:
            48px 0 65px;
    }


    .trauma-breadcrumb {

        margin-bottom:20px;
    }


    .trauma-hero h1 {

        font-size:
            clamp(38px,11vw,48px);

        letter-spacing:-1.4px;
    }


    .trauma-hero-description {

        font-size:12.5px;
    }


    .trauma-hero-actions {

        align-items:stretch;

        flex-direction:column;
    }


    .trauma-call,
    .trauma-ambulance {

        width:100%;
    }


    .trauma-main-image {

        height:380px;

        border-radius:
            70px 13px 13px 13px;
    }


    .trauma-image-card {

        position:relative;

        left:auto;
        bottom:auto;

        margin:
            -28px 13px 0;
    }


    .trauma-types,
    .trauma-response,
    .trauma-team,
    .trauma-infra,
    .trauma-family,
    .trauma-related {

        padding:
            70px 0;
    }


    .trauma-heading {

        margin-bottom:32px;
    }


    .trauma-heading h2,
    .trauma-response-content h2,
    .trauma-family-content h2 {

        font-size:32px;
    }


    .trauma-type-grid {

        grid-template-columns:1fr;
    }


    .trauma-type-card {

        min-height:205px;
    }


    .trauma-response-photo {

        height:350px;

        border-radius:
            13px 65px 13px 13px;
    }


    .trauma-team-grid {

        grid-template-columns:1fr;
    }


    .trauma-team-grid > div {

        min-height:135px;
    }


    .trauma-infra-grid {

        display:grid;

        grid-template-columns:
            1fr 1fr;

        grid-template-rows:
            280px 180px;
    }


    .trauma-infra-grid
    .trauma-infra-large {

        grid-column:
            span 2;

        grid-row:auto;
    }


    .trauma-family-emergency {

        padding:30px 22px;

        border-radius:
            60px 13px 13px 13px;
    }


    .trauma-family-emergency h3 {

        font-size:27px;
    }


    .trauma-final-inner {

        align-items:flex-start;

        flex-direction:column;

        gap:25px;
    }


    .trauma-final-actions {

        width:100%;

        flex-direction:column;
    }


    .trauma-final-call,
    .trauma-final-location {

        width:100%;
    }


    .trauma-final-location {

        justify-content:center;
    }

}


@media (max-width:380px) {

    .trauma-infra-grid {

        display:block;
    }


    .trauma-infra-grid figure {

        height:220px;

        margin-bottom:8px;
    }

}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion:reduce) {

    #arhaTraumaPage *,
    #arhaTraumaPage *::before,
    #arhaTraumaPage *::after {

        animation:none !important;
        transition:none !important;
    }


    #arhaTraumaPage
    [data-trauma-reveal] {

        opacity:1;
        transform:none;
    }

}