/* ======================================================
   MOBILĀ VERSIJA
====================================================== */

@media (max-width:768px){

    /* ==================================================
       LAPA
    ================================================== */

    .matrix-page{
        padding:40px 0;
    }

    .page-title{
        margin-bottom:18px;

        font-size:44px;
        line-height:1.1;
    }

    .page-subtitle{
        margin:20px 0 30px;
        padding:0 20px;

        font-size:15px;
    }


    /* ==================================================
       GALVENAIS ATTĒLS
    ================================================== */

    .content-image{
        margin:20px auto;
    }

    .content-image img{
        width:100%;
        height:180px;

        object-fit:cover;
        border-radius:12px;
    }


    /* ==================================================
       FORMA
    ================================================== */

    .form-block{
        display:flex;
        flex-direction:column;
        align-items:center;

        gap:15px;
    }

    #birthDate{
        width:220px;
        height:50px;

        font-size:15px;
    }

    .btn{
        display:flex;
        justify-content:center;
        align-items:center;

        width:220px;
        height:46px;

        border-radius:10px;

        font-size:15px;
    }

    .reset-block{
        margin-bottom:35px;
    }


    /* ==================================================
       MATRICA
    ================================================== */

    #matrix{
        width:100%;
        overflow-x:auto;
    }

    .matrix-svg{
        display:block;

        width:88%;
        max-width:340px;
        min-width:0;
        height:auto;

        margin:0 auto;
    }
	
	    /* ==================================================
       MĒRĶI
    ================================================== */

    .goals{
        width:100%;

        margin:30px auto;
        padding:0 12px;

        box-sizing:border-box;
    }

    .goals-header{
        display:flex;
        flex-direction:column;
        align-items:center;

        width:100%;

        gap:20px;
        margin-bottom:35px;
    }

    .family-power,
    .inner-power{
        display:flex;
        justify-content:center;
        align-items:center;

        width:100%;

        gap:6px;
    }

    .family-power span,
    .inner-power span{
        max-width:180px;

        text-align:right;

        white-space:normal;
        word-break:break-word;

        font-size:16px;
        font-weight:600;
    }

    .line{
        width:50px;

        border-bottom:1px solid #777;
    }

    .power-code{
        gap:8px;
    }

    .goals-body{
        display:grid !important;

        grid-template-columns:1fr !important;

        row-gap:50px;
        column-gap:0;
    }

    .goal-column{
        width:100%;
        max-width:320px;

        margin:0 auto;
    }

    .goal-column h3{
        font-size:14px;
        line-height:1.3;
    }

    .goal-column h3 span{
        font-size:12px;
    }

    .goal-simple{
        font-size:13px;
    }

    .right{
        display:flex;
        align-items:center;

        width:100%;
        min-height:auto;

        gap:35px;
    }

    #goalsCard{
        margin-top:35px;
    }

    .goal-pair{
        display:flex;
        justify-content:center;

        width:100%;

        gap:12px;

        flex-wrap:nowrap;
    }

    .left-side{
        gap:12px;
    }

    .goal-row{
        display:flex;
        justify-content:flex-end;
        align-items:center;

        gap:14px;
    }

    .goal-row span{
        width:55px;

        font-size:13px;
    }

    .circle{
        width:35px;
        height:35px;

        border:1px solid #777;

        font-size:15px;
    }

    .bracket{
        height:86px;
    }

    .bracket::before{
        border-top:1px solid #777;
    }

    .bracket::after{
        border-bottom:1px solid #777;
    }
	    /* ==================================================
       VESELĪBAS KARTE
    ================================================== */

    #healthContainer{
        margin-top:40px;
    }

    #healthContainer h2{
        font-size:34px;
    }

    .health-table{
        overflow-x:auto;

        -webkit-overflow-scrolling:touch;
    }

    .health-table table{
        width:100%;
        min-width:0;
    }

    .health-table col:first-child{
        width:52%;
    }

    .health-table col:nth-child(2),
    .health-table col:nth-child(3),
    .health-table col:nth-child(4){
        width:16%;
    }

    .health-table thead th{
        padding:20px 1px;

        font-size:11px;

        white-space:nowrap;
    }

    .health-table td{
        padding:6px 4px;

        border:1px solid #ddd;

        text-align:center;

        font-size:12px;
    }

    .health-table td:first-child{
        padding:8px 10px;
    }

    .health-table strong{
        font-size:11px;
    }

    .health-table span{
        font-size:9px;
        line-height:1.3;
    }

    .health-table tfoot th{
        font-size:13px;
    }

    .chakra-title{
        font-size:12px;
    }

    .chakra-title span{
        display:none;
    }


    /* ==================================================
       PILNAIS APRAKSTS
    ================================================== */

    .report-info{
        margin:35px 15px;
        padding:25px 20px;
    }

    .report-info h2{
        font-size:26px;
    }

    .report-info p{
        font-size:15px;
        line-height:1.7;
    }

    .report-btn{
        display:flex;
        justify-content:center;
        align-items:center;

        width:100%;
        max-width:260px;

        margin:0 auto;
        padding:14px 20px;
    }

}