/* ================= NAVBAR ================= */

.navbar{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:80px;
    background:#ffffff;
    box-shadow:0 3px 15px rgba(0,0,0,.08);
    z-index:9999;
}

.container{
    width:92%;
    max-width:1300px;
    margin:auto;
}

.nav-container{
    height:80px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.logo img{
    height:55px;
    width:auto;
}

.nav-links{
    display:flex;
    list-style:none;
    gap:35px;
    align-items:center;
}

.nav-links li{
    list-style:none;
}

.nav-links a{
    text-decoration:none;
    color:#1e293b;
    font-size:16px;
    font-weight:600;
    position:relative;
    transition:.3s;
}

.nav-links a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-8px;
    width:0;
    height:3px;
    background:#00bfff;
    transition:.3s;
}

.nav-links a:hover::after,
.nav-links a.active::after{
    width:100%;
}

.nav-links a:hover,
.nav-links a.active{
    color:#00bfff;
}

.quote-btn{
    padding:14px 32px;
    border-radius:50px;
    text-decoration:none;
    color:#fff;
    font-weight:600;
    background:linear-gradient(135deg,#00c6ff,#6a11cb);
}

.menu-toggle{
    display:none;
    background:none;
    border:none;
    font-size:26px;
    cursor:pointer;
}

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

@media(max-width:992px){

.menu-toggle{
display:block;
}

.quote-btn{
display:none;
}

.nav-links{

position:absolute;

top:80px;
left:0;

width:100%;

background:#fff;

display:flex;

flex-direction:column;

padding:30px 0;

gap:25px;

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

transform:translateY(-120%);

opacity:0;

visibility:hidden;

transition:.35s;

}

.nav-links.active{

transform:translateY(0);

opacity:1;

visibility:visible;

}

}

:root{
    --navbar-height:80px;
}

body{
    padding-top:var(--navbar-height);
}

.navbar{
    height:var(--navbar-height);
}

/*==================================================
        ABOUT HERO SECTION
==================================================*/

.our-story{
    position:relative;
    min-height:900px;
    overflow:hidden;
    background:#000;
}

/*================ Background Slider ================*/

.about-slider{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}

.about-slider .slide{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    transition:opacity 1.5s ease;
    transform:scale(1);
}

.about-slider .slide.active{
    opacity:1;
    animation:kenburns 8s linear forwards;
}

/*================ Ken Burns Effect ================*/

@keyframes kenburns{

    0%{
        transform:scale(1);
    }

    100%{
        transform:scale(1.12);
    }

}

/*================ Overlay ================*/

.about-overlay{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100vh;
    min-height:850px;
    z-index:2;
    background:linear-gradient(
        rgba(5,20,45,.65),
        rgba(5,20,45,.65)
    );
}

/*================ Hero Content ================*/

.our-story .container{

    position:absolute;

    inset:0;

    display:flex;

    justify-content:center;

    align-items:center;

    z-index:5;

}

.story-heading{

    max-width:900px;

    text-align:center;

    color:#fff;

    animation:fadeUp 1s ease;

}

.story-heading h2{

    font-size:clamp(3rem,6vw,5rem);

    font-weight:800;

    margin-bottom:25px;

    color:#fff;

}

.story-heading h2 span{

    background:linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}

.story-heading p{

    font-size:22px;

    line-height:1.9;

    color:#f8fafc;

    max-width:900px;

    margin:auto;

}

/*================ Animation ================*/

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(60px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*==================================================
        IMPCON AT A GLANCE
==================================================*/

.story-full{

    max-width:1250px;

    margin:-80px auto 120px;

    background:#ffffff;

    border-radius:30px;

    padding:70px;

    position:relative;

    z-index:10;

    box-shadow:
    0 30px 70px rgba(0,0,0,.12);

}

/*================ Heading ================*/

.story-full h3{

    text-align:center;

    font-size:52px;

    font-weight:800;

    color:#0f172a;

    margin-bottom:15px;

}

.story-full h4{

    text-align:center;

    font-size:24px;

    color:#2563eb;

    margin-bottom:45px;

    font-weight:600;

}

/*================ Highlight Box ================*/

.story-highlight{

    background:linear-gradient(
        135deg,
        #f8fcff,
        #eef7ff
    );

    border-left:6px solid #00c6ff;

    border-radius:22px;

    padding:35px;

    margin-bottom:40px;

    box-shadow:
    0 15px 35px rgba(0,0,0,.08);

}

.story-highlight strong{

    color:#0f172a;

}

.story-highlight{

    font-size:19px;

    line-height:1.9;

    color:#334155;

}

/*================ Paragraph ================*/

.story-full p{

    font-size:18px;

    color:#1e293b;

    line-height:2;

    text-align:justify;

    margin-bottom:26px;

}

/*================ Tagline ================*/

.story-tagline{

    margin-top:55px;

    padding:28px;

    border-radius:18px;

    background:
    linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:16px;

    font-size:20px;

    font-weight:600;

    text-align:center;

    box-shadow:
    0 20px 40px rgba(0,0,0,.15);

}

.story-tagline i{

    font-size:34px;

}

/*================ Scroll Animation ================*/

.story-full{

    opacity:0;

    transform:translateY(70px);

    transition:1s ease;

}

.story-full.show{

    opacity:1;

    transform:translateY(0);

}

/*================ WHO WE ARE ================*/

.icon{
    width:84px;
    height:84px;
    margin:0 auto 25px;

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

    border-radius:24px;

    background:linear-gradient(135deg,#1da1f2 0%,#4f6df5 55%,#6a11cb 100%);

    box-shadow:0 15px 35px rgba(36, 174, 179, 0.35);

    transition:.4s ease;
}

.icon i{
    color:#fff;
    font-size:38px;
}

.who-card:hover .icon{
    transform:translateY(-8px) rotate(-5deg);
    box-shadow:0 20px 40px rgba(18, 137, 122, 0.45);
}

.who-we-are{

    padding:120px 0;

    background:#ffffff;

}

.who-header{

    text-align:center;

    max-width:950px;

    margin:auto;

    margin-bottom:70px;

}

.who-tag{

    display:inline-block;

    color:#3154d6;

    font-size:15px;

    font-weight:700;

    letter-spacing:2px;

    margin-bottom:20px;

}

.who-header h2{

    font-size:clamp(2.4rem,5vw,4.4rem);

    font-weight:800;

    color:#1e293b;

    margin-bottom:25px;

}

.who-header p{

    font-size:clamp(1rem,2vw,1.35rem);

    line-height:1.9;

    color:#000000;

}

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

.who-grid{

    display:grid;

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

    gap:40px;

}

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

.who-card{

    position:relative;

    background:#ffffff;

    border-radius:28px;

    padding:45px;

    border:1px solid #e5e7eb;

    box-shadow:0 15px 35px rgba(0,0,0,.08);

    transition:.4s;

    overflow:hidden;

    text-align:center;

}

.who-card:hover{

    transform:translateY(-12px);

    box-shadow:0 25px 45px rgba(0,0,0,.15);

}

/*================ TOP BORDER ================*/

.top-line{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(
    90deg,
    #3154d6,
    #ffb000
    );

}

/*================ ICON ================*/

.icon{

    font-size:34px;

    margin-bottom:20px;

}

/*================ TITLE ================*/

/*================ TITLE ================*/

.who-card h3{

    font-size:34px;

    color:#1e293b;

    margin-bottom:18px;

    font-weight:700;

    text-align:center;

}

/*================ TEXT ================*/

.who-card p{

    font-size:19px;

    line-height:1.9;

    color:#000000;

}

/*================ Animation ================*/

.hide-card{

    opacity:0;

    transform:translateY(60px);

}

.show-card{

    opacity:1;

    transform:translateY(0);

    transition:.8s ease;

}

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

@media(max-width:992px){

.who-grid{

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

}

}

@media(max-width:768px){

.who-we-are{

padding:80px 0;

}

.who-grid{

grid-template-columns:1fr;

gap:30px;

}

.who-card{

padding:35px;

}

.who-card h3{

font-size:30px;

}

}

@media(max-width:480px){

.who-header h2{

font-size:2rem;

}

.who-header p{

font-size:16px;

}

.who-card{

padding:28px;

}

.who-card h3{

font-size:26px;

}

.who-card p{

font-size:16px;

}

}

/*================ CORE VALUES ================*/

.core-values{

    padding:120px 0;

    background:#f8fafc;

}

.core-header{

    text-align:center;

    margin-bottom:70px;

}

.core-header h2{

    font-size:clamp(2.4rem,5vw,4rem);

    font-weight:800;

    color:#0f172a;

    margin-bottom:15px;

}

.core-header p{

    font-size:clamp(1rem,2vw,1.3rem);

    color:#000000;

}

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

.core-grid{

    display:grid;

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

    gap:30px;

}

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

.core-card{

    background:#ffffff;

    border-radius:24px;

    padding:45px 30px;

    text-align:center;

    border:1px solid #e2e8f0;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

    transition:.4s;

}

.core-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

/*============== ICON ==============*/

.core-icon{

    width:72px;

    height:72px;

    margin:auto;

    margin-bottom:25px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:18px;

    background:linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    color:#fff;

    font-size:30px;

}

.core-card h3{

    font-size:32px;

    font-weight:700;

    color:#0f172a;

    margin-bottom:18px;

}

.core-card p{

    color:#000000;

    line-height:1.8;

    font-size:18px;

}

/*============== Animation ==============*/

.hide-core{

    opacity:0;

    transform:translateY(50px);

}

.show-core{

    opacity:1;

    transform:translateY(0);

    transition:.8s ease;

}

/*============== Responsive ==============*/

@media(max-width:1100px){

.core-grid{

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

}

}

@media(max-width:768px){

.core-values{

padding:80px 0;

}

.core-grid{

grid-template-columns:1fr;

gap:25px;

}

.core-card{

padding:35px 25px;

}

.core-card h3{

font-size:28px;

}

.core-card p{

font-size:16px;

}

}

@media(max-width:480px){

.core-header h2{

font-size:34px;

}

.core-header p{

font-size:16px;

}

.core-icon{

width:65px;

height:65px;

font-size:26px;

}

}

/*================ OUR STRENGTH ================*/

.strength-section{

    padding:120px 0;

    background:#ffffff;

}

.strength-header{

    max-width:900px;

    margin:auto;

    text-align:center;

    margin-bottom:70px;

}

.strength-tag{

    display:inline-block;

    font-size:16px;

    font-weight:700;

    letter-spacing:2px;

    color:#2b50d9;

    margin-bottom:20px;

}

.strength-header h2{

    font-size:clamp(2.5rem,5vw,4.2rem);

    font-weight:800;

    color:#0f172a;

    margin-bottom:25px;

}

.strength-header p{

    font-size:clamp(1rem,2vw,1.35rem);

    color:#000000;

    line-height:1.8;

}

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

.strength-grid{

    display:grid;

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

    gap:30px;

}

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

.strength-card{

    position:relative;

    background:#fff;

    border-radius:26px;

    padding:45px 30px;

    text-align:center;

    border:1px solid #e5e7eb;

    box-shadow:0 12px 30px rgba(0,0,0,.08);

    transition:.4s;

    overflow:hidden;

}

.strength-card:hover{

    transform:translateY(-12px);

    box-shadow:0 20px 45px rgba(0,0,0,.15);

}

.top-border{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(
        90deg,
        #2b50d9,
        #ffb000
    );

}

/*================ ICON ================*/

.strength-icon{

    width:70px;

    height:70px;

    margin:auto;

    margin-bottom:25px;

    border-radius:18px;

    display:flex;

    justify-content:center;

    align-items:center;

    background:linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    color:#fff;

    font-size:30px;

}

/*================ TITLE ================*/

.strength-card h3{

    font-size:30px;

    color:#2643b5;

    font-weight:700;

    line-height:1.3;

    margin-bottom:20px;

}

/*================ TEXT ================*/

.strength-card p{

    font-size:17px;

    color:#000000;

    line-height:1.9;

}

/*================ Animation ================*/

.hide-strength{

    opacity:0;

    transform:translateY(60px);

}

.show-strength{

    opacity:1;

    transform:translateY(0);

    transition:.8s ease;

}

/*================ Responsive ================*/

@media(max-width:1200px){

.strength-grid{

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

}

}

@media(max-width:768px){

.strength-section{

padding:80px 0;

}

.strength-grid{

grid-template-columns:1fr;

gap:25px;

}

.strength-card{

padding:35px 25px;

}

.strength-card h3{

font-size:26px;

}

}

@media(max-width:480px){

.strength-header h2{

font-size:34px;

}

.strength-header p{

font-size:16px;

}

.strength-card{

padding:30px 22px;

}

.strength-icon{

width:60px;

height:60px;

font-size:24px;

}

}

/*================ FOUNDER =================*/

.founder-section{

padding:120px 0;

background:#ffffff;

}

.founder-header{

text-align:center;

max-width:900px;

margin:auto;

margin-bottom:80px;

}

.section-tag{

display:inline-block;

font-size:15px;

font-weight:700;

letter-spacing:2px;

color:#3154d6;

margin-bottom:20px;

}

.founder-header h2{

font-size:clamp(3.4rem,5vw,6rem);

font-weight:800;

color:#0f172a;

margin-bottom:20px;

}

.founder-header p{

font-size:clamp(1rem,2vw,1.3rem);

color:#000000;

line-height:1.8;

}

/*================ Layout ================*/

.founder-wrapper{

display:grid;

grid-template-columns:380px 1fr;

gap:70px;

align-items:center;

}

/*================ Image ================*/

.founder-image{

position:relative;

}

.founder-image img{

width:100%;

border-radius:28px;

box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.experience{

position:absolute;

left:20px;

bottom:20px;

padding:14px 25px;

border-radius:40px;

background:linear-gradient(
135deg,
#ffb400,
#ffcf40
);

font-weight:700;

font-size:15px;

color:#0f172a;

}

/*================ Content ================*/

.founder-content h3{

font-size:48px;

font-weight:800;

color:#1e293b;

margin-bottom:10px;

}

.founder-content h4{

font-size:24px;

color:#3154d6;

margin-bottom:25px;

}

.founder-badges{

display:flex;

flex-wrap:wrap;

gap:15px;

margin-bottom:35px;

}

.founder-badges span{

padding:12px 24px;

border-radius:50px;

background:#eef4ff;

border:1px solid #cddcff;

color:#3154d6;

font-weight:600;

}

/*================ Quote ================*/

.founder-quote{

background:#f5f8ff;

padding:40px;

border-left:5px solid #ffb400;

border-radius:22px;

position:relative;

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

}

.founder-quote i{

font-size:40px;

color:#ffb400;

margin-bottom:20px;

}

.founder-quote p{

font-size:19px;

line-height:2;

color:#021d45;

font-style:italic;

}

.founder-quote h5{

margin-top:30px;

text-align:right;

font-size:20px;

font-weight:700;

color:#1e293b;

}

/*================ Animation ================*/

.hide-founder{

opacity:0;

transform:translateY(60px);

}

.show-founder{

opacity:1;

transform:translateY(0);

transition:.9s ease;

}

/*================ Responsive ================*/

@media(max-width:1100px){

.founder-wrapper{

grid-template-columns:1fr;

}

.founder-image{

max-width:420px;

margin:auto;

}

.founder-content{

text-align:center;

}

.founder-badges{

justify-content:center;

}

.founder-quote h5{

text-align:center;

}

}

@media(max-width:768px){

.founder-section{

padding:80px 0;

}

.founder-content h3{

font-size:38px;

}

.founder-content h4{

font-size:20px;

}

.founder-quote{

padding:30px;

}

.founder-quote p{

font-size:17px;

line-height:1.8;

}

}

@media(max-width:480px){

.founder-content h3{

font-size:30px;

}

.founder-header h2{

font-size:34px;

}

.experience{

font-size:13px;

padding:12px 18px;

}

.founder-badges span{

width:100%;

text-align:center;

}

}

/* ================= CTA SECTION ================= */

.cta-section{

    padding:120px 0;

    background:linear-gradient(
        135deg,
        #edf9ff,
        #f5f1ff
    );

}

.cta-content{

    text-align:center;

    max-width:900px;

    margin:auto;

}

.cta-content h2{

    font-size:80px;

    font-weight:800;

    line-height:1.15;

    max-width:1200px;

    margin:0 auto 25px;

    white-space:nowrap;

}

.cta-content p{

    max-width:760px;

    margin:auto;

    font-size:clamp(1rem,2vw,1.5rem);

    color:#000000;

    line-height:1.7;

    margin-bottom:55px;

}

/* Buttons */

.cta-buttons{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:28px;

    flex-wrap:wrap;

}

.cta-btn{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    text-decoration:none;

    font-size:18px;

    font-weight:700;

    border-radius:60px;

    padding:18px 40px;

    transition:.35s;

}

/* Primary */

.primary-btn{

    color:#fff;

    background:linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    box-shadow:
    0 15px 35px rgba(80,80,255,.25);

}

.primary-btn:hover{

    transform:translateY(-5px);

    box-shadow:
    0 25px 45px rgba(80,80,255,.35);

}

.primary-btn i{

    transition:.3s;

}

.primary-btn:hover i{

    transform:translateX(6px);

}

/* Secondary */

.secondary-btn{

    background:#ffffff;

    color:#0f172a;

    border:1px solid #d9e3ef;

    box-shadow:
    0 8px 20px rgba(0,0,0,.05);

}

.secondary-btn:hover{

    background:#0f172a;

    color:#ffffff;

    border-color:#0f172a;

    transform:translateY(-5px);

}

/* ================= RESPONSIVE ================= */
@media (max-width:1200px){

    .cta-content h2{

        font-size:64px;

        white-space:normal;

    }

}

@media (max-width:992px){

    .cta-content h2{

        font-size:52px;

    }

}

@media (max-width:768px){

    .cta-content h2{

        font-size:42px;

    }

}

@media (max-width:480px){

    .cta-content h2{

        font-size:34px;

    }

}

@media(max-width:768px){

    .cta-section{

        padding:80px 0;

    }

    .cta-buttons{

        flex-direction:column;

        gap:18px;

    }

    .cta-btn{

        width:100%;

        max-width:340px;

    }

}

/* ================= FOOTER ================= */

.footer{

    background:#1e293b;

    color:#cbd5e1;

    padding:90px 0 25px;

}

.footer-grid{

    display:grid;

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

    gap:50px;

}

.footer-column h3{

    font-size:28px;

    color:#ffffff;

    margin-bottom:28px;

    font-weight:700;

}

/* Logo */

.footer-logo{

    display:inline-block;

    margin-bottom:25px;

}

.footer-logo img{

    width:100%;

    max-width:190px;

    height:auto;

}

/* About */

.footer-about p{

    line-height:1.9;

    margin-bottom:35px;

    color:#94a3b8;

    font-size:17px;

}

/* Contact */

.footer-contact{

    display:flex;

    flex-direction:column;

    gap:22px;

}

.contact-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

}

.contact-item i{

    width:48px;

    height:48px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:14px;

    background:linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    color:#ffffff;

    flex-shrink:0;

}

.contact-item a,
.contact-item span{

    color:#cbd5e1;

    text-decoration:none;

    line-height:1.8;

    transition:.3s;

}

.contact-item a:hover{

    color:#00d4ff;

}

/* Links */

.footer-column ul{

    list-style:none;

}

.footer-column ul li{

    margin-bottom:18px;

}

.footer-column ul li a{

    color:#cbd5e1;

    text-decoration:none;

    transition:.3s;

    position:relative;

}

.footer-column ul li a:hover{

    color:#00d4ff;

    padding-left:8px;

}

/* Social */

.footer-social{

    display:flex;

    flex-wrap:wrap;

    gap:15px;

    margin-top:35px;

}

.footer-social a{

    width:50px;

    height:50px;

    border-radius:15px;

    display:flex;

    justify-content:center;

    align-items:center;

    text-decoration:none;

    color:#ffffff;

    background:linear-gradient(
        135deg,
        #00c6ff,
        #6a11cb
    );

    transition:.35s;

}

.footer-social a:hover{

    transform:translateY(-6px);

    box-shadow:0 12px 30px rgba(0,198,255,.35);

}

/* Bottom */

.footer-bottom{

    margin-top:70px;

    padding-top:25px;

    border-top:1px solid rgba(255,255,255,.12);

    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:20px;

}

.footer-bottom p{

    color:#94a3b8;

}

.footer-bottom-links{

    display:flex;

    gap:25px;

}

.footer-bottom-links a{

    color:#94a3b8;

    text-decoration:none;

    transition:.3s;

}

.footer-bottom-links a:hover{

    color:#00d4ff;

}

/* Responsive */

@media(max-width:1100px){

    .footer-grid{

        grid-template-columns:1fr 1fr;

        gap:50px;

    }

}

@media(max-width:768px){

    .footer{

        padding:70px 0 25px;

    }

    .footer-grid{

        grid-template-columns:1fr;

        gap:45px;

    }

    .footer-column h3{

        font-size:24px;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

    }

    .footer-bottom-links{

        flex-wrap:wrap;

        justify-content:center;

    }

}

@media(max-width:768px){

    .cta-buttons{

        flex-direction:column;

        align-items:center;

    }

    .cta-btn{

        width:100%;

        max-width:350px;

    }

    .contact-box p{

        font-size:24px;

    }

}

@media (max-width:992px){

.our-story .container{

    position:relative;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    padding:120px 30px 60px;

    gap:40px;

}

.story-heading{

    max-width:100%;

    text-align:center;

}

.story-full{

    width:100%;

    max-width:900px;

    margin:0;

    padding:45px;

}

}

@media (max-width:768px){

.about-slider{

    min-height:1000px;

}

.about-overlay{

    min-height:1000px;

}

.our-story .container{

    position:relative;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:flex-start;

    padding:100px 20px 50px;

    gap:35px;

}

.story-heading{

    width:100%;

    text-align:center;

}

.story-heading h2{

    font-size:48px;

}

.story-heading p{

    font-size:18px;

}

.story-full{

    width:100%;

    padding:30px 22px;

    border-radius:22px;

}

.story-full h3{

    font-size:34px;

}

.story-full h4{

    font-size:20px;

}

.story-highlight{

    padding:20px;

}

.story-full p{

    font-size:16px;

    text-align:left;

}

}

@media (max-width:480px){

.story-heading h2{

    font-size:38px;

}

.story-heading p{

    font-size:16px;

}

.story-full{

    padding:22px 18px;

}

.story-full h3{

    font-size:28px;

}

.story-full h4{

    font-size:18px;

}

.story-full p{

    font-size:15px;

}

.story-highlight{

    padding:18px;

}

}