/*
Theme: Tabibaty Pregnancy
Version: 1.0
*/

/* =====================================
   RESET
===================================== */

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

html{
    scroll-behavior:smooth;
}

body{
    background:#f8fafc;
    color:#1f2937;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;
    line-height:1.8;
}

/* =====================================
   VARIABLES
===================================== */

:root{

    --primary:#0f766e;
    --primary-dark:#0b5f59;

    --secondary:#14b8a6;

    --background:#f8fafc;

    --white:#ffffff;

    --text:#1f2937;

    --text-light:#6b7280;

    --border:#e5e7eb;

    --radius:18px;

    --shadow:
        0 12px 30px rgba(15,118,110,.08);

}

/* =====================================
   CONTAINER
===================================== */

.tabibaty-container{

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

    margin:0 auto;

    padding:0 20px;

}

/* =====================================
   TYPOGRAPHY
===================================== */

h1,
h2,
h3{

    color:var(--primary);

    font-weight:700;

    line-height:1.4;

}

h1{

    font-size:42px;

    margin-bottom:20px;

}

h2{

    font-size:30px;

    margin-bottom:18px;

}

h3{

    font-size:22px;

    margin-bottom:12px;

}

p{

    color:var(--text-light);

    margin-bottom:16px;

}

/* =====================================
   BUTTON
===================================== */

.tabibaty-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:14px 28px;

    background:var(--primary);

    color:#fff;

    text-decoration:none;

    border:none;

    border-radius:12px;

    cursor:pointer;

    transition:.3s;

    font-size:16px;

    font-weight:700;

}

.tabibaty-btn:hover{

    background:var(--primary-dark);

    transform:translateY(-2px);

}

/* =====================================
   CARD
===================================== */

.tabibaty-card{

    background:#fff;

    border-radius:var(--radius);

    padding:30px;

    margin-bottom:30px;

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

    box-shadow:var(--shadow);

}

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

@media (max-width:768px){

    h1{

        font-size:32px;

    }

    h2{

        font-size:26px;

    }

    h3{

        font-size:20px;

    }

    .tabibaty-card{

        padding:22px;

    }

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

.tabibaty-hero{

    padding:80px 0 60px;

    text-align:center;

}

.tabibaty-hero h1{

    max-width:760px;

    margin:0 auto 20px;

}

.tabibaty-hero p{

    max-width:720px;

    margin:0 auto 35px;

    font-size:18px;

}

.tabibaty-hero .tabibaty-btn{

    min-width:220px;

}

/* =====================================
   CALCULATOR
===================================== */

.tabibaty-calculator{

    padding:20px 0 50px;

}

.calculator-form{

    display:flex;

    flex-direction:column;

    gap:22px;

}

.form-group{

    display:flex;

    flex-direction:column;

}

.form-group label{

    font-weight:700;

    color:var(--primary);

    margin-bottom:8px;

}

.form-group input,

.form-group select{

    width:100%;

    height:52px;

    padding:0 16px;

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

    border-radius:12px;

    background:#fff;

    color:var(--text);

    font-size:16px;

    transition:.25s;

}

.form-group input:focus,

.form-group select:focus{

    outline:none;

    border-color:var(--primary);

    box-shadow:0 0 0 4px rgba(15,118,110,.10);

}

.calculator-description{

    margin-bottom:24px;

}

.calculator-form button{

    width:100%;

    height:56px;

    font-size:18px;

}

/* =====================================
   SECTIONS
===================================== */

.tabibaty-seo,

.tabibaty-faq,

.tabibaty-latest-posts{

    padding:20px 0;

}
/* =====================================
   RESULT PAGE
===================================== */

.tabibaty-result{

    max-width:900px;

    margin:60px auto;

    padding:0 20px;

}

.tabibaty-result h1{

    text-align:center;

    margin-bottom:35px;

}

.tabibaty-result .tabibaty-card{

    margin-bottom:25px;

}

.tabibaty-table{

    width:100%;

    border-collapse:collapse;

}

.tabibaty-table tr{

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

}

.tabibaty-table tr:last-child{

    border-bottom:none;

}

.tabibaty-table td{

    padding:16px 8px;

    vertical-align:top;

}

.tabibaty-table td:first-child{

    width:42%;

    color:var(--primary);

    font-weight:700;

}

.tabibaty-table td:last-child{

    color:var(--text);

}

progress{

    width:100%;

    height:16px;

    margin-top:25px;

    appearance:none;

}

progress::-webkit-progress-bar{

    background:#e5e7eb;

    border-radius:20px;

}

progress::-webkit-progress-value{

    background:var(--primary);

    border-radius:20px;

}

progress::-moz-progress-bar{

    background:var(--primary);

}

.tabibaty-card p{

    color:var(--text);

    line-height:2;

}

.tabibaty-read-more{

    display:inline-block;

    margin-top:15px;

    color:var(--primary);

    text-decoration:none;

    font-weight:700;

}

.tabibaty-read-more:hover{

    text-decoration:underline;

}

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

@media (max-width:768px){

    .tabibaty-result{

        margin:40px auto;

    }

    .tabibaty-table,
    .tabibaty-table tbody,
    .tabibaty-table tr,
    .tabibaty-table td{

        display:block;

        width:100%;

    }

    .tabibaty-table tr{

        padding:14px 0;

    }

    .tabibaty-table td{

        padding:6px 0;

    }

    .tabibaty-table td:first-child{

        margin-bottom:5px;

    }

}