/*==================================================
VEDIC SPIRITUALS
SPIRITUAL TALKS
spiritual-talks.css
==================================================*/

:root{

--bg:#f8f5ef;
--bg-light:#fcfaf6;
--white:#ffffff;

--heading:#2f2a24;
--text:#6a645d;

--gold:#b28a45;
--gold-dark:#8b6b33;

--border:#e6ddd0;

--shadow:0 15px 35px rgba(0,0,0,.08);

}

/*==================================
GENERAL
==================================*/

section{

padding:110px 0;

}

.container{

width:min(1200px,92%);
margin:auto;

}

.narrow{

max-width:760px;
margin:auto;
text-align:center;

}

img{

width:100%;
display:block;

}

a{

text-decoration:none;

}

/*==================================
HERO
==================================*/

.talks-hero{

height:90vh;

background:url("../images/spiritual-talks.jpg") center center/cover no-repeat;

display:flex;
align-items:center;
justify-content:center;

position:relative;

text-align:center;

}

.hero-overlay{

position:absolute;
inset:0;

background:rgba(0,0,0,.48);

}

.hero-content{

position:relative;
z-index:5;

color:white;

max-width:760px;

}

.hero-label{

letter-spacing:5px;

font-size:.82rem;

margin-bottom:25px;

opacity:.9;

}

.hero-content h1{

font-family:"Cormorant Garamond",serif;

font-size:4.4rem;

font-weight:500;

line-height:1.1;

margin-bottom:25px;

}

.hero-content p{

font-size:1.15rem;

line-height:1.9;

margin-bottom:40px;

}

/*==================================
BUTTON
==================================*/

.primary-btn{

display:inline-block;

padding:15px 42px;

border:1px solid var(--gold);

color:white;

transition:.35s;

}

.primary-btn:hover{

background:var(--gold);

}

/*==================================
HEADINGS
==================================*/

.section-heading{

text-align:center;

margin-bottom:70px;

}

.section-label{

color:var(--gold);

letter-spacing:4px;

font-size:.82rem;

margin-bottom:15px;

}

.section-heading h2{

font-family:"Cormorant Garamond",serif;

font-size:3rem;

font-weight:500;

color:var(--heading);

margin-bottom:18px;

}

.gold-line{

width:70px;

height:2px;

background:var(--gold);

margin:auto;

}

/*==================================
FEATURED TALK
==================================*/

.featured-talk{

background:var(--bg);

}

.featured-card{

display:grid;

grid-template-columns:1.2fr 1fr;

gap:50px;

align-items:center;

background:white;

border-radius:18px;

padding:35px;

box-shadow:var(--shadow);

}

.featured-image img{

height:420px;

object-fit:cover;

border-radius:12px;

}

.featured-content{

display:flex;

flex-direction:column;

justify-content:center;

}

.duration{

color:var(--gold);

letter-spacing:2px;

text-transform:uppercase;

font-size:.82rem;

margin-bottom:20px;

}

.featured-content p{

font-size:1.05rem;

line-height:1.9;

margin-bottom:35px;

color:var(--text);

}

.featured-content a{

color:var(--gold);

font-weight:500;

}

/*==================================
VIGYAN BHAIRAV TANTRA FEATURED TALK
==================================*/

.vigyan-card{

```
padding:40px;
```

}

/* TITLE */

.featured-content h3{

```
font-family:"Cormorant Garamond",serif;

font-size:2.6rem;

font-weight:500;

color:var(--heading);

line-height:1.2;

margin-bottom:25px;
```

}

/* SECONDARY PARAGRAPH */

.featured-content p + p{

```
margin-top:-15px;
```

}

/* AUDIO */

.talk-audio{

```
margin-top:15px;

margin-bottom:35px;

padding:25px 0;

border-top:1px solid var(--border);

border-bottom:1px solid var(--border);
```

}

.audio-label{

```
color:var(--gold) !important;

font-size:.78rem !important;

letter-spacing:3px;

text-transform:uppercase;

margin-bottom:15px !important;
```

}

.talk-audio audio{

```
width:100%;

max-width:520px;

height:42px;
```

}

/* BOOK CONNECTION */

.book-connection{

```
padding-top:5px;
```

}

.book-label{

```
color:var(--gold) !important;

font-size:.78rem !important;

letter-spacing:3px;

text-transform:uppercase;

margin-bottom:12px !important;
```

}

.book-connection p{

```
font-size:.98rem !important;

line-height:1.8 !important;

margin-bottom:18px !important;
```

}

.book-connection a{

```
color:var(--gold);

font-weight:500;

transition:.3s;
```

}

.book-connection a:hover{

```
color:var(--gold-dark);
```

}

/*==================================
MOBILE
==================================*/

@media(max-width:768px){

```
.vigyan-card{

    padding:20px;

}

.featured-content h3{

    font-size:2.1rem;

}

.talk-audio{

    margin-top:10px;

    margin-bottom:25px;

}

.talk-audio audio{

    width:100%;

}
```

}

/*==================================
TOPICS
==================================*/

.talk-topics{

background:var(--bg-light);

}

.topics-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.topic-card{

background:white;

padding:45px;

text-align:center;

font-family:"Cormorant Garamond",serif;

font-size:1.5rem;

border-radius:16px;

border:1px solid var(--border);

transition:.35s;

cursor:pointer;

}

.topic-card:hover{

transform:translateY(-8px);

box-shadow:var(--shadow);

border-color:var(--gold);

}

/*==================================
RECENT TALKS
==================================*/

.recent-talks{

background:var(--bg);

}

.talk-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

}

.talk-card{

background:white;

border-radius:18px;

overflow:hidden;

box-shadow:var(--shadow);

transition:.35s;

}

.talk-card:hover{

transform:translateY(-10px);

}

.talk-card img{

height:240px;

object-fit:cover;

}

.talk-card h3{

font-family:"Cormorant Garamond",serif;

font-size:1.8rem;

padding:28px 28px 12px;

color:var(--heading);

}

.talk-card span{

display:block;

padding:0 28px;

color:var(--gold);

font-size:.82rem;

letter-spacing:2px;

margin-bottom:18px;

}

.talk-card p{

padding:0 28px 28px;

line-height:1.9;

color:var(--text);

}

.talk-card a{

display:inline-block;

margin:0 28px 32px;

color:var(--gold);

}

/*==================================
SERIES
==================================*/

.wisdom-series{

background:var(--bg-light);

}

.series-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:30px;

}

.series-card{

background:white;

padding:50px;

text-align:center;

border-radius:18px;

border:1px solid var(--border);

transition:.35s;

}

.series-card:hover{

transform:translateY(-8px);

box-shadow:var(--shadow);

}

.series-card h3{

font-family:"Cormorant Garamond",serif;

font-size:2rem;

margin-bottom:18px;

color:var(--heading);

}

.series-card p{

color:var(--gold);

letter-spacing:2px;

}

/*==================================
/*==================================
TABLET
==================================*/

@media (max-width:992px){

.hero-content h1{
font-size:3.2rem;
}

.featured-card{

grid-template-columns:1fr;
gap:35px;

}

.featured-image img{

height:320px;

}

.talk-grid{

grid-template-columns:repeat(2,1fr);

gap:25px;

}

.series-grid{

grid-template-columns:1fr;

}

}
/*==================================
MOBILE
==================================*/

@media (max-width:768px){

section{

padding:70px 0;

}

.hero-content{

padding:0 20px;

}

.hero-content h1{

font-size:2.6rem;

}

.hero-content p{

font-size:1rem;

line-height:1.8;

}

.section-heading{

margin-bottom:45px;

}

.section-heading h2{

font-size:2.2rem;

}

.featured-card{

padding:20px;

}

.featured-image img{

height:240px;

}

.talk-grid{

grid-template-columns:1fr;

}

.talk-card img{

height:220px;

}

.primary-btn{

padding:14px 28px;

}

}
@media(max-width:480px){

.hero-content h1{

font-size:2rem;

}

.hero-label{

font-size:.72rem;

letter-spacing:3px;

}

.section-heading h2{

font-size:1.8rem;

}

.talk-card h3{

font-size:1.5rem;

}

.featured-content p{

font-size:.95rem;

}

}
