/**
 * Putushart — About Page
 */

/* ---------------------------------------------------------
   Page
--------------------------------------------------------- */

.putushart-about-page{
	background:#ffffff;
}

/* ---------------------------------------------------------
   Shared Container
--------------------------------------------------------- */

.putushart-about-page__container{
	max-width:1320px;
	margin:0 auto;
	padding-left:20px;
	padding-right:20px;
}

/* ---------------------------------------------------------
   Hero
--------------------------------------------------------- */

.putushart-about-page__hero{
	padding:58px 0 46px;

	text-align:center;

	background:
		linear-gradient(
			180deg,
			#faf7fd 0%,
			#ffffff 100%
		);
}

.putushart-about-page__eyebrow{
	margin:0 0 10px;

	font-size:14px;
	font-weight:700;
	line-height:1.4;

	letter-spacing:.11em;
	text-transform:uppercase;

	color:#8250bd;
}

.putushart-about-page__title{
	margin:0 0 16px;

	font-size:48px;
	font-weight:700;
	line-height:1.15;

	letter-spacing:-.025em;

	color:#222222;
}

.putushart-about-page__intro{
	max-width:720px;

	margin:0 auto;

	font-size:17px;
	font-weight:400;
	line-height:1.8;

	color:#666666;
}

/* ---------------------------------------------------------
   Responsive
--------------------------------------------------------- */

@media (max-width:768px){

	.putushart-about-page__hero{
		padding:46px 0 38px;
	}

	.putushart-about-page__title{
		font-size:40px;
	}

	.putushart-about-page__intro{
		font-size:16px;
	}

}

@media (max-width:480px){

	.putushart-about-page__container{
		padding-left:16px;
		padding-right:16px;
	}

	.putushart-about-page__hero{
		padding:36px 0 32px;
	}

	.putushart-about-page__title{
		font-size:34px;
	}

}

/* =========================================================
   WORDPRESS EDITABLE ABOUT HERO
========================================================= */

.putushart-about-hero{
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);

    padding:58px 20px 46px;

    text-align:center;

    background:linear-gradient(
        180deg,
        #faf7fd 0%,
        #ffffff 100%
    );
}


/* OUR STORY */

.putushart-about-hero p:first-of-type{
    margin:0 0 10px;

    font-size:14px;
    font-weight:700;
    line-height:1.4;

    letter-spacing:.11em;
    text-transform:uppercase;

    color:#8250bd;
}


/* MAIN HEADING */

.putushart-about-hero h1,
.putushart-about-hero h2{
    margin:0 0 16px;

    font-size:48px;
    font-weight:700;
    line-height:1.15;

    letter-spacing:-.025em;

    color:#222222;
}


/* DESCRIPTION */

.putushart-about-hero p:last-of-type{
    max-width:720px;

    margin:0 auto;

    font-size:17px;
    line-height:1.8;

    color:#666666;
}


/* TABLET */

@media (max-width:768px){

    .putushart-about-hero{
        padding:46px 20px 38px;
    }

    .putushart-about-hero h1,
    .putushart-about-hero h2{
        font-size:40px;
    }

}


/* MOBILE */

@media (max-width:480px){

    .putushart-about-hero{
        padding:36px 16px 32px;
    }

    .putushart-about-hero h1,
    .putushart-about-hero h2{
        font-size:34px;
    }

   .putushart-about-hero p:last-of-type{
        font-size:16px;
    }

}

/* ==========================================================
   ABOUT PAGE — MEET THE ARTIST
   ========================================================== */

.putushart-about-artist{
    max-width:1320px;
    margin:0 auto;
    padding:55px 40px 60px;
}

.putushart-about-artist > .wp-block-columns{
    display:grid;
    grid-template-columns:minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap:80px;
    align-items:center;
    margin:0;
}

/* Artist image */

.putushart-about-artist .wp-block-image{
    margin:0;
}

.putushart-about-artist .wp-block-image img{
    display:block;
    width:100%;
    height:620px;
    object-fit:cover;
    object-position:center;
    border-radius:18px;
}

/* Text column */

.putushart-about-artist .wp-block-column:last-child{
    text-align:left;
}

.putushart-about-artist .wp-block-column:last-child > p:first-child{
    margin:0 0 14px;

    color:#8a4fd3;
    font-size:13px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

.putushart-about-artist h2{
    margin:0 0 10px;

    color:#111;
    font-size:48px;
    line-height:1.15;
    font-weight:600;
}

.putushart-about-artist h2 + p{
    margin:0 0 30px;

    color:#777;
    font-size:16px;
    font-weight:500;
}

.putushart-about-artist .wp-block-column:last-child p{
    max-width:610px;
    font-size:17px;
    line-height:1.85;
}

.putushart-about-artist .wp-block-column:last-child p:not(:first-child){
    margin-top:0;
    margin-bottom:18px;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:1024px){

    .putushart-about-artist{
        padding:65px 30px 75px;
    }

    .putushart-about-artist > .wp-block-columns{
        gap:50px;
    }

    .putushart-about-artist .wp-block-image img{
        height:540px;
    }

    .putushart-about-artist h2{
        font-size:42px;
    }
}


@media (max-width:768px){

    .putushart-about-artist{
        padding:55px 20px 65px;
    }

    .putushart-about-artist > .wp-block-columns{
        display:block;
    }

    .putushart-about-artist .wp-block-column:first-child{
        margin-bottom:40px;
    }

    .putushart-about-artist .wp-block-image img{
        height:auto;
        max-height:600px;
        object-fit:cover;
    }

    .putushart-about-artist h2{
        font-size:38px;
    }
}


@media (max-width:576px){

    .putushart-about-artist{
        padding:45px 18px 55px;
    }

    .putushart-about-artist .wp-block-image img{
        border-radius:12px;
    }

    .putushart-about-artist h2{
        font-size:34px;
    }

    .putushart-about-artist .wp-block-column:last-child p{
        font-size:16px;
        line-height:1.75;
    }
}

/* ==========================================================
   ABOUT PAGE — ART & PHILOSOPHY
   ========================================================== */

.putushart-about-philosophy{
    max-width:1320px;
    margin:0 auto;

    padding:10px 40px 60px;
}


/* Eyebrow */

.putushart-about-philosophy > p:first-of-type{
    margin:0 0 14px;

    color:#8a4fd3;

    font-size:13px;
    font-weight:700;
    line-height:1.4;

    letter-spacing:1.8px;
    text-transform:uppercase;
}


/* Heading */

.putushart-about-philosophy h2{
    max-width:760px;

    margin:0 0 22px;

    color:#111111;

    font-size:44px;
    font-weight:600;
    line-height:1.18;

    letter-spacing:-.02em;
}


/* Story text */

.putushart-about-philosophy > p:not(:first-of-type){
    max-width:900px;

    margin:0 0 16px;

    color:#555555;

    font-size:17px;
    line-height:1.85;
}


/* Artwork */

.putushart-about-philosophy .wp-block-image{
    margin:42px 0 0;
}

.putushart-about-philosophy .wp-block-image img{
    display:block;

    width:100%;
    max-height:620px;

    object-fit:cover;
    object-position:center;

    border-radius:18px;
}


/* ----------------------------------------------------------
   Tablet
---------------------------------------------------------- */

@media (max-width:1024px){

    .putushart-about-philosophy{
        padding:20px 30px 75px;
    }

    .putushart-about-philosophy h2{
        font-size:40px;
    }

}


/* ----------------------------------------------------------
   Mobile
---------------------------------------------------------- */

@media (max-width:768px){

    .putushart-about-philosophy{
        padding:10px 20px 65px;
    }

    .putushart-about-philosophy h2{
        font-size:36px;
    }

    .putushart-about-philosophy .wp-block-image{
        margin-top:30px;
    }

}


@media (max-width:576px){

    .putushart-about-philosophy{
        padding:5px 18px 55px;
    }

    .putushart-about-philosophy h2{
        font-size:31px;
    }

    .putushart-about-philosophy > p:not(:first-of-type){
        font-size:16px;
        line-height:1.75;
    }

    .putushart-about-philosophy .wp-block-image img{
        border-radius:12px;
    }

}

/* ==========================================================
   ABOUT PAGE — THE PUTUSHART STORY
   ========================================================== */

.putushart-about-story{
    max-width:1320px;
    margin:0 auto;
    padding:20px 40px 70px;
}


/* Eyebrow */

.putushart-about-story > p:first-of-type{
    margin:0 0 14px;

    color:#8a4fd3;

    font-size:13px;
    font-weight:700;
    line-height:1.4;

    letter-spacing:1.8px;
    text-transform:uppercase;
}


/* Heading */

.putushart-about-story h2{
    max-width:760px;

    margin:0 0 24px;

    color:#111111;

    font-size:44px;
    font-weight:600;
    line-height:1.18;

    letter-spacing:-.02em;
}


/* Story copy */

.putushart-about-story > p:not(:first-of-type){
    max-width:940px;

    margin:0 0 18px;

    color:#555555;

    font-size:17px;
    line-height:1.85;
}


/* Journey image */

.putushart-about-story .wp-block-image{
    margin:44px 0 0;
}

.putushart-about-story .wp-block-image img{
    display:block;

    width:100%;
    height:auto;

    border-radius:18px;

    box-shadow:0 18px 50px rgba(0,0,0,.08);
}


/* ----------------------------------------------------------
   Tablet
---------------------------------------------------------- */

@media (max-width:1024px){

    .putushart-about-story{
        padding:15px 30px 65px;
    }

    .putushart-about-story h2{
        font-size:40px;
    }

}


/* ----------------------------------------------------------
   Mobile
---------------------------------------------------------- */

@media (max-width:768px){

    .putushart-about-story{
        padding:10px 20px 55px;
    }

    .putushart-about-story h2{
        font-size:36px;
    }

    .putushart-about-story .wp-block-image{
        margin-top:30px;
    }

}


@media (max-width:576px){

    .putushart-about-story{
        padding:5px 18px 50px;
    }

    .putushart-about-story h2{
        font-size:31px;
    }

    .putushart-about-story > p:not(:first-of-type){
        font-size:16px;
        line-height:1.75;
    }

    .putushart-about-story .wp-block-image img{
        border-radius:12px;
    }

}

/* ==========================================================
   ABOUT PAGE — CLOSING NOTE
   ========================================================== */

.putushart-about-closing{
    max-width:980px;
    margin:0 auto;
    padding:50px 40px 55px;

    text-align:center;
}

.putushart-about-closing > p:first-of-type{
    margin:0 0 12px;

    color:#8a4fd3;

    font-size:13px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

.putushart-about-closing h2{
    margin:0 0 22px;

    font-size:40px;
    line-height:1.2;
    font-weight:600;

    color:#111;
}

.putushart-about-closing > p:not(:first-of-type){
    max-width:760px;
    margin:0 auto 16px;

    font-size:17px;
    line-height:1.8;

    color:#555;
}

.putushart-about-closing > p:last-of-type{
    margin-top:24px;

    font-size:20px;
    font-weight:600;

    color:#111;
}


/* ==========================================================
   ABOUT PAGE — FINAL CTA
   ========================================================== */

.putushart-about-cta{
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);

    padding:70px 20px 76px;

    text-align:center;

    background:
        linear-gradient(
            135deg,
            #f4edfb 0%,
            #fbf8fd 52%,
            #f7f2fb 100%
        );
}

.putushart-about-cta > p:first-of-type{
    margin:0 0 12px;

    color:#8a4fd3;

    font-size:13px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

.putushart-about-cta h2{
    max-width:760px;
    margin:0 auto 18px;

    font-size:42px;
    line-height:1.2;
    font-weight:600;

    color:#111;
}

.putushart-about-cta > p:not(:first-of-type){
    max-width:720px;
    margin:0 auto 28px;

    font-size:17px;
    line-height:1.8;

    color:#555;
}

.putushart-about-cta .wp-block-buttons{
    justify-content:center;
}

.putushart-about-cta .wp-block-button__link{
    padding:14px 30px;

    border-radius:999px;

    background:#8250bd;
    color:#fff;

    font-size:15px;
    font-weight:600;

    transition:
        transform .2s ease,
        background .2s ease;
}

.putushart-about-cta .wp-block-button__link:hover{
    background:#6f3fa4;
    transform:translateY(-2px);
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:768px){

    .putushart-about-closing{
        padding:40px 20px 45px;
    }

    .putushart-about-closing h2{
        font-size:34px;
    }

    .putushart-about-cta{
        padding:58px 20px 62px;
    }

    .putushart-about-cta h2{
        font-size:36px;
    }

}

@media (max-width:576px){

    .putushart-about-closing{
        padding:34px 18px 40px;
    }

    .putushart-about-closing h2{
        font-size:30px;
    }

    .putushart-about-closing > p:not(:first-of-type),
    .putushart-about-cta > p:not(:first-of-type){
        font-size:16px;
        line-height:1.75;
    }

    .putushart-about-cta{
        padding:50px 18px 54px;
    }

    .putushart-about-cta h2{
        font-size:31px;
    }

}