/* =========================================================
   Royal Priesthood Bilingual Institute — shared stylesheet
   Edit colors in :root below to re-theme the whole site.
   ========================================================= */
:root{
  --black:#0e0d0b;
  --charcoal:#17150f;
  --charcoal-2:#201d16;
  --gold:#c9a84c;
  --gold-light:#e6cf8a;
  --gold-dim:#9c7f34;
  --cream:#f8f5ee;
  --white:#ffffff;
  --grey:#7d7871;
  --line: rgba(201,168,76,0.25);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--charcoal);
  font-family:'Inter', system-ui, -apple-system, sans-serif;
  line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,h4{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-weight:700;
  margin:0;
  color:var(--black);
}
.eyebrow{
  font-family:'Marcellus', serif;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-size:.75rem;
  color:var(--gold-dim);
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
section{position:relative;}

/* ---------- Header ---------- */
header{
  position:sticky; top:0; z-index:200;
  background:rgba(14,13,11,0.96);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(6px);
}
.navbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 28px; max-width:1180px; margin:0 auto; gap:14px 18px;
  flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:14px; flex-shrink:0;}
.brand img{height:76px;width:auto;}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-text .full{
  font-family:'Cormorant Garamond',serif; color:var(--white);
  font-size:1.3rem; font-weight:700; letter-spacing:.02em;
}
.brand-text .sub{
  font-family:'Marcellus',serif; color:var(--gold);
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; margin-top:3px;
}
nav.links{display:flex; gap:20px; align-items:center; flex:1 1 auto; justify-content:center;}
nav.links a{
  color:#e9e4d6; font-size:.82rem; letter-spacing:.02em; font-weight:500;
  padding:6px 0; border-bottom:1px solid transparent; transition:.2s; white-space:nowrap;
}
nav.links a:hover, nav.links a.active{color:var(--gold-light); border-color:var(--gold);}
.header-actions{display:flex; align-items:center; gap:10px; flex-shrink:0;}
.btn{
  display:inline-block; padding:11px 26px; font-size:.8rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; border-radius:2px;
  transition:.25s; cursor:pointer; border:1px solid transparent;
}
.btn-gold{background:var(--gold); color:var(--black);}
.btn-gold:hover{background:var(--gold-light);}
.btn-outline{border-color:var(--gold); color:var(--gold-light);}
.btn-outline:hover{background:rgba(201,168,76,0.12);}
.btn-outline-dark{border-color:var(--charcoal); color:var(--charcoal);}
.btn-outline-dark:hover{background:rgba(14,13,11,0.06);}
.menu-toggle{display:none;background:none;border:none;color:var(--gold);font-size:1.6rem;cursor:pointer;}

/* Language toggle button */
.lang-toggle{
  display:flex; align-items:center; gap:6px; padding:8px 14px;
  border:1px solid var(--gold-dim); border-radius:20px; background:transparent;
  color:var(--gold-light); font-size:.76rem; font-weight:600; letter-spacing:.05em;
  cursor:pointer; transition:.2s;
}
.lang-toggle:hover{border-color:var(--gold); background:rgba(201,168,76,0.1);}
.lang-toggle .globe{font-size:.9rem;}
.lang-toggle .code{padding:2px 6px; border-radius:10px; font-size:.68rem;}
.lang-toggle .code.on{background:var(--gold); color:var(--black);}
.lang-toggle .code.off{color:#9a9585;}

/* ---------- Hero Slider ---------- */
.hero-slider{
  position:relative; min-height:92vh; display:flex; align-items:center;
  color:var(--white); overflow:hidden; background:var(--black);
}
.hero-slides{position:absolute; inset:0; z-index:1;}
.hero-slide{
  position:absolute; inset:0; opacity:0; transition:opacity 1.4s ease;
  background-size:cover; background-position:center;
}
.hero-slide.is-active{opacity:1;}
.hero-slide::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,9,7,.72), rgba(10,9,7,.88) 55%, var(--black) 100%);
}
.hero-slider .wrap{padding-top:60px;padding-bottom:60px;position:relative;z-index:5;}
.hero-logo{height:150px;width:auto;margin-bottom:22px;filter:drop-shadow(0 6px 18px rgba(0,0,0,.5));}
.hero-slider .eyebrow{color:var(--gold-light);}
.hero-slider h1{
  font-size:clamp(2.4rem, 5.4vw, 4.4rem); color:var(--white);
  line-height:1.05; margin-top:14px; letter-spacing:.01em;
}
.hero-slider .motto{
  font-family:'Marcellus',serif; font-size:1.1rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-light); margin-top:20px;
}
.hero-slider .subtext{
  max-width:620px; margin-top:16px; color:#e7e2d3; font-size:1.02rem;
}
.hero-slider .cta-row{display:flex; gap:16px; margin-top:36px; flex-wrap:wrap;}
.hero-slider .badge{
  display:inline-block; margin-top:28px; padding:8px 18px; border:1px solid var(--gold);
  color:var(--gold-light); font-family:'Marcellus',serif; letter-spacing:.12em;
  font-size:.72rem; text-transform:uppercase; border-radius:2px;
}

/* Slider controls */
.slider-dots{
  position:absolute; z-index:6; bottom:28px; left:0; right:0;
  display:flex; justify-content:center; gap:10px;
}
.slider-dots button{
  width:10px; height:10px; border-radius:50%; border:1px solid var(--gold);
  background:transparent; cursor:pointer; padding:0; transition:.2s;
}
.slider-dots button.is-active{background:var(--gold);}
.slider-arrow{
  position:absolute; z-index:6; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border-radius:50%; border:1px solid var(--gold-dim);
  background:rgba(14,13,11,.4); color:var(--gold-light); font-size:1.1rem;
  cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.2s;
}
.slider-arrow:hover{background:rgba(201,168,76,.2); border-color:var(--gold);}
.slider-arrow.prev{left:20px;}
.slider-arrow.next{right:20px;}
.slider-caption{
  position:absolute; z-index:6; bottom:56px; left:28px;
  font-family:'Marcellus',serif; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-light); background:rgba(14,13,11,.55); padding:8px 14px; border-radius:2px;
  display:none;
}
@media(min-width:720px){ .slider-caption{display:block;} }

/* ---------- Section headings ---------- */
.section-head{max-width:680px; margin:0 auto 46px; text-align:center;}
.section-head .eyebrow{display:block; margin-bottom:10px;}
.section-head h2{font-size:clamp(1.9rem,3.4vw,2.6rem);}
.section-head p{color:var(--grey); margin-top:14px; font-size:1.02rem;}
.divider{width:64px; height:2px; background:var(--gold); margin:18px auto 0;}

/* ---------- About ---------- */
.about{padding:100px 0 90px; background:var(--white);}
.about-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center;}
.about-copy .eyebrow{margin-bottom:12px;}
.about-copy h2{font-size:clamp(1.9rem,3.2vw,2.5rem); margin-bottom:20px;}
.about-copy p{color:#4b473e; margin-bottom:16px;}
.verse-block{
  margin-top:26px; padding:22px 26px; background:var(--cream);
  border-left:3px solid var(--gold); font-family:'Cormorant Garamond',serif;
  font-size:1.18rem; font-style:italic; color:var(--charcoal);
}
.verse-block cite{
  display:block; margin-top:10px; font-family:'Inter',sans-serif; font-style:normal;
  font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-dim);
}
.about-facts{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:30px;}
.fact{padding:16px 0; border-top:1px solid #e7e1d2;}
.fact .label{font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-dim);}
.fact .value{font-family:'Cormorant Garamond',serif; font-weight:700; font-size:1.15rem; margin-top:4px;}
.about-photo{position:relative;}
.about-photo img{border-radius:4px; box-shadow:0 26px 50px -18px rgba(14,13,11,.4);}
.about-photo .frame{position:absolute; inset:18px -18px -18px 18px; border:1px solid var(--gold); z-index:-1; border-radius:4px;}

/* ---------- Mission / Vision ---------- */
.mv{padding:80px 0; background:var(--charcoal); color:var(--white);}
.mv-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:var(--line); border:1px solid var(--line);}
.mv-card{background:var(--charcoal); padding:44px 40px;}
.mv-card .icon{color:var(--gold); font-size:1.6rem; margin-bottom:16px;}
.mv-card h3{color:var(--white); font-size:1.5rem; margin-bottom:14px;}
.mv-card p{color:#c9c4b6;}

/* ---------- Programs ---------- */
.programs{padding:100px 0; background:var(--cream);}
.prog-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.prog-card{background:var(--white); border:1px solid #e7e1d2; padding:34px 26px; text-align:left; transition:.25s; border-radius:3px;}
.prog-card:hover{border-color:var(--gold); transform:translateY(-4px); box-shadow:0 20px 40px -24px rgba(14,13,11,.3);}
.prog-num{font-family:'Cormorant Garamond',serif; font-size:.85rem; color:var(--gold-dim); letter-spacing:.1em;}
.prog-card h3{font-size:1.3rem; margin:12px 0 10px;}
.prog-card p{color:#68635a; font-size:.92rem;}

/* ---------- Why choose ---------- */
.why{padding:90px 0; background:var(--white);}
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px 40px;}
.why-item{display:flex; gap:16px; align-items:flex-start;}
.why-item .ic{
  flex:0 0 auto; width:46px; height:46px; border:1px solid var(--gold); border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--gold-dim); font-size:1.1rem;
}
.why-item h4{font-size:1.08rem; margin-bottom:6px;}
.why-item p{color:#6b665d; font-size:.9rem; margin:0;}

/* ---------- Gallery ---------- */
.gallery{padding:100px 0; background:var(--black); color:var(--white);}
.gallery .section-head .eyebrow{color:var(--gold);}
.gallery .section-head h2{color:var(--white);}
.gallery .section-head p{color:#b7b2a4;}
.gal-grid{display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:190px; gap:10px;}
.gal-grid figure{margin:0; overflow:hidden; position:relative; border-radius:2px;}
.gal-grid img{width:100%; height:100%; object-fit:cover; transition:.5s;}
.gal-grid figure:hover img{transform:scale(1.08);}
.gal-grid figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:10px 12px;
  background:linear-gradient(0deg, rgba(0,0,0,.75), transparent);
  font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-light);
  opacity:0; transition:.3s;
}
.gal-grid figure:hover figcaption{opacity:1;}
.span-2{grid-column:span 2;}
.span-2-row{grid-row:span 2;}

/* ---------- Admissions banner ---------- */
.admissions{padding:70px 0; background:linear-gradient(120deg, var(--gold-dim), var(--gold) 60%, var(--gold-light)); color:var(--black);}
.adm-row{display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap;}
.adm-row h2{font-size:clamp(1.6rem,3vw,2.2rem); color:var(--black); max-width:640px;}
.adm-row .eyebrow{color:rgba(14,13,11,.65);}
.adm-row p{margin-top:8px; color:rgba(14,13,11,.75); max-width:520px;}

/* ---------- Partner ---------- */
.partner{padding:110px 0; background:var(--charcoal); color:var(--white); text-align:center;}
.partner .eyebrow{color:var(--gold);}
.partner h2{color:var(--white); font-size:clamp(2rem,4vw,2.9rem); max-width:760px; margin:16px auto 20px;}
.partner p{max-width:640px; margin:0 auto 34px; color:#cfc9ba;}
.partner .cta-row{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}

/* ---------- Contact / Location ---------- */
.contact{padding:90px 0; background:var(--cream);}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px;}
.contact-card{background:var(--white); border:1px solid #e7e1d2; padding:40px; border-radius:3px;}
.contact-card h3{font-size:1.5rem; margin-bottom:18px;}
.contact-list{list-style:none; margin:0; padding:0;}
.contact-list li{display:flex; gap:14px; padding:14px 0; border-top:1px solid #efe9da; font-size:.95rem; color:#4b473e;}
.contact-list li:first-child{border-top:none;}
.contact-list .ic{color:var(--gold-dim); font-weight:700; width:20px;}
.contact-note{font-size:.8rem; color:var(--grey); margin-top:18px; font-style:italic;}
.map-block{
  background:var(--white); border:1px solid #e7e1d2; border-radius:3px; padding:0; overflow:hidden;
  display:flex; align-items:center; justify-content:center; min-height:280px;
  background-image:radial-gradient(circle at 30% 30%, rgba(201,168,76,.12), transparent 60%);
}
.map-inner{text-align:center; padding:40px;}
.map-inner .pin{font-size:2.4rem; color:var(--gold-dim);}
.map-inner h4{margin-top:10px; font-size:1.15rem;}
.map-inner p{color:var(--grey); font-size:.9rem; margin-top:6px;}

/* ---------- Footer ---------- */
footer{background:var(--black); color:#a49f90; padding:60px 0 26px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px;}
.foot-brand{display:flex; gap:12px; align-items:center; margin-bottom:16px;}
.foot-brand img{height:66px;}
.foot-brand-text .full{font-family:'Cormorant Garamond',serif; color:var(--white); font-size:1.05rem; font-weight:700;}
.foot-brand-text .sub{font-family:'Marcellus',serif; color:var(--gold); font-size:.6rem; letter-spacing:.18em; text-transform:uppercase;}
footer p{font-size:.86rem; line-height:1.7;}
footer h5{color:var(--white); font-family:'Marcellus',serif; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; margin-bottom:16px;}
footer ul{list-style:none; margin:0; padding:0;}
footer li{margin-bottom:10px;}
footer a{font-size:.86rem; color:#a49f90; transition:.2s;}
footer a:hover{color:var(--gold-light);}
.foot-bottom{
  max-width:1180px; margin:46px auto 0; padding:22px 28px 0; border-top:1px solid rgba(255,255,255,.08);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.78rem; color:#75705f;
}

/* ---------- Page header (Events) ---------- */
.page-header{
  padding:150px 0 70px; background:var(--black); color:var(--white); text-align:center;
  background-image:linear-gradient(180deg, rgba(10,9,7,.85), var(--black));
}
.page-header .eyebrow{color:var(--gold);}
.page-header h1{color:var(--white); font-size:clamp(2.2rem,4.4vw,3.4rem); margin-top:14px;}
.page-header p{color:#c9c4b6; max-width:600px; margin:16px auto 0;}

/* ---------- Events page ---------- */
.events-note{
  max-width:820px; margin:-30px auto 60px; padding:16px 22px; background:#fbf3da;
  border:1px dashed var(--gold-dim); border-radius:4px; font-size:.85rem; color:#5c4c1c; text-align:center;
}
.events-page{padding:0 0 100px; background:var(--cream);}
.month-tabs{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0 0 50px;}
.month-tab{
  padding:9px 20px; border:1px solid #ddd4bb; border-radius:20px; background:var(--white);
  font-size:.82rem; font-weight:600; letter-spacing:.03em; cursor:pointer; transition:.2s; color:var(--charcoal);
}
.month-tab:hover{border-color:var(--gold);}
.month-tab.is-active{background:var(--black); border-color:var(--black); color:var(--gold-light);}
.event-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:26px;}
.event-card{
  background:var(--white); border:1px solid #e7e1d2; border-radius:4px; overflow:hidden;
  display:flex; flex-direction:column; transition:.25s;
}
.event-card:hover{transform:translateY(-4px); box-shadow:0 22px 40px -26px rgba(14,13,11,.35); border-color:var(--gold);}
.event-date{
  display:flex; align-items:center; gap:14px; padding:18px 22px; background:var(--charcoal); color:var(--white);
}
.event-date .day{font-family:'Cormorant Garamond',serif; font-size:1.8rem; font-weight:700; color:var(--gold-light); line-height:1;}
.event-date .mon{font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-dim);}
.event-body{padding:20px 22px 24px; flex:1; display:flex; flex-direction:column;}
.event-tag{
  align-self:flex-start; font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; font-weight:700;
  padding:4px 10px; border-radius:10px; margin-bottom:12px; background:var(--cream); color:var(--gold-dim);
  border:1px solid var(--line);
}
.event-body h3{font-size:1.2rem; margin-bottom:8px;}
.event-body p{color:#68635a; font-size:.88rem; flex:1;}
.event-meta{font-size:.78rem; color:var(--grey); margin-top:14px; display:flex; gap:8px; align-items:center;}
.no-events{text-align:center; color:var(--grey); padding:60px 0; font-style:italic; display:none;}

.ongoing{padding:90px 0; background:var(--white);}
.ongoing-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.ongoing-card{
  padding:28px 26px; border:1px solid #e7e1d2; border-radius:4px; background:var(--cream);
  display:flex; gap:16px; align-items:flex-start;
}
.ongoing-card .ic{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%; background:var(--black); color:var(--gold);
  display:flex; align-items:center; justify-content:center; font-size:1.1rem;
}
.ongoing-card h4{font-size:1.05rem; margin-bottom:6px;}
.ongoing-card p{color:#6b665d; font-size:.86rem; margin:0;}
.ongoing-card .freq{
  display:inline-block; margin-top:10px; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold-dim); font-weight:700;
}

/* ---------- Responsive ---------- */
@media (max-width:920px){
  nav.links{display:none;}
  .menu-toggle{display:block;}
  .about-grid, .mv-grid, .contact-grid{grid-template-columns:1fr;}
  .prog-grid{grid-template-columns:repeat(2,1fr);}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .gal-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:160px;}
  .foot-grid{grid-template-columns:1fr 1fr; row-gap:34px;}
  .adm-row{flex-direction:column; align-items:flex-start;}
  .event-grid, .ongoing-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .prog-grid, .why-grid{grid-template-columns:1fr;}
  .gal-grid{grid-template-columns:1fr 1fr;}
  .foot-grid{grid-template-columns:1fr;}
  .hero-logo{height:110px;}
  .brand img{height:58px;}
  .event-grid, .ongoing-grid{grid-template-columns:1fr;}
  .slider-arrow{display:none;}
}
