/* ============================================================
   OCTA DESIGN — Luxury Interior Design (v2)
   Premium, minimal, cinematic theme
   ============================================================ */

:root{
  --black:#0E0E0E;
  --ink:#171717;
  --charcoal:#222;
  --white:#F8F6F1;
  --cream:#EFE9DD;
  --gold:#C8A96B;
  --gold-soft:#D9BE85;
  --gold-deep:#9B8048;
  --muted:#7a7670;
  --line:rgba(0,0,0,.08);
  --line-dark:rgba(255,255,255,.12);
  --serif:"Playfair Display", "Cormorant Garamond", Georgia, serif;
  --display:"Cinzel", "Playfair Display", serif;
  --sans:"Inter","Helvetica Neue", Arial, sans-serif;
  --shadow-lux: 0 30px 60px -20px rgba(0,0,0,.25);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--white);
  color:var(--ink);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5{font-family:var(--serif); font-weight:500; letter-spacing:-.01em; color:var(--black)}
h1{font-size:clamp(2.4rem,5.4vw,4.6rem); line-height:1.05}
h2{font-size:clamp(1.9rem,3.6vw,3rem); line-height:1.15}
h3{font-size:clamp(1.3rem,2vw,1.6rem)}
p{color:#3a3936}
a{color:inherit; text-decoration:none; transition:.25s}
img{max-width:100%; display:block}
.section{padding:clamp(64px,9vw,130px) 0}
.container{max-width:1240px; margin:0 auto; padding:0 24px}
.eyebrow{
  font-family:var(--display);
  font-size:.72rem; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-deep); font-weight:600;
  display:inline-flex; align-items:center; gap:14px;
}
.eyebrow::before, .eyebrow.with-line::after{
  content:""; width:34px; height:1px; background:var(--gold);
}
.lead{font-size:1.08rem; color:#4a4844; max-width:60ch}
.divider-gold{width:60px; height:2px; background:var(--gold); border:0; margin:14px 0 22px}

/* ---------- Navigation ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:90;
  padding:18px 0;
  background:rgba(248,246,241,.7);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid transparent;
  transition:.3s;
}
.nav.scrolled{background:rgba(255,253,249,.95); border-bottom-color:var(--line); padding:12px 0}
.nav-inner{display:flex; align-items:center; justify-content:space-between; gap:24px}
.brand{display:flex; align-items:center; gap:12px; flex-shrink:0}
.brand-mark{
  width:42px;height:42px;
  object-fit:contain;
  display:block;
  flex-shrink:0;
}
.footer-brand .brand-mark{width:38px;height:38px}
.brand-name{
  font-family:var(--display); font-weight:700; letter-spacing:.22em;
  font-size:1rem; color:var(--black);
}
.brand-name .dot{color:var(--gold)}
.nav-links{display:flex; gap:34px; align-items:center; list-style:none; margin:0; padding:0}
.nav-links a{font-size:.84rem; letter-spacing:.14em; text-transform:uppercase; color:#3a3936; font-weight:500; position:relative}
.nav-links a::after{content:""; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:.3s}
.nav-links a:hover{color:var(--black)}
.nav-links a:hover::after, .nav-links a.active::after{transform:scaleX(1)}
.nav-cta{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--black); color:var(--white)!important;
  padding:11px 22px; font-size:.78rem!important; letter-spacing:.18em;
  border:1px solid var(--black);
}
.nav-cta:hover{background:var(--gold); border-color:var(--gold); color:var(--black)!important}
.nav-cta::after{display:none}
.nav-toggle{display:none; background:none; border:0; padding:6px; cursor:pointer}
.nav-toggle span{display:block; width:26px; height:1.5px; background:var(--black); margin:6px 0; transition:.3s}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.nav.open .nav-toggle span:nth-child(2){opacity:0}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

@media(max-width:991px){
  .nav-toggle{display:block}
  .nav-links{
    position:absolute; top:100%; left:0; right:0;
    background:var(--white); flex-direction:column; gap:0; padding:8px 0;
    border-top:1px solid var(--line);
    max-height:0; overflow:hidden; transition:.4s;
  }
  .nav.open .nav-links{max-height:560px; padding:18px 0}
  .nav-links li{width:100%}
  .nav-links a{display:block; padding:14px 26px}
  .nav-cta{margin:14px 26px}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 28px;
  font-family:var(--sans); font-weight:500; font-size:.84rem;
  letter-spacing:.18em; text-transform:uppercase;
  border:1px solid var(--black); background:var(--black); color:var(--white);
  cursor:pointer; transition:.3s;
}
.btn:hover{background:var(--gold); border-color:var(--gold); color:var(--black)}
.btn-outline{background:transparent; color:var(--black)}
.btn-outline:hover{background:var(--black); color:var(--white)}
.btn-gold{background:var(--gold); border-color:var(--gold); color:var(--black)}
.btn-gold:hover{background:var(--black); border-color:var(--black); color:var(--white)}
.btn-lg{padding:18px 36px; font-size:.9rem}
.btn-arrow::after{content:"→"; font-family:Arial; transform:translateX(0); transition:.3s}
.btn-arrow:hover::after{transform:translateX(6px)}

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:center;
  color:var(--white); overflow:hidden; padding-top:90px;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:#000 url('https://images.unsplash.com/photo-1616594039964-ae9021a400a0?auto=format&fit=crop&w=2200&q=80') center/cover;
}
.hero-bg::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(14,14,14,.55) 0%, rgba(14,14,14,.45) 50%, rgba(14,14,14,.85) 100%)}
.hero-inner{position:relative; z-index:2; max-width:880px; padding:80px 0}
.hero h1{color:#fff; font-family:var(--serif); font-weight:400}
.hero h1 em{font-style:italic; color:var(--gold-soft); font-weight:400}
.hero p.lead{color:rgba(255,255,255,.84); margin:22px 0 36px; font-size:1.15rem}
.hero .hero-eyebrow{color:var(--gold-soft); margin-bottom:24px}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap}
.scroll-cue{
  position:absolute; bottom:30px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.6); font-size:.7rem; letter-spacing:.3em; text-transform:uppercase;
  z-index:2;
}
.scroll-cue::after{content:""; display:block; width:1px; height:34px; background:var(--gold); margin:12px auto 0; animation:scroll-cue 2.2s ease-in-out infinite}
@keyframes scroll-cue{0%,100%{transform:scaleY(0); transform-origin:top}50%{transform:scaleY(1); transform-origin:top}51%{transform-origin:bottom}}

/* ---------- Stats bar ---------- */
.stats{background:var(--ink); color:var(--white); padding:48px 0}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
.stat{text-align:center; padding:18px 10px; border-right:1px solid var(--line-dark)}
.stat:last-child{border-right:0}
.stat-num{font-family:var(--serif); font-size:2.6rem; color:var(--gold); line-height:1}
.stat-label{font-size:.72rem; letter-spacing:.28em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-top:10px}
@media(max-width:767px){.stats-grid{grid-template-columns:repeat(2,1fr); gap:8px} .stat{border-right:0; border-bottom:1px solid var(--line-dark); padding:24px 8px} .stat:nth-last-child(-n+2){border-bottom:0}}

/* ---------- Section header ---------- */
.section-head{text-align:center; max-width:720px; margin:0 auto 64px}
.section-head h2{margin:18px 0 14px}
.section-head p{color:var(--muted)}

/* ---------- About ---------- */
.about-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:80px; align-items:center}
@media(max-width:991px){.about-grid{grid-template-columns:1fr; gap:48px}}
.about-img{position:relative; aspect-ratio:4/5; overflow:hidden; box-shadow:var(--shadow-lux)}
.about-img .slide{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.4s ease}
.about-img .slide.active{opacity:1}
.about-img::after{content:""; position:absolute; inset:14px; border:1px solid rgba(255,255,255,.35); pointer-events:none}
.about-features{margin-top:30px; display:grid; gap:18px}
.about-feature{display:flex; gap:16px; align-items:flex-start}
.about-feature .icn{width:42px; height:42px; flex-shrink:0; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); font-family:var(--serif); font-size:1.1rem}
.about-feature h4{font-family:var(--sans); font-size:.95rem; letter-spacing:.12em; text-transform:uppercase; margin:0 0 4px; color:var(--black)}
.about-feature p{margin:0; color:var(--muted); font-size:.94rem}

/* ---------- Services ---------- */
.services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px}
@media(max-width:991px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.services-grid{grid-template-columns:1fr}}
.svc-card{
  background:#fff; padding:38px 30px;
  border:1px solid var(--line); position:relative;
  transition:.4s; overflow:hidden;
}
.svc-card::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--gold); transform:scaleY(0); transform-origin:top; transition:.4s}
.svc-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lux); border-color:transparent}
.svc-card:hover::before{transform:scaleY(1)}
.svc-card .num{font-family:var(--serif); color:var(--gold); font-size:1rem; letter-spacing:.2em}
.svc-card h3{margin:14px 0 12px}
.svc-card p{color:var(--muted); font-size:.95rem}
.svc-card .link{display:inline-flex; gap:8px; margin-top:18px; font-size:.78rem; letter-spacing:.2em; text-transform:uppercase; color:var(--black); border-bottom:1px solid var(--gold); padding-bottom:4px}

/* ---------- Portfolio / Stories slider ---------- */
.stories-track{display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory; padding:10px 4px 30px; scrollbar-width:thin}
.stories-track::-webkit-scrollbar{height:6px}
.stories-track::-webkit-scrollbar-thumb{background:var(--gold)}
.story-card{flex:0 0 clamp(280px,32vw,420px); scroll-snap-align:start; background:#fff; overflow:hidden; border:1px solid var(--line); transition:.4s}
.story-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lux)}
.story-card .img{aspect-ratio:4/3; background-size:cover; background-position:center}
.story-card .body{padding:24px}
.story-card .meta{font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep); margin-bottom:8px}
.story-card h3{margin:0 0 8px; font-size:1.25rem}
.story-card p{margin:0; color:var(--muted); font-size:.92rem}
.slider-controls{display:flex; justify-content:flex-end; gap:10px; margin-top:18px}
.slider-controls button{width:44px; height:44px; border:1px solid var(--black); background:transparent; cursor:pointer; transition:.25s; font-size:1.1rem}
.slider-controls button:hover{background:var(--black); color:var(--white)}

/* ---------- Locations ---------- */
.loc-section{background:var(--cream)}
.loc-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px}
@media(max-width:991px){.loc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.loc-grid{grid-template-columns:1fr}}
.loc-card{position:relative; aspect-ratio:3/4; overflow:hidden; cursor:pointer}
.loc-card .img{position:absolute; inset:0; background-size:cover; background-position:center; transition:transform 1s}
.loc-card:hover .img{transform:scale(1.07)}
.loc-card::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,.85))}
.loc-card .label{position:absolute; bottom:18px; left:18px; right:18px; z-index:2; color:#fff}
.loc-card .label .city{font-family:var(--serif); font-size:1.4rem}
.loc-card .label .tag{font-size:.7rem; letter-spacing:.25em; text-transform:uppercase; color:var(--gold-soft); margin-top:2px}

/* ---------- Testimonials slider ---------- */
.testi-section{background:var(--white)}
.testi-slider{position:relative; max-width:880px; margin:0 auto; text-align:center}
.testi-item{display:none; padding:10px 20px; animation:fadeIn .6s ease}
.testi-item.active{display:block}
@keyframes fadeIn{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
.testi-stars{color:var(--gold); letter-spacing:6px; font-size:1.1rem; margin-bottom:20px}
.testi-quote{font-family:var(--serif); font-style:italic; font-size:clamp(1.1rem,1.7vw,1.5rem); line-height:1.6; color:var(--ink); max-width:760px; margin:0 auto}
.testi-quote::before{content:"\201C"; font-size:3.2rem; color:var(--gold); line-height:0; vertical-align:-22px; margin-right:6px; font-family:Georgia}
.testi-meta{margin-top:26px; font-size:.82rem; letter-spacing:.22em; text-transform:uppercase}
.testi-meta strong{color:var(--black); font-weight:600}
.testi-meta span{color:var(--muted); margin-left:10px}
.testi-dots{display:flex; gap:8px; justify-content:center; margin-top:34px}
.testi-dots button{width:8px; height:8px; border-radius:50%; border:1px solid var(--gold-deep); background:transparent; cursor:pointer; padding:0}
.testi-dots button.active{background:var(--gold)}
.google-badge{display:inline-flex; align-items:center; gap:8px; padding:6px 14px; background:#fff; border:1px solid var(--line); border-radius:40px; font-size:.78rem; color:var(--muted); margin-bottom:16px}
.google-badge .g{font-family:Arial; font-weight:700}
.google-badge .g span:nth-child(1){color:#4285F4}
.google-badge .g span:nth-child(2){color:#EA4335}
.google-badge .g span:nth-child(3){color:#FBBC05}
.google-badge .g span:nth-child(4){color:#4285F4}
.google-badge .g span:nth-child(5){color:#34A853}
.google-badge .g span:nth-child(6){color:#EA4335}

/* ---------- Testimonials grid (subpage) ---------- */
.review-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px}
@media(max-width:991px){.review-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.review-grid{grid-template-columns:1fr}}
.review-card{background:#fff; border:1px solid var(--line); padding:32px 28px; position:relative; transition:.3s}
.review-card:hover{box-shadow:var(--shadow-lux); transform:translateY(-3px)}
.review-card .stars{color:var(--gold); letter-spacing:4px; font-size:1rem}
.review-card .text{margin:16px 0; color:#3a3936; font-size:.97rem; line-height:1.7}
.review-card .author{display:flex; align-items:center; gap:14px; padding-top:18px; border-top:1px solid var(--line)}
.review-card .avatar{width:44px; height:44px; border-radius:50%; background:var(--cream); display:flex; align-items:center; justify-content:center; font-family:var(--serif); color:var(--gold-deep); font-weight:600}
.review-card .name{font-weight:600; color:var(--black); font-size:.95rem}
.review-card .date{color:var(--muted); font-size:.78rem}

/* ---------- FAQ ---------- */
.faq-section{background:var(--cream)}
.faq-wrap{max-width:880px; margin:0 auto}
.faq-item{border-bottom:1px solid rgba(0,0,0,.12)}
.faq-q{
  width:100%; background:none; border:0; cursor:pointer;
  padding:28px 0; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:30px;
  font-family:var(--serif); font-size:1.18rem; color:var(--black);
}
.faq-q .icn{
  width:32px; height:32px; flex-shrink:0; border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center; color:var(--gold-deep);
  font-family:var(--sans); transition:.3s; font-size:1.1rem;
}
.faq-item.open .faq-q .icn{background:var(--gold); color:var(--black); transform:rotate(45deg)}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s ease}
.faq-a-inner{padding:0 0 28px; color:#4a4844; font-size:.97rem; line-height:1.75; max-width:760px}
.faq-item.open .faq-a{max-height:400px}

/* ---------- CTA strip ---------- */
.cta-strip{background:var(--black); color:var(--white); padding:80px 0; text-align:center}
.cta-strip h2{color:#fff}
.cta-strip h2 em{color:var(--gold-soft); font-style:italic}
.cta-strip p{color:rgba(255,255,255,.7); max-width:600px; margin:14px auto 30px}

/* ---------- Footer ---------- */
.footer{background:var(--ink); color:rgba(255,255,255,.7); padding:80px 0 30px}
.footer a{color:rgba(255,255,255,.7)}
.footer a:hover{color:var(--gold)}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:50px; margin-bottom:50px}
@media(max-width:767px){.footer-grid{grid-template-columns:1fr 1fr; gap:36px}}
.footer h5{font-family:var(--sans); color:#fff; font-size:.84rem; letter-spacing:.22em; text-transform:uppercase; margin:0 0 20px}
.footer ul{list-style:none; padding:0; margin:0}
.footer ul li{margin-bottom:10px; font-size:.92rem}
.footer-brand .brand-name{color:#fff}
.footer-brand p{margin-top:18px; color:rgba(255,255,255,.6); font-size:.94rem; max-width:320px}
.footer-bottom{border-top:1px solid var(--line-dark); padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; font-size:.82rem; color:rgba(255,255,255,.5)}

/* ---------- Founders ---------- */
.founders-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px
}

.founder-card {
  background: var(--white-pure);
  box-shadow: var(--shadow-soft);
  transition: all .5s var(--ease);
}

.founder-card:hover {
  box-shadow: var(--shadow-lux);
  transform: translateY(-6px)
}

.founder-img {
  aspect-ratio: 4/5;
  overflow: hidden;
  position: relative
}

.founder-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s var(--ease)
}

.founder-card:hover .founder-img img {
  transform: scale(1.05)
}

.founder-body {
  padding: 40px
}

.founder-body .role {
  font-family: var(--font-mark);
  font-size: .72rem;
  letter-spacing: .35em;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 10px
}

.founder-body h3 {
  font-size: 2rem;
  margin-bottom: 14px
}

.founder-body p {
  color: #555;
  margin-bottom: 18px
}

.founder-body .socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line-dark);
  border-radius: 50%;
  margin-right: 8px;
  color: #666;
  transition: all .3s var(--ease)
}

.founder-body .socials a:hover {
  background: var(--black);
  border-color: var(--black);
  color: var(--white)
}

@media(max-width:800px) {
  .founders-grid {
    grid-template-columns: 1fr
  }
}
/* ---------- Floating widgets ---------- */
.float-whatsapp{
  position:fixed; right:20px; bottom:20px; z-index:80;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px rgba(37,211,102,.35);
  transition:.3s;
}
.float-whatsapp:hover{transform:scale(1.08)}
.float-whatsapp svg{width:30px; height:30px}
@media(max-width:767px){.float-whatsapp{bottom:80px}}

.mobile-bar{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:80;
  background:var(--black); color:#fff;
}
@media(max-width:767px){
  .mobile-bar{display:grid; grid-template-columns:repeat(3,1fr)}
}
.mobile-bar a{padding:16px 6px; text-align:center; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:#fff; border-right:1px solid rgba(255,255,255,.1)}
.mobile-bar a:last-child{border-right:0}
.mobile-bar a strong{display:block; font-family:var(--serif); font-size:.95rem; letter-spacing:.02em; color:var(--gold-soft); margin-bottom:3px}

/* ---------- Forms ---------- */
.form-group{margin-bottom:18px}
.form-label{display:block; font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-bottom:8px}
.form-control, .form-select, textarea.form-control{
  width:100%; padding:14px 16px;
  background:#fff; border:1px solid rgba(0,0,0,.18); border-radius:0;
  font-family:var(--sans); font-size:.95rem; color:var(--ink); transition:.25s;
}
.form-control:focus, .form-select:focus, textarea.form-control:focus{outline:0; border-color:var(--gold); box-shadow:0 0 0 3px rgba(200,169,107,.18)}
.form-error{color:#c0392b; font-size:.82rem; margin-top:4px; display:none}
.form-error.show{display:block}
.form-success{background:rgba(46,204,113,.1); color:#1e7a4a; padding:14px 18px; border-left:3px solid #2ecc71; font-size:.92rem}

/* ---------- Page hero (subpages) ---------- */
.page-hero{
  background:var(--ink); color:#fff; padding:170px 0 90px;
  text-align:center; position:relative; overflow:hidden;
}
.page-hero::before{
  content:""; position:absolute; inset:0;
  background:url('https://images.unsplash.com/photo-1618219740975-d40978bb7378?auto=format&fit=crop&w=2000&q=80') center/cover;
  opacity:.18;
}
.page-hero > *{position:relative}
.page-hero h1{color:#fff; margin:18px 0 10px}
.page-hero p{color:rgba(255,255,255,.7); max-width:620px; margin:0 auto}

/* ---------- Course page ---------- */
.course-hero{min-height:100vh; display:grid; grid-template-columns:1.05fr 1fr; padding-top:90px}
@media(max-width:991px){.course-hero{grid-template-columns:1fr; min-height:auto}}
.course-hero-left{padding:60px clamp(24px,5vw,80px); display:flex; flex-direction:column; justify-content:center; background:var(--white)}
.course-hero-left .eyebrow{margin-bottom:22px}
.course-hero-left h1{font-size:clamp(2.2rem,4.2vw,3.6rem); margin-bottom:18px}
.course-hero-left h1 em{font-style:italic; color:var(--gold-deep)}
.course-hero-left .sub{font-size:1.05rem; color:#4a4844; margin-bottom:28px; max-width:520px}
.bullet-list{list-style:none; padding:0; margin:0 0 32px; display:grid; gap:10px}
.bullet-list li{display:flex; gap:12px; align-items:flex-start; font-size:.96rem}
.bullet-list li::before{content:"✓"; color:var(--gold-deep); font-weight:700; flex-shrink:0}
.lead-form{background:#fff; border:1px solid var(--line); padding:30px; box-shadow:var(--shadow-lux); max-width:480px}
.lead-form h3{font-family:var(--sans); font-size:.9rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); margin:0 0 18px}
.cta-big{
  display:block; width:100%;
  padding:18px; font-size:.95rem; letter-spacing:.18em; text-transform:uppercase;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-soft) 100%);
  color:var(--black); border:0; font-weight:600; cursor:pointer;
  transition:.3s; box-shadow:0 10px 24px rgba(200,169,107,.4);
}
.cta-big:hover{transform:translateY(-2px); box-shadow:0 14px 30px rgba(200,169,107,.5)}
.course-hero-right{
  background:url('https://images.unsplash.com/photo-1616486338812-3dadae4b4ace?auto=format&fit=crop&w=1600&q=80') center/cover;
  min-height:400px; position:relative;
}
.course-hero-right::after{content:""; position:absolute; inset:0; background:linear-gradient(135deg, transparent 40%, rgba(0,0,0,.3))}

.thanks{min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:120px 24px; background:linear-gradient(180deg, var(--white) 0%, var(--cream) 100%)}
.thanks-inner{max-width:620px; animation:fadeIn .8s ease}
.thanks .check{
  width:84px; height:84px; border-radius:50%;
  background:var(--gold); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:2.4rem; margin:0 auto 30px;
}
.thanks h1{margin-bottom:18px}
.thanks h1 em{color:var(--gold-deep); font-style:italic}
.thanks p{font-size:1.1rem; color:#4a4844; margin-bottom:36px}

/* ---------- Reveal animations ---------- */
.reveal{opacity:0; transform:translateY(30px); transition:opacity .9s ease, transform .9s ease}
.reveal.in{opacity:1; transform:none}

/* ---------- Utility ---------- */
.text-center{text-align:center}
.mt-4{margin-top:1.5rem}
.mt-6{margin-top:2.5rem}

/* ===== Eight Pillars ===== */
.pillars-section{background:#fbf9f4}
.section-sub{max-width:640px;margin:14px auto 0;color:var(--muted);font-size:1rem;line-height:1.7;text-align:center}
.pillars-photo{margin:46px 0 56px;border-radius:4px;overflow:hidden;box-shadow:0 30px 80px -40px rgba(0,0,0,.35)}
.pillars-photo img{width:100%;height:auto;display:block;aspect-ratio:16/7;object-fit:cover}
.pillars-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media(max-width:980px){.pillars-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.pillars-grid{grid-template-columns:1fr}.pillars-photo img{aspect-ratio:4/3}}
.pillar-card{background:#fff;border:1px solid var(--line);padding:30px 26px;position:relative;transition:.35s;border-radius:2px}
.pillar-card:hover{transform:translateY(-4px);box-shadow:0 24px 50px -28px rgba(0,0,0,.22);border-color:var(--gold)}
.pillar-num{font-family:var(--display);font-size:.82rem;letter-spacing:.22em;color:var(--gold-deep);display:block;padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid var(--line)}
.pillar-card h3{font-family:var(--display);font-size:1.08rem;font-weight:600;color:var(--black);margin:0 0 10px;line-height:1.35}
.pillar-card p{font-size:.9rem;color:var(--muted);line-height:1.65;margin:0}

/* ---------- Mobile polish (added) ---------- */
@media(max-width:767px){
  /* Prevent .mobile-bar from covering page content */
  body{ padding-bottom:78px; }
  /* Slightly tighter section padding so heroes fit on small screens */
  .section{ padding:56px 0; }
  .page-hero{ padding:130px 0 60px; }
  /* Larger tap targets for nav */
  .nav-links a{ font-size:.95rem; padding:16px 26px; }
  /* Stack hero buttons full-width */
  .hero-actions .btn{ width:100%; justify-content:center; }
  /* Footer grid -> single column */
  .footer-grid{ grid-template-columns:1fr !important; gap:30px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; gap:8px; }
}
@media(min-width:768px) and (max-width:991px){
  .footer-grid{ grid-template-columns:repeat(2,1fr) !important; }
}