/* ============================================================
   MY MAGIC THERAPY
   ============================================================ */
:root{
  --c-primary:#2E5D50;
  --c-primary-dark:#132420;
  --c-secondary:#3E7C59;
  --c-gold:#B89B5E;
  --c-gold-light:#E8C77E;
  --c-bg:#F8F7F2;
  --c-light-green:#EAF3EA;
  --c-white:#FFFFFF;
  --c-text:#141414;
  --c-text-soft:#2E5D50;
  --c-moss:#4C7A63;
  --c-fern:#6FA37B;
  --c-deep:#0B1613;
  --c-deep-2:#0E1E1A;

  --grad-hero: linear-gradient(180deg, rgba(11,22,19,.05) 0%, rgba(11,22,19,.45) 55%, rgba(11,22,19,.94) 100%);
  --grad-gold: linear-gradient(120deg, #B89B5E 0%, #E8C77E 50%, #B89B5E 100%);
  --grad-forest: linear-gradient(135deg, #23483E 0%, #0E1E1A 100%);
  --grad-glow: radial-gradient(circle, rgba(232,199,126,.5), transparent 70%);

  /* Only two font roles for the whole site — both Arial-based, per brief */
  --font-display: Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;

  --radius-sm:10px; --radius-md:22px; --radius-lg:38px;
  --shadow-soft: 0 24px 70px -24px rgba(11,22,19,.3);
  --shadow-deep: 0 40px 90px -30px rgba(11,22,19,.55);
  --shadow-glow: 0 0 46px rgba(184,155,94,.4);
  --ease-organic: cubic-bezier(.22,1,.36,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font-body); color:var(--c-text); background:var(--c-bg);
  overflow-x:hidden; line-height:1.65; -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }
button{ font-family:inherit; border:none; cursor:pointer; background:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; color:var(--c-primary-dark); line-height:1.12; }
p{ font-family:var(--font-body); color:var(--c-text); }
.container{width: min(1390px, 95%);margin-inline:auto;}
::selection{ background:var(--c-gold); color:var(--c-white); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--c-gold); outline-offset:3px; border-radius:4px;
}

/* ---------- utilities ---------- */
.eyebrow{
  font-family:var(--font-body); letter-spacing:.28em; text-transform:uppercase; font-size:1.4rem;
  font-weight:700; color:var(--c-gold); display:inline-flex; align-items:center; gap:.6rem; margin-bottom:1rem;
}
.eyebrow::before{ content:''; width:28px; height:1px; background:var(--c-gold); }
.section-title{ font-size:clamp(2rem, 4vw, 2.0rem);  margin-bottom:1.1rem; font-family:var(--font-display);     width:100%;}
.section-sub{ color:var(--c-text-soft); max-width:640px; font-size:1.05rem; font-family:var(--font-body); }
.section-pad{padding: clamp(4rem, 3vw, 8rem) 0;}
.text-center{ text-align:center; margin-inline:auto; }

.btn{
  display:inline-flex; align-items:center; gap:.6rem; padding:1rem 2.2rem; border-radius:100px;
  font-weight:700; font-size:.92rem; letter-spacing:.02em; position:relative; overflow:hidden; cursor:pointer;
  transition:transform .5s var(--ease-spring), box-shadow .5s var(--ease-organic);
  transform-style:preserve-3d; will-change:transform;
}
.btn-gold{ background:var(--grad-gold); color:var(--c-deep); box-shadow:0 14px 34px -10px rgba(184,155,94,.65); }
.btn-gold:hover{ box-shadow:0 22px 46px -12px rgba(184,155,94,.8); }
.btn-outline{ border:1.5px solid rgba(255,255,255,.55); color:var(--c-white); backdrop-filter:blur(8px); background:rgba(255,255,255,.06); }
.btn-outline:hover{ background:rgba(255,255,255,.16); }
.btn-glow::after{
  content:''; position:absolute; inset:0; border-radius:inherit; box-shadow:0 0 0 0 rgba(184,155,94,.55);
  animation:pulseGlow 2.6s ease-out infinite;
}
@keyframes pulseGlow{
  0%{ box-shadow:0 0 0 0 rgba(184,155,94,.45); } 70%{ box-shadow:0 0 0 18px rgba(184,155,94,0); } 100%{ box-shadow:0 0 0 0 rgba(184,155,94,0); }
}



   /* ===== SCROLL TO TOP BUTTON ===== */
        .scroll-top-btn {
            position: fixed;
              bottom: 102px;
    right: 26px;
            z-index: 9999;

            /* Dimensions */
            width: 54px;
            height: 54px;
            border-radius: 50%;

            /* Colors & Background */
            background: #B89B5E;
            color: #fff;
            border: none;
            cursor: pointer;

            /* Centering the arrow */
            display: flex;
            align-items: center;
            justify-content: center;

            /* Shadow for depth */
            box-shadow: 0 6px 22px rgba(108, 92, 231, 0.4);

            /* Transitions */
            opacity: 0;
            visibility: hidden;
            transform: translateY(20px) scale(0.85);
            transition:
                opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                background 0.25s ease,
                box-shadow 0.25s ease;

            /* Remove default tap highlight on mobile */
            -webkit-tap-highlight-color: transparent;
            outline: none;
        }

        /* ---- Visible State ---- */
        .scroll-top-btn.visible {
            opacity: 1;
            visibility: visible;
            transform: translateY(0) scale(1);
        }

        /* ---- Hover State ---- */
        .scroll-top-btn:hover {
            background: #2E5D50;
            box-shadow: 0 10px 28px rgba(108, 92, 231, 0.55);
            transform: translateY(-4px) scale(1.06);
        }

        /* ---- Active/Pressed State ---- */
        .scroll-top-btn:active {
            transform: translateY(2px) scale(0.94);
            box-shadow: 0 3px 10px rgba(108, 92, 231, 0.35);
            transition: transform 0.1s ease, box-shadow 0.1s ease;
        }

        /* ---- Focus-visible for keyboard users ---- */
        .scroll-top-btn:focus-visible {
            outline: 3px solid #a29bfe;
            outline-offset: 4px;
        }

        /* ===== SVG Arrow Icon ===== */
        .scroll-top-btn .arrow-icon {
            width: 24px;
            height: 24px;
            pointer-events: none;
            /* So clicks pass through to button */
            transition: transform 0.25s ease;
        }

        .scroll-top-btn:hover .arrow-icon {
            transform: translateY(-3px);
            /* Arrow lifts slightly on hover */;
        }

        /* ===== Responsive Adjustments ===== */
        @media (max-width: 600px) {
            .scroll-top-btn {
                bottom: 24px;
                right: 20px;
                width: 46px;
                height: 46px;
            }
            .scroll-top-btn .arrow-icon {
                width: 20px;
                height: 20px;
            }
        }

.glass{
  background: rgb(255 255 255 / 12%);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  border:1px solid rgba(255,255,255,.65);
  box-shadow:var(--shadow-soft);
}
.glass-dark{
  background:rgba(11,22,19,.5); backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%);
  border:1px solid rgba(255,255,255,.12);
}
.blob{ position:absolute; filter:blur(70px); opacity:.5; z-index:0; border-radius:50%; pointer-events:none; }
.blob-gold{ background:radial-gradient(circle, rgba(184,155,94,.45), transparent 70%); }
.blob-green{ background:radial-gradient(circle, rgba(111,163,123,.5), transparent 70%); }

/* ---------- 3D tilt card engine ---------- */
.tilt-wrap{ perspective:1400px; }
.tilt-el{
  transform-style:preserve-3d; transition:transform .5s var(--ease-organic), box-shadow .5s var(--ease-organic);
  will-change:transform; position:relative;
}
.tilt-el::before{
  content:''; position:absolute; inset:0; z-index:5; border-radius:inherit; pointer-events:none;
  background:linear-gradient(115deg, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 30%);
  opacity:0; transition:opacity .4s ease; mix-blend-mode:overlay;
}
.tilt-el.tilting::before{ opacity:1; }
.tilt-el > *{ transform:translateZ(0); }
 
/* ============================================================
   PRELOADER — "The Healing Leaf"
   ============================================================ */
#preloader{
  position:fixed; inset:0; z-index:100000; background:var(--grad-forest);
  display:flex; align-items:center; justify-content:center; flex-direction:column;
  transition:opacity 1s var(--ease-organic), visibility 1s var(--ease-organic); overflow:hidden;
}
#preloader.loaded{ opacity:0; visibility:hidden; pointer-events:none; }

.heal-aura{
  position:absolute; width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle, rgba(232,199,126,.5) 0%, rgba(111,163,123,.18) 55%, transparent 75%);
  filter:blur(4px); animation:healBreathe 4.2s ease-in-out infinite;
}
@keyframes healBreathe{ 0%,100%{ transform:scale(.82); opacity:.4; } 50%{ transform:scale(1.16); opacity:.75; } }

.heal-particles{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.heal-particle{
  position:absolute; bottom:-10px; border-radius:50%; background:var(--c-gold-light); opacity:0;
  box-shadow:0 0 10px rgba(232,199,126,.75); animation-name:particleRise; animation-timing-function:ease-in-out; animation-iteration-count:infinite;
}
@keyframes particleRise{
  0%{ transform:translateY(0) scale(.5); opacity:0; }
  15%{ opacity:.85; } 80%{ opacity:.4; }
  100%{ transform:translateY(-300px) scale(1); opacity:0; }
}

.heal-leaf-wrap{
  position:relative; width:126px; height:126px; display:flex; align-items:center; justify-content:center;
  z-index:1; animation:healLeafPulse 4.2s ease-in-out infinite;
}
@keyframes healLeafPulse{ 0%,100%{ transform:scale(.97); } 50%{ transform:scale(1.04); } }
.heal-leaf-svg{ width:100px; height:100px; overflow:visible; filter:drop-shadow(0 0 20px rgba(232,199,126,.5)); }
.heal-leaf-fill{ fill:url(#leafFillGrad); opacity:0; animation:leafFillIn 1.3s ease-out forwards; animation-delay:1.5s; }
@keyframes leafFillIn{ to{ opacity:1; } }
.heal-leaf-outline{
  fill:none; stroke:var(--c-gold-light); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:100; stroke-dashoffset:100; animation:leafDraw 1.6s var(--ease-organic) forwards;
}
.heal-leaf-vein{
  fill:none; stroke:rgba(19,36,32,.55); stroke-width:1.3; stroke-linecap:round;
  stroke-dasharray:100; stroke-dashoffset:100; animation:leafDraw 1s var(--ease-organic) forwards; animation-delay:1.4s;
}
@keyframes leafDraw{ to{ stroke-dashoffset:0; } }

.preloader-text{ margin-top:1.6rem; color:#F3E3C3; font-family:var(--font-display); font-weight:700; font-size:1.4rem; letter-spacing:.1em; text-align:center; opacity:0; animation:healFadeUp .9s ease-out forwards; animation-delay:.3s; }
.preloader-affirmation{
  margin-top:.55rem; color:rgba(255,255,255,.6); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  min-height:1.2em; text-align:center; transition:opacity .5s ease; opacity:0; animation:healFadeUp .9s ease-out forwards; animation-delay:.6s;
}
@keyframes healFadeUp{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
.preloader-bar{ width:180px; height:2px; background:rgba(255,255,255,.15); margin-top:1.6rem; border-radius:2px; overflow:hidden; }
.preloader-bar-fill{ height:100%; width:0%; background:var(--grad-gold); transition:width .3s ease-out; }

/* ============================================================
   NAVBAR
   ============================================================ */
.navbar{ position:fixed; top:0; left:0; right:0; z-index:900; padding:1.0rem 0; transition:all .5s var(--ease-organic);   
    background: rgb(213 223 208);
    backdrop-filter: blur(18px) saturate(160%);
    box-shadow: 0 10px 30px -18px rgba(11, 22, 19, .3);}
.navbar .container{ display:flex; align-items:center; justify-content:space-between; }
.navbar.scrolled{ padding:.9rem 0; background:rgb(213 223 208); backdrop-filter:blur(18px) saturate(160%); box-shadow:0 10px 30px -18px rgba(11,22,19,.3); }
.nav-logo img{width: 161px;}
.navbar.scrolled .nav-logo{ color:var(--c-primary-dark); }
.nav-logo .leaf-mark{ width:34px; height:34px; }
.nav-links{display:flex;align-items:center;gap: 1.0rem;}
.nav-links a{font-size: 0.83rem;font-weight:600;letter-spacing:.02em;position:relative;color: #2e5d50;transition:color .3s ease;text-transform: uppercase;}
.navbar.scrolled .nav-links a{color: #2e5d50;}
.nav-links a::after{ content:''; position:absolute; left:0; bottom:-6px; height:1.5px; width:0; background:var(--c-gold); transition:width .35s var(--ease-organic); }
.nav-links a:hover::after{ width:100%; }

.nav-right{ display:flex; align-items:center; gap:1rem; }
.account-cluster{
  display:flex; align-items:center; gap:.2rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22);
  border-radius:100px; padding:.3rem; transition:all .4s var(--ease-organic);
}
.navbar.scrolled .account-cluster{ background:var(--c-light-green); border-color:rgba(46,93,80,.14); }
.account-cluster a{
  position:relative; display:flex; align-items:center; justify-content:center; width:36px; height:36px;
  border-radius:50%;  font-size:.85rem; transition:all .3s var(--ease-organic);
}
.navbar.scrolled .account-cluster a{ color:var(--c-moss); }
.account-cluster a:hover{ background:var(--grad-gold); color:var(--c-deep); }
.account-cluster .divider{ width:1px; height:16px; background:rgba(255,255,255,.25); }
.navbar.scrolled .account-cluster .divider{ background:rgba(46,93,80,.18); }
.cart-badge{
  position:absolute; top:-3px; right:-3px; width:16px; height:16px; border-radius:50%; background:var(--c-gold);
  color:var(--c-deep); font-size:.6rem; font-weight:800; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--c-primary-dark); transition:border-color .4s ease;
}
.navbar.scrolled .cart-badge{ border-color:var(--c-light-green); }

.nav-toggle{ display:none; flex-direction:column; gap:5px; z-index:901; }
.nav-toggle span{ width:26px; height:2px; background:var(--c-white); transition:.3s; }
.navbar.scrolled .nav-toggle span{ background:var(--c-primary-dark); }
@media(max-width:960px){
  .nav-links{ position:fixed; inset:0 0 0 auto; width:min(320px,80%); height:100vh; background:var(--grad-forest); flex-direction:column; justify-content:center; align-items:flex-start; padding:2rem 2.4rem; gap:1.6rem; transform:translateX(100%); transition:transform .5s var(--ease-organic); }
  .nav-links.open{ transform:translateX(0); }
  .nav-links a{ color:var(--c-white) !important; font-size:1.1rem; }
  .nav-toggle{ display:flex; }
  .account-cluster a:nth-child(1),
  .account-cluster .divider:nth-child(2),
  .account-cluster a:nth-child(3),
  .account-cluster .divider:nth-child(4){ display:none; }
  .nav-right .btn-gold{ display:none; }
}

.nav-spacer{ height:0; }

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}



.hero-video {
  position: absolute;
  top: 9%;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(0 0 0 / 56%);
  z-index: 1;
}

.hero-content {
        margin-top: 30px;
  position: relative;
  z-index: 2;  
  padding-top: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
}

.hero .hero-eyebrow,
.hero .hero-title,
.hero .hero-title em,
.hero .hero-sub,
.hero .rotating-text,
.hero .rotating-word {
  color: #ffffff;
  line-height: 1.9;
  font-family: var(--font-body);
}

.hero .hero-eyebrow {
    font-size: 33px;
}

h1.hero-title.aos-init.aos-animate {
    font-size: 38px;
}

.hero .hero-sub{
  margin-bottom: 30px;
}

.hero .btn-gold {
  color: #ffffff;
      margin-top: 55px;
}

.rotating-text {
  display: flex;
  flex-direction: column;
 margin-bottom: 100px;
  height: 1.6em;
 
}

.rotating-word {
  display: block;
  animation: rotateWord 9s infinite;
  white-space: nowrap;
     font-size: 22px;
  margin-bottom: 20px;
}

 

.hero-stats {
  display: flex;
  justify-content: center;
  gap: 2rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.scroll-indicator{
  position:absolute; bottom:2.2rem; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column;
  align-items:center; gap:.6rem; color:rgba(255,255,255,.75); font-size:.68rem; letter-spacing:.25em; text-transform:uppercase;
}
.scroll-mouse{ width:24px; height:38px; border:1.5px solid rgba(255,255,255,.6); border-radius:14px; position:relative; }
.scroll-mouse::after{ content:''; position:absolute; top:6px; left:50%; width:4px; height:4px; background:var(--c-gold-light); border-radius:50%; transform:translateX(-50%); animation:scrollDot 1.8s ease-in-out infinite; }
@keyframes scrollDot{ 0%{ top:6px; opacity:1;} 70%{ opacity:0;} 100%{ top:22px; opacity:0;} }

/* ============================================================
   ABOUT
   ============================================================ */
.about{ position:relative; background:var(--c-bg); overflow:hidden; }
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:center; }
.about-media{ position:relative; perspective:1600px; }
.about-media .frame-main{border-radius:var(--radius-lg);overflow:hidden;/* box-shadow:var(--shadow-deep); */transform-style:preserve-3d;aspect-ratio: 4/5;/* background:var(--grad-forest); */}
.about-media .frame-main .tilt-el{width:100%;height: 100%;}
.about-media .frame-main canvas{ display:block; width:100%; height:100%; }
.about-media .frame-main-fallback{position:absolute;inset:0;height: 98%;}
.about-media .frame-main-fallback img{margin-top: 10px;width:100%;height: 100%;border-radius: var(--radius-lg);object-fit:cover;}
.about-media .frame-float{ position:absolute; bottom:-8%; left:-14%; width:52%; aspect-ratio:1/1; border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-deep); border:6px solid var(--c-bg); background:var(--grad-forest); }
.about-media .frame-float canvas{ display:block; width:100%; height:100%; }
.about-media .frame-float-fallback{ position:absolute; inset:0; }
.about-media .frame-float-fallback img{ width:100%; height:100%; object-fit:cover; }

.about-copy .section-sub{margin-left: 27px;}
.about-media .frame-badge{
  position:absolute; top:-6%; right:-8%; width:150px; height:150px; border-radius:50%; background:var(--grad-gold);
  display:flex; align-items:center; justify-content:center; text-align:center; font-family:var(--font-display);
  font-weight:700; color:var(--c-deep); box-shadow:var(--shadow-glow); animation:spinSlow 22s linear infinite;
}
@keyframes spinSlow{ to{ transform:rotate(360deg); } }
.about-timeline{ margin-top:2.6rem; display:flex; flex-direction:column; gap:1.4rem; }
.timeline-item{ display:flex; gap:1.2rem; align-items:flex-start; }
.timeline-dot{ min-width:12px; height:12px; border-radius:50%; background:var(--c-gold); margin-top:8px; box-shadow:0 0 0 4px rgba(184,155,94,.2); }
.timeline-item h4{ font-size:1.15rem; margin-bottom:.2rem; color:var(--c-primary-dark); }
.timeline-item p{ color:var(--c-text-soft); font-size:.95rem; }

/* ============================================================
   HEALERS
   ============================================================ */
.healers-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin-top:3rem; }
.healer-card{ border-radius:var(--radius-lg); overflow:hidden; height:520px; box-shadow:var(--shadow-soft); }
.healer-card.tilting{ box-shadow:var(--shadow-deep); }
.healer-card img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease-organic); transform:translateZ(0) scale(1.02); }
.healer-card.tilting img{ transform:translateZ(40px) scale(1.1); }
.healer-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(11,22,19,.94) 100%); display:flex; flex-direction:column; justify-content:flex-end; padding:2rem; color:var(--c-white); transform:translateZ(60px); }
.healer-overlay .country{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--c-gold-light); margin-bottom:.5rem; }
.healer-overlay h3{ color:var(--c-white); font-size:1.7rem; margin-bottom:.4rem; }
.healer-overlay p{ font-size:.9rem; color:rgba(255,255,255,.8); max-height:0; overflow:hidden; opacity:0; transition:all .5s var(--ease-organic); }
.healer-card:hover .healer-overlay p{ max-height:120px; opacity:1; margin-top:.6rem; }
.healer-tags{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.8rem; }
.healer-tags span{ font-size:.68rem; padding:.3rem .7rem; border:1px solid rgba(255,255,255,.3); border-radius:100px; }

/* ============================================================
   WHY CHOOSE
   ============================================================ */
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3rem; }
.why-card{ padding:2.1rem 1.1rem; border-radius:var(--radius-md); text-align:left; }
.why-icon{ width:52px; height:52px; border-radius:16px; background:var(--grad-forest); color:var(--c-white); display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:1.1rem; transform:translateZ(30px); }
.why-card h4{color: bisque;font-size:1.1rem;margin-bottom:.5rem;transform:translateZ(20px);}
.why-card p{font-size:.88rem;color: #fbfffd;transform:translateZ(10px);}

/* ============================================================
   MODALITIES
   ============================================================ */
.modalities-wrap{ position:relative; background:var(--grad-forest); color:var(--c-white); overflow:hidden; }
.modalities-wrap .section-sub{ color:rgba(255,255,255,.75); }
.modalities-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:1rem; margin-top:3rem; }
.mod-chip{
  padding:1.3rem 1rem; border-radius:16px; text-align:center; font-size:.85rem; font-weight:600;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); transition:all .4s var(--ease-organic); cursor:default;
}
.mod-chip:hover{ background:rgba(232,199,126,.22); border-color:var(--c-gold); transform:translateY(-6px) scale(1.04); }

/* ============================================================
   SERVICES
   ============================================================ */
.services{padding: 1.5rem 0 6rem;position: relative; margin-top: 40px !important;}
.services::before{content:''; position:absolute; inset:0; background:var(--grad-mist); pointer-events:none;}
.services .container{position:relative;}

.services-intro{max-width:100%;     display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; margin-bottom:2.6rem;}
.services .eyebrow{/* color:var(--c-moss); */font-weight: 700;font-size: 1.19rem;}
.services .section-title{color: var(--c-primary-dark);line-height:1.15;margin-bottom:1rem; text-align: center;}
.services .section-sub{color: #2e5d50;line-height:1.7;font-weight: 500;font-size: 1.09rem;}

.journey-pills{display:flex; flex-wrap:wrap; gap:.7rem; margin:2.4rem 0 2.8rem;}
.journey-pill{
  display:flex; align-items:center; gap:.55rem; padding:.6rem 1.2rem; border-radius:100px; border:1px solid rgba(30,66,56,.16);
  background:var(--c-white); color:var(--c-text-soft); font-size:.8rem; font-weight:700; cursor:pointer; transition:all .3s var(--ease-organic);
}
.journey-pill .stage-dot{width:6px; height:6px; border-radius:50%; background:var(--c-fern);}
.journey-pill:hover{border-color:var(--c-gold); color:var(--c-primary-dark);}
.journey-pill.active{background:var(--grad-forest); color:var(--c-white); border-color:transparent; box-shadow:var(--shadow-soft);}
.journey-pill.active .stage-dot{background:var(--c-gold-light);}

.services-grid{display:grid;grid-template-columns: repeat(3,1fr);gap:1.1rem;}
.service-card{
  background:var(--c-white); border:1px solid rgba(30,66,56,.08); border-radius:var(--radius-md); padding:1.6rem 1.4rem;
  display:flex; flex-direction:column; gap:1rem; transition:all .4s var(--ease-organic); text-align:left; opacity:1; transform:scale(1);
}
.service-card.hidden{display:none;}
.service-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-soft); border-color:var(--c-gold-light);}
.sc-icon{width:48px; height:48px; border-radius:14px; background:var(--c-light-green); color:var(--c-moss); display:flex; align-items:center; justify-content:center; font-size:1.15rem; transition:all .35s var(--ease-organic);}
.service-card:hover .sc-icon{background:var(--grad-gold); color:var(--c-deep);}
.service-card h4{font-family:var(--font-display);font-weight:700;font-size: 1.3rem;color:var(--c-primary-dark);line-height:1.3;}
.sc-stage{font-size: .88rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c-fern);font-weight:700;}
.sc-enquire{margin-top:auto;display:inline-flex;align-items:center;gap:.4rem;font-size: .98rem;font-weight:700;color:var(--c-gold);padding-top:.3rem;border-top:1px solid rgba(30,66,56,.08);}
.sc-enquire i{transition:transform .3s var(--ease-organic); font-size:.72rem;}
.service-card:hover .sc-enquire i{transform:translateX(3px);}

.service-quote{
  margin-top:3rem; padding:2.6rem; border-radius:var(--radius-lg); text-align:center; display:flex; flex-direction:column;
  align-items:center; gap:1.2rem; background:var(--grad-forest); color:var(--c-white); box-shadow:var(--shadow-glow); max-width:820px; margin-inline:auto;
}
.service-quote i{font-size:1.6rem; color:var(--c-gold-light);}
.service-quote p{font-family:var(--font-display); font-size:1.3rem; font-style:italic; line-height:1.55; color:var(--c-white);}

@media(max-width:1080px){.services-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.services-grid{grid-template-columns:1fr;} .journey-pills{gap:.5rem;}}

.why-cow-section .why-card p{
  color: #000;
}
.why-cow-section .why-card h4{
  color:var(--c-gold);
}

/* ============================================================
   JOURNEY
   ============================================================ */
.journey-track{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; margin-top:4rem; }
.journey-track::before{ content:''; position:absolute; top:34px; left:8%; right:8%; height:1px; background:repeating-linear-gradient(90deg, var(--c-gold) 0 10px, transparent 10px 20px); }
.journey-step{ text-align:center; position:relative; }
.journey-num{ width:68px; height:68px; border-radius:50%; background:var(--c-white); border:1.5px solid var(--c-gold); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:1.5rem; margin:0 auto 1.4rem; color:var(--c-primary); position:relative; z-index:1; box-shadow:var(--shadow-soft); }
.journey-step h4{ font-size:1.20rem; margin-bottom:.5rem; }
.journey-step p{ font-size:1.2rem; color:var(--c-text-soft); }

/* ============================================================
   CERTIFICATIONS
   ============================================================ */
.cert-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-top:3rem; }
.cert-card{ padding:1.8rem; border-radius:var(--radius-md); background:var(--c-white); border-left:3px solid var(--c-gold); box-shadow:0 15px 40px -28px rgba(11,22,19,.4); }
.cert-card h4{ font-size:1.02rem; margin-bottom:.3rem; transform:translateZ(20px); }
.cert-card span{ font-size:.8rem; color:var(--c-gold); font-weight:600; transform:translateZ(10px); display:inline-block; }

.certificate-video{ position:relative; background:var(--c-deep); overflow:hidden; }
.cert-video-bg{
  position:absolute; inset:0; z-index:0; width:100%; height:100%;
  object-fit:cover; opacity:.5;
}
.cert-video-overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(11, 22, 19, 0.326) 0%, rgba(11, 22, 19, 0.299) 55%, rgba(11, 22, 19, 0.315) 100%);
}
.certificate-video .container{ position:relative; z-index:2; }
.certificate-video .section-title{ color:var(--c-white); }
.certificate-video .eyebrow{ color:var(--c-gold-light); }
.certificate-video .eyebrow::before{ background:var(--c-gold-light); }
.certificate-video .cert-card{
  background:rgba(255,255,255,.92); backdrop-filter:blur(8px) saturate(140%); -webkit-backdrop-filter:blur(8px) saturate(140%);
}
@media (prefers-reduced-motion: reduce){
  .cert-video-bg{ display:none; }
  .certificate-video{ background:var(--grad-forest); }
}

/* ============================================================
   TRIO Group          — DEEP DIVE
   ============================================================ */
.trio{ position:relative; background:var(--c-bg); overflow:hidden; }
.trio-intro{ max-width:100%; text-align: center;     display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }

.credential-ribbon-wrap{
  margin-top:2.6rem; overflow:hidden; padding:.4rem 0;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.credential-ribbon{ display:flex; width:max-content; animation:credScroll 38s linear infinite; }
.credential-ribbon-wrap:hover .credential-ribbon{ animation-play-state:paused; }
.cred-track{ display:flex; gap:1rem; padding-right:1rem; }
@keyframes credScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.cred-chip{
  display:flex; align-items:center; gap:.7rem; white-space:nowrap; padding:.85rem 1.3rem 0.85rem 1rem;
  border-radius:100px; background:var(--c-white); border:1px solid rgba(46,93,80,.14);
  box-shadow:0 12px 26px -20px rgba(11,22,19,.4); font-size:.84rem;
}
.cred-chip .cred-ico{ width:30px; height:30px; min-width:30px; border-radius:50%; background:var(--c-light-green); color:var(--c-gold); display:flex; align-items:center; justify-content:center; font-size:.8rem; }
.cred-chip strong{ color:var(--c-primary-dark); font-weight:700; }
.cred-chip span{ color:var(--c-text-soft); }

.trio-modal-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3.5rem; }
.flip-card{ perspective:1700px; height:300px; }
.flip-inner{
  position:relative; width:100%; height:100%; transform-style:preserve-3d;
  transition:transform .85s var(--ease-organic);
}
.flip-card.flipped .flip-inner,
.flip-card:hover .flip-inner{ transform:rotateY(180deg); }
.flip-face{
  position:absolute; inset:0; -webkit-backface-visibility:hidden; backface-visibility:hidden;
  border-radius:var(--radius-md); padding:1.9rem 1.6rem; display:flex; flex-direction:column;
}
.flip-front{ background:var(--grad-forest); color:var(--c-white); justify-content:space-between; box-shadow:var(--shadow-soft); }
.flip-icon{ width:54px; height:54px; border-radius:15px; background:rgba(232,199,126,.14); border:1px solid rgba(232,199,126,.35); display:flex; align-items:center; justify-content:center; font-size:1.3rem; color:var(--c-gold-light); }
.flip-front h4{ color:var(--c-white); font-size:1.2rem; margin-top:1.2rem; line-height:1.25; }
.flip-front p{ font-size:.84rem; color:rgba(255,255,255,.65); margin-top:.5rem; }
.flip-hint{ font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--c-gold-light); display:flex; align-items:center; gap:.4rem; margin-top:auto; }
.flip-hint i{ font-size:.6rem; }
.flip-back{
  background:var(--c-white); border:1px solid rgba(184,155,94,.3); transform:rotateY(180deg);
  box-shadow:var(--shadow-soft); overflow-y:auto;
}
.flip-back h5{ font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--c-gold); margin-bottom:.9rem; }
.flip-back ul{ display:flex; flex-direction:column; gap:.5rem; }
.flip-back li{ font-size:.85rem; color:var(--c-text); display:flex; align-items:flex-start; gap:.5rem; line-height:1.35; }
.flip-back li::before{ content:'\2726'; color:var(--c-gold); font-size:.65rem; margin-top:.28rem; }
.flip-back::-webkit-scrollbar{ width:5px; }
.flip-back::-webkit-scrollbar-thumb{ background:rgba(184,155,94,.4); border-radius:10px; }

.trio-commitment{ margin-top:3rem; }

@media(max-width:1080px){ .trio-modal-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px){ .trio-modal-grid{ grid-template-columns:1fr; } .flip-card{ height:280px; } }

/* ============================================================
   EXPERT SERVICES LIST (NEW)
   ============================================================ */
.expert-list-section{ position:relative; background:var(--c-light-green); overflow:hidden; }
.expert-list-intro{ margin-bottom:2.6rem; } 
.expert-list-intro .section-sub{ color:var(--c-primary-dark); font-weight:600; }
.expert-list-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem 2.4rem; margin-top:2.2rem;
}
.expert-list-item{
  display:flex; align-items:flex-start; gap:1rem; padding:.85rem 1rem; border-radius:14px;
  background:var(--c-white); border:1px solid rgba(46,93,80,.1); transition:all .3s var(--ease-organic);
}
.expert-list-item:hover{ border-color:var(--c-gold-light); transform:translateX(4px); box-shadow:var(--shadow-soft); }
.expert-list-num{
  min-width:34px; height:34px; border-radius:50%; background:var(--grad-forest); color:var(--c-gold-light);
  display:flex; align-items:center; justify-content:center; font-size:.78rem; font-weight:700; font-family:var(--font-body);
}
.expert-list-item p{ font-size:.94rem; color:#141414; font-weight:500; line-height:1.4; }
@media(max-width:860px){ .expert-list-grid{ grid-template-columns:1fr; } }

/* ============================================================
   WHY HOLISTIC SPEED THERAPY (NEW)
   ============================================================ */
.holistic-speed{ position:relative; background:var(--grad-forest); color:var(--c-white); overflow:hidden; }
.holistic-speed-inner{ max-width:820px; margin-inline:auto; text-align:center;     display: flex;
    flex-direction: column;
    align-items: center;}
.holistic-speed .eyebrow{ justify-content:center; }
.holistic-speed .section-title{ color:var(--c-white); }
.holistic-speed-lines{ display:flex; flex-direction:column; gap:1.1rem; margin-top:1.8rem; }
.holistic-speed-lines p{font-size:1.08rem;line-height:1.75;color: #ffff;}
.holistic-speed-lines p strong{color: #fff;font-weight:700;}
.holistic-speed-lines p.accent-green{color: #fff;font-weight:600;}
.holistic-speed-lines .higher-self{color: var(--c-gold); font-size: 1.5rem; font-family:Verdana, Geneva, Tahoma, sans-serif;}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testimonials{ background:var(--c-light-green); position:relative; overflow:hidden; }
.testi-card{ padding:2.4rem; border-radius:var(--radius-md); height:100%; display:flex; flex-direction:column; gap:1rem; }
.testi-stars{ color:var(--c-gold); letter-spacing:.2em; }
.testi-card p{ font-size:1.02rem; color:#2e5d50; font-style:italic; }
.testi-person{ display:flex; align-items:center; gap:.9rem; margin-top:auto; }
.testi-person img{ width:48px; height:48px; border-radius:50%; object-fit:cover; }
.testi-person .flag{ font-size:1.3rem; }
.testi-person h5{ font-size:.95rem; color:var(--c-primary-dark); }
.testi-person span{ font-size:.78rem; color:var(--c-text-soft); }

/* ============================================================
   FAQ
   ============================================================ */
.faq-wrap{ max-width:840px; margin-inline:auto; margin-top:2.5rem; }
.faq-item{ border-bottom:1px solid rgba(46,93,80,.15); }
.faq-q{ width:100%; display:flex; align-items:center; justify-content:space-between; text-align:left; padding:1.4rem 0; font-family:var(--font-display); font-size:1.15rem; color:var(--c-primary-dark); }
.faq-q .icon{ transition:transform .4s var(--ease-organic); color:var(--c-gold); font-size:1.1rem; }
.faq-item.open .faq-q .icon{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .5s var(--ease-organic); }
.faq-a p{ padding-bottom:1.4rem; color:var(--c-text-soft); font-size:.95rem; max-width:680px; }

/* ============================================================
   BOOKING
   ============================================================ */
.booking{ position:relative; background: linear-gradient(
135deg,
#C8A24A 0%,
#4F7A68 30%,
#23483E 65%,
#081412 100%
); color:var(--c-white); overflow:hidden; }
.booking-info
.eyebrow::before{ content:''; width:28px; height:1px; background:var(--c-bg); }
.booking-info
.eyebrow{     font-size: 1.09rem; }

  
.booking-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:3rem; align-items:center; }
.booking-info h2{ color:var(--c-white); }

.booking-form .form-group input:focus, .form-group textarea:focus{
   width: 100%;
    padding: .9rem 1.1rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, .2);
    background: rgba(255, 255, 255, .08);
    color: var(--c-white);
    font-family: inherit;
    font-size: .92rem;
    transition: border .3s ease, background .3s ease;
}

        .booking-form .form-group input,   .booking-form .form-group textarea{    width: 100%;
    padding: .9rem 1.1rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, .2);
    background: rgba(255, 255, 255, .08);
    color: var(--c-white);
    font-family: inherit;
    font-size: .92rem;
    transition: border .3s ease, background .3s ease;}

     .booking-form .form-group input::placeholder, .form-group textarea::placeholder{
        color: #ffffff9b !important;
     }
.booking-info p{ color:rgba(255,255,255,.78); margin-top:1rem; }
.booking-points{ margin-top:2rem; display:flex; flex-direction:column; gap:1rem; }
.booking-points li{ display:flex; gap:.8rem; align-items:center; font-size:1.2rem; color:rgba(255,255,255,.9); }
.booking-points i{ color:var(--c-gold-light); }
.booking-form{ padding:2.4rem; border-radius:var(--radius-lg); }

.booking-form .form-group label{color:#fff;}

.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-group{ margin-bottom:1.1rem; }
.form-group label{ display:block; font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-bottom:.5rem; }
.form-group input, .form-group select, .form-group textarea{
  width:100%; padding:.9rem 1.1rem; border-radius:12px; border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.08); color:var(--c-white); font-family:inherit; font-size:.92rem;
  transition:border .3s ease, background .3s ease;
}
.form-group input::placeholder, .form-group textarea::placeholder{ color:rgba(255,255,255,.4); }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus{ border-color:var(--c-gold); background:rgba(255,255,255,.14); outline:none; }
.form-group select option{ color:#111; }
.form-success{
  display:none; align-items:center; gap:.7rem; padding:.95rem 1.1rem; border-radius:12px;
  background:rgba(232,199,126,.16); border:1px solid rgba(232,199,126,.4); color:#F3E3C3; font-size:.88rem; margin-bottom:1rem;
}
.form-success.show{ display:flex; }

/* ============================================================
   CONTACT
   ============================================================ */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
.contact-list{ display:flex; flex-direction:column; gap:0.6rem; margin-top:2rem; }
.contact-item{ display:flex; gap:1.1rem; align-items:flex-start; }
.contact-icon{ min-width:38px; height:38px; border-radius:14px; background:var(--c-light-green); color:var(--c-primary); display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.contact-item h4{ font-size:1.02rem; margin-bottom:.2rem; }
.contact-item p{ font-size:.9rem; color:var(--c-text-soft); }
.map-frame{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-soft); height:420px; }
.map-frame iframe{ width:100%; height:100%; border:0; filter:grayscale(.3) sepia(.15); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: #3577352e;  /* light green */
  color: #3b3a38;
  padding-top: 5rem;
  position: relative;
  overflow: hidden;
}

.footer-top {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 2.5rem;
  padding-bottom: 3.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.footer-logo {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-family: var(--font-display);
  font-size: 1.5rem;
  color: #2a2926;
  margin-bottom: 1rem;
}

.footer-logo img{
  width: 180px !important;
}

.footer-col h5 {
  color: #2a2926;
  font-family: var(--font-display);
  font-size: 1.09rem;
  margin-bottom: 1.2rem;
}

.footer-col ul {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.footer-col a {
  font-size: 0.98rem;
  color: #0a0a08;
  transition: color 0.3s ease, padding-left 0.3s ease;
}

.footer-col a:hover {
  color: #b89b5e;
  padding-left: 4px;
}

.newsletter-form {
  display: flex;
  margin-top: 1rem;
  border-radius: 100px;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.15);
}

.newsletter-form input {
  flex: 1;
  background: #ffffff;
  border: none;
  padding: 0.85rem 1.2rem;
  color: #3b3a38;
  font-size: 0.85rem;
}

.newsletter-form button {
  background: var(--grad-gold);
  color: #ffffff;
  padding: 0 1.3rem;
  font-weight: 700;
}

.social-row {
  display: flex;
  gap: 0.8rem;
  margin-top: 1.6rem;
}

.social-row a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #5b5954;
  transition: all 0.3s ease;
}

.social-row a:hover {
  background: #b89b5e;
  color: #ffffff;
  border-color: #b89b5e;
  transform: translateY(-4px);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;

  align-items: center;
  padding: 1.8rem 0;
  font-size: 0.95rem;
  color: #010101;
  flex-wrap: wrap;
  border-top: 1px solid #6b6964;
  gap: 1rem;
}

.footer-bottom a {
  color: #5b5954;
  margin-left: 1.2rem;
  transition: color 0.3s;
}

.footer-bottom a:hover {
  color: #b89b5e;
}

.leaf-divider{ display:block; width:100%; height:60px; margin-top:-1px; }
.leaf-divider path{ animation:dividerWave 6s ease-in-out infinite; }
@keyframes dividerWave{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-4px);} }

.wa-float{
  position:fixed; bottom:24px; right:24px; width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.5rem; z-index:800;
  box-shadow:0 10px 30px -8px rgba(37,211,102,.7); animation:waBounce 3s ease-in-out infinite;
}
@keyframes waBounce{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-8px);} }

/* ---------- RESPONSIVE ---------- */
@media(max-width:1080px){
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .modalities-grid{ grid-template-columns:repeat(4,1fr); }
  .healers-grid{ grid-template-columns:1fr; } .healer-card{ height:420px; }
  .cert-grid{ grid-template-columns:1fr 1fr; }
  .about-grid, .booking-grid, .contact-grid{ grid-template-columns:1fr; }
  .about-media{ margin-bottom:3rem; }
  .journey-track{ grid-template-columns:1fr 1fr; row-gap:3rem; } .journey-track::before{ display:none; }
  .footer-top{ grid-template-columns:1fr 1fr; }
}
@media(max-width:640px){
  .why-grid, .cert-grid, .modalities-grid, .journey-track, .footer-top{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  .hero-stats{ gap:1.6rem; }
  body{ cursor:auto; } .cursor-dot, .cursor-leaf, .cursor-trail{ display:none; }
  .tilt-el{ transform:none !important; }
}






.blog-hero {
  position: relative;
  min-height: 50vh;                      /* same height as your contact hero */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  /* dark forest gradient – no image */
background: linear-gradient(155deg, #1a2f27 0%, #2E5D50 40%, #0E1E1A 100%);
}

.blog-hero-overlay {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0, .4);          /* subtle dark layer for extra text contrast */
  z-index: 1;
}

.blog-hero-content {
  position: relative;
  z-index: 2;
  margin-top: 60px;
  text-align: center;
  color: #fff;
  padding: 0 1.5rem;
}

/* Gold eyebrow */
.blog-hero-content .eyebrow {
  color: #E8C77E;                      /* gold-light, hardcoded for reliability */
  justify-content: center;
}
.blog-hero-content .eyebrow::before {
  background: #E8C77E;
}

/* White title */
.blog-hero-content .hero-title {
  color: #fff;
  font-size: clamp(2.4rem, 5vw, 3.2rem);
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  margin-bottom: 1rem;
  text-shadow: 0 2px 10px rgba(0,0,0, .3);
}

/* Subtitle */
.blog-hero-content .hero-sub {
  color: rgba(255,255,255, .9);
  max-width: 600px;
  margin-inline: auto;
  margin-top: 1rem;
  font-size: 1.05rem;
  text-shadow: 0 1px 6px rgba(0,0,0, .25);
}


    /* BLOG CARD */
    .blog-card {
      max-width: 380px;
      width: 100%;
      background: var(--c-white);
      border-radius: var(--radius-md);
      overflow: hidden;
      box-shadow: var(--shadow-soft);
      border: 1px solid rgba(46,93,80,.08);
      transition: transform .35s var(--ease-organic), box-shadow .35s var(--ease-organic);
      cursor: pointer;
    }
    .blog-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 36px 80px -28px rgba(11,22,19,.45);
    }

    /* Image area (gradient placeholder) */
    .blog-card-img {
      width: 100%;
      height: 180px;
      background: linear-gradient(145deg, #23483E, #0E1E1A);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--c-gold-light);
      font-size: 2.5rem;
    }

    .blog-card-body {
      padding: 2.5rem 1.2rem 1rem;
      display: flex;
      flex-direction: column;
    }

    .blog-category {
      display: inline-block;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--c-gold);
      margin-bottom: 1rem;
    }

    .blog-title {
      font-family: var(--font-display);
      font-weight: 700;
      font-size: 1.35rem;
      color: var(--c-primary-dark);
      line-height: 1.25;
      margin-bottom: 0.7rem;
    }

    .blog-excerpt {
      font-size: 0.92rem;
      color: var(--c-text-soft);
      line-height: 1.6;
      margin-bottom: 1.5rem;
      flex: 1;
    }

    .blog-meta {
      display: flex;
      align-items: center;
      gap: 1rem;
      font-size: 0.75rem;
      color: #6b6b6b;
      margin-bottom: 1.2rem;
      padding-top: 1rem;
      border-top: 1px solid rgba(46,93,80,.1);
    }
    .blog-meta span {
      display: flex;
      align-items: center;
      gap: 0.25rem;
    }
    .blog-meta i {
      color: var(--c-gold);
      font-size: 0.7rem;
    }

    .blog-read-more {
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      font-size: 0.85rem;
      font-weight: 700;
      color: var(--c-gold);
      transition: gap 0.3s var(--ease-organic);
    }
    .blog-read-more i {
      font-size: 0.7rem;
      transition: transform 0.3s;
    }
    .blog-card:hover .blog-read-more {
      gap: 0.8rem;
    }
    .blog-card:hover .blog-read-more i {
      transform: translateX(3px);
    }




  .blog-hero-detail {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-top: 70px;                 /* push below fixed navbar */
    color: var(--c-white);
    background-image:
      /* dark gradient overlay for text contrast */
      linear-gradient(180deg, rgba(14,30,26,.35) 0%, rgba(11,20,17,.68) 60%, rgba(9,16,14,.94) 100%),
      /* background image (replace with your own) */
      url('../image/blog.png');
    background-size: cover;
    background-position: center 30%;
    padding: 2rem 0 4.0rem;
  }

  .blog-hero-detail-content {
    position: relative;
    z-index: 2;
    max-width: 780px;
    width: 100%;
    margin: 0 auto;
    padding: 0 1.5rem;
  }

 

  /* Gold tag pill */
  .tag-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.74rem;
    font-weight: 700;
    width: fit-content;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #241505;                  /* dark text on gold */
    background: var(--grad-gold);
    padding: 0.45rem 1rem;
    border-radius: 100px;
    margin-bottom: 1.3rem;
  }

  /* Title */
  .hero-title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(2.3rem, 4.6vw, 3.4rem);
    color: var(--c-white);
    margin-bottom: 1.4rem;
        text-align: justify;
    line-height: 1.14;
    text-shadow: 0 2px 16px rgba(0,0,0,0.25);
  }

  /* Author, date, read time */
  .post-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 1.4rem;
    color: rgba(255,255,255,0.85);
    font-family: var(--font-body);
    font-size: 0.92rem;
    font-weight: 500;
    margin-bottom: 1.8rem;
  }
  .post-meta span {
    display: flex;
    align-items: center;
    gap: 0.45rem;
  }
  .post-meta i {
    color: var(--c-gold-light);
    font-size: 0.82rem;
  }
  .post-meta .dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(255,255,255,0.4);
  }

  /* Breadcrumb at the bottom of the hero */
  .breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.8rem;
    font-weight: 600;
    color: rgba(255,255,255,0.6);
    letter-spacing: 0.01em;
  }
  .breadcrumb a {
    color: rgba(255,255,255,0.8);
    transition: color 0.25s ease;
  }
  .breadcrumb a:hover {
    color: var(--c-gold-light);
  }
  .breadcrumb i {
    font-size: 0.6rem;
    color: rgba(255,255,255,0.4);
  }

  /* Ensure the container is flexible */
  .container.blog-hero-detail-content {
    display: flex;
    flex-direction: column;
  }
        /* ═══════════ Article Section ═══════════ */
        .article-section { padding: 0 0 5.5rem;  margin-top: 100px; background: var(--c-light-green); }
        .article-layout {
            display: grid; grid-template-columns: 1fr 320px; gap: 2.5rem;
              margin: -4.5rem auto 0; align-items: start; position: relative; z-index: 3;
        }
        @media (max-width: 860px) {
            .article-layout { grid-template-columns: 1fr; margin-top: -2.5rem; }
        }

        .article-card {
            background: var(--c-white); border-radius: var(--radius-lg);
            box-shadow: var(--shadow-card); padding: clamp(1.75rem, 4vw, 3.25rem);
        }
        .back-link {
            display: inline-flex; align-items: center; gap: .5rem;
            color: var(--c-gold); font-weight: 700; font-size: .85rem;
            margin-bottom: 2.2rem; transition: gap .3s;
        }
        .back-link:hover { gap: .8rem; }
        .back-link i { font-size: .68rem; }

        .article-body .lead {
            font-family: var(--font-display); font-size: 1.35rem; font-weight: 500;
            color: var(--c-primary-dark); line-height: 1.5; margin-bottom: 2.1rem;
            padding-bottom: 2rem; border-bottom: 1px solid rgba(46,93,80,.12);
        }
        .article-body p.drop { font-size: 1.06rem; color: var(--c-text-soft); line-height: 1.85; margin-bottom: 1.5rem; }
        .article-body p.drop::first-letter {
            font-family: var(--font-display); font-size: 3.6rem; font-weight: 600; line-height: 0.75;
            float: left; margin: .1rem .55rem 0 0; color: var(--c-gold);
        }
        .article-body p {
            font-size: 1.06rem; color: var(--c-text-soft);
            line-height: 1.85; margin-bottom: 1.5rem;
        }
        .article-body h2 {
            font-family: var(--font-display); font-weight: 600;
            font-size: 1.75rem; margin: 2.6rem 0 1.15rem;
            color: var(--c-primary-dark); line-height: 1.25;
            padding-left: 1.1rem; border-left: 4px solid var(--c-gold);
        }
        .pull-quote {
            margin: 2.4rem 0; padding: 1.9rem 2.1rem; background: var(--c-light-green);
            border-radius: var(--radius-md); position: relative;
        }
        .pull-quote i.fa-quote-left { color: var(--c-gold); font-size: 1.3rem; margin-bottom: .8rem; display: block; }
        .pull-quote p { font-family: var(--font-display); font-size: 1.15rem; font-weight: 500; color: var(--c-primary-dark); line-height: 1.55; margin: 0; }
        .pull-quote a { color: var(--c-primary); text-decoration: underline; text-underline-offset: 2px; }

        .tag-row { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 2.2rem; }
        .article-tag {
            font-size: .78rem; font-weight: 600; color: var(--c-primary);
            background: var(--c-light-green); padding: .45rem .95rem; border-radius: 100px;
            transition: background .25s ease, color .25s ease;
        }
        .article-tag:hover { background: var(--c-gold); color: #fff; }

        /* Share Buttons */
        .share-section {
            margin-top: 2.6rem; padding-top: 2rem;
            border-top: 1px solid rgba(46,93,80,.15);
            display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem;
        }
        .share-section h4 { font-family: var(--font-display); font-weight: 600; font-size: 1rem; color: var(--c-primary-dark); }
        .share-buttons { display: flex; gap: .7rem; flex-wrap: wrap; }
        .share-btn {
            width: 38px; height: 38px; border-radius: 50%;
            background: var(--c-light-green); color: var(--c-primary);
            display: flex; align-items: center; justify-content: center;
            font-size: 1rem; transition: background .3s, color .3s, transform .3s;
        }
        .share-btn:hover { background: var(--c-gold); color: #fff; transform: translateY(-3px); }

        /* ═══════════ Sidebar (sticky) ═══════════ */
        .sidebar { display: flex; flex-direction: column; gap: 1.6rem; position: sticky; top: 100px; }
        .sidebar-card {
            background: var(--c-white); border-radius: var(--radius-md);
            box-shadow: var(--shadow-card); padding: 1.8rem;
        }
        .sidebar-card h4 {
            font-family: var(--font-display); font-weight: 600; font-size: 1.05rem;
            color: var(--c-primary-dark); margin-bottom: 1.1rem;
            display: flex; align-items: center; gap: .55rem;
        }
        .sidebar-card h4 i { color: var(--c-gold); font-size: .85rem; }

        .author-bio { display: flex; gap: 1rem; align-items: center; }
        .author-avatar {
            width: 56px; height: 56px; border-radius: 50%;
            background: linear-gradient(135deg, var(--c-gold), var(--c-gold-light));
            display: flex; align-items: center; justify-content: center;
            font-size: 1.35rem; font-weight: 700; color: #241505;
            flex-shrink: 0;
        }
        .author-info h5 { font-family: var(--font-display); font-size: 1rem; color: var(--c-primary-dark); margin-bottom: .3rem; }
        .author-info p { font-size: .85rem; color: var(--c-text-soft); line-height: 1.55; }

        .related-list { list-style: none; padding: 0; margin: 0; }
        .related-list li {
            padding: .75rem 0; border-bottom: 1px solid rgba(46,93,80,.08);
            display: flex; align-items: baseline; gap: .6rem;
        }
        .related-list li:last-child { border-bottom: none; padding-bottom: 0; }
        .related-list li i { color: var(--c-gold); font-size: .65rem; flex-shrink: 0; }
        .related-list a {
            font-size: .89rem; color: var(--c-primary); font-weight: 600;
            transition: color .3s; line-height: 1.4;
        }
        .related-list a:hover { color: var(--c-gold); }

     .article-section   .newsletter-card { background: var(--grad-forest); color: var(--c-white); }
    .article-section    .newsletter-card h4 { color: var(--c-white); }
    .article-section    .newsletter-card h4 i { color: var(--c-gold-light); }
    .article-section    .newsletter-card p { font-size: .85rem; color: rgba(255,255,255,.72); margin-bottom: 1.1rem; line-height: 1.55; }
       .article-section .newsletter-form { display: flex; flex-direction: column; gap: .7rem; }
      .article-section  .newsletter-form input {
            padding: .8rem 1rem; border-radius: var(--radius-sm); border: 1px solid rgba(255,255,255,.18);
            background: rgba(255,255,255,.07); color: var(--c-white); font-family: var(--font-body); font-size: .88rem; outline: none;
        }
      .article-section  .newsletter-form input::placeholder { color: rgba(255,255,255,.45); }
      .article-section  .newsletter-form input:focus { border-color: var(--c-gold); }
      .article-section  .newsletter-form button {
            background: var(--grad-gold); border: none; padding: .8rem 1rem; border-radius: var(--radius-sm);
            font-weight: 700; font-size: .85rem; color: #241505; cursor: pointer; transition: transform .3s var(--ease-organic);
        }
     .article-section   .newsletter-form button:hover { transform: translateY(-2px); }

        @media (max-width: 860px) { .sidebar { position: static; } }
 


    
        /* Booking Card */
        .free-card {
            max-width: 650px; margin: 0 auto; padding: 2.8rem 2.2rem;
            border-radius: var(--radius-lg); color: var(--c-white);
        }
        .form-group { margin-bottom: 1.2rem; }
        .form-group label {
            display: block; font-size: .72rem; font-weight: 700; letter-spacing: .08em;
            text-transform: uppercase; color: rgba(255,255,255,.7); margin-bottom: .5rem;
        }
        .form-group input, .form-group select {
            width: 100%; padding: .9rem 1.1rem; border-radius: 12px;
            border: 1px solid rgba(255,255,255,.2);
            background: rgba(255,255,255,.08); color: var(--c-white);
            font-family: inherit; font-size: .92rem;
            transition: border .3s ease, background .3s ease;
        }
        .form-group input::placeholder { color: rgba(255,255,255,.4); }
        .form-group input:focus, .form-group select:focus {
            border-color: var(--c-gold); background: rgba(255,255,255,.14); outline: none;
        }
        .price-tag {
            display: flex; align-items: baseline; gap: .4rem;
            font-family: var(--font-display); font-size: 2rem; font-weight: 700;
            color: var(--c-gold-light); justify-content: center; margin-bottom: 1.8rem;
        }
        .price-tag .original { text-decoration: line-through; color: rgba(255,255,255,.5); font-size: 1.2rem; }
        .price-tag .current { color: var(--c-gold-light); }

        /* Disclaimers */
        .disclaimer-box {
            background: rgba(255,255,255,.08);
            border-left: 3px solid var(--c-gold-light);
            padding: 1.2rem;
            border-radius: var(--radius-sm);
            margin: 1.8rem 0;
            font-size: .82rem;
            color: rgba(255,255,255,.75);
        }
        .disclaimer-box i { color: var(--c-gold-light); margin-right: .4rem; }



        /* contact */
        
 
  /* Contact Hero – independent classes */
  .contact-hero {
    position: relative;
    min-height: 70vh;                     /* same height as other heroes */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    /* Multi-stop linear gradient (no image, matches MMT palette) */
    background: linear-gradient(155deg, #1a2f27 0%, #2E5D50 30%, #0E1E1A 70%);
  }
  .contact-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0, .35);        /* subtle dark layer for text contrast */
    z-index: 1;
  }
  .contact-hero-content {
    position: relative;
    z-index: 2;
    color: #fff;
    text-align: center;
    max-width: 800px;
    padding: 0 1.5rem;
    margin-top: 50px;
  }
  /* Gold eyebrow (same styling as all MMT pages) */
  .contact-hero-content .eyebrow {
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: .28em;
    text-transform: uppercase;
    font-size: .99rem;
    font-weight: 700;
    color: #E8C77E;                     /* gold‑light */
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: 1rem;
  }
  .contact-hero-content .eyebrow::before {
    content: '';
    width: 28px;
    height: 1px;
    background: #E8C77E;
  }
  /* Title */
  .contact-hero-title {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 700;
    font-size: clamp(2.4rem, 5vw, 3.0rem);
    line-height: 1.15;
    color: #fff;
    margin-bottom: 1.2rem;
    text-shadow: 0 2px 12px rgba(0,0,0, .4);
  }
  /* Subtitle / description */
  .contact-hero-sub {
    font-family: Arial, Helvetica, sans-serif;
    color: rgba(255,255,255, .9);
    margin-top: 1rem;
    font-size: 1.05rem;
    line-height: 1.65;
    text-shadow: 0 1px 6px rgba(0,0,0, .3);
    max-width: 600px;
    margin-inline: auto;
  }
 
   
 
    /* Contact stack: form on top, info card below, single column */
    .contact-stack {
      display: flex;
      flex-direction: column;
      gap: 3rem;
      max-width: 960px;
      margin: 0 auto;
    }

    .info-card {
      background: var(--c-white); border-radius: var(--radius-md);
      padding: 2.4rem; box-shadow: var(--shadow-soft);
      border: 1px solid rgba(46,93,80,.08);
    }
    /* Info items laid out in a responsive row for the wide, bottom-placed card */
    .info-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 1.8rem;
    }
    @media (max-width: 640px) {
      .info-grid { grid-template-columns: 1fr; }
    }
    .info-item { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 0; }
    .info-icon {
      width: 44px; height: 44px; border-radius: 14px;
      background: var(--c-light-green); color: var(--c-primary);
      display: flex; align-items: center; justify-content: center;
      font-size: 1.1rem; flex-shrink: 0;
    }
    .info-item h4 { font-size: 1rem; margin-bottom: .2rem; }
    .info-item p { font-size: .9rem; color: var(--c-text-soft); }

    /* Form card */
    .form-card {
      background: var(--c-white); border-radius: var(--radius-md);
      padding: 2.4rem; box-shadow: var(--shadow-soft);
      border: 1px solid rgba(46,93,80,.08);
    }
    .form-group { margin-bottom: 1.2rem; }
    .form-group label {
      display: block; font-size: .72rem; font-weight: 700; letter-spacing: .08em;
      text-transform: uppercase; color: var(--c-primary-dark); margin-bottom: .5rem;
    }
    .form-group input, .form-group textarea {
      width: 100%; padding: .9rem 1.1rem; border-radius: 12px;
      border: 1px solid rgba(46,93,80,.18); background: var(--c-bg);
      color: var(--c-text); font-family: inherit; font-size: .92rem;
      transition: border .3s ease, background .3s ease, box-shadow .3s ease;
    }
    .form-group input::placeholder, .form-group textarea::placeholder { color: rgba(0,0,0,.4); }
    .form-group input:focus, .form-group textarea:focus {
      border-color: var(--c-gold); background: #32594c;
      outline: none; box-shadow: 0 0 0 3px rgba(184,155,94,.15);
    }

  
        /* contact */




           /* Free Services Hero – isolated classes */
  .free-hero {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: linear-gradient(155deg, #1a2f27 0%, #2E5D50 30%, #0E1E1A 70%);
  }
  .free-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0, .35);
    z-index: 1;
  }
  .free-hero-content {
    position: relative;
    z-index: 2;
    color: #fff;
    text-align: center;
    max-width: 900px;
    padding: 0 1.5rem;
  }
  .free-hero-content .eyebrow {
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: .28em;
    text-transform: uppercase;
    font-size: .99rem;
    font-weight: 700;
    color: #E8C77E;
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: 1rem;
  }
  .free-hero-content .eyebrow::before {
    content: '';
    width: 28px;
    height: 1px;
    background: #E8C77E;
  }
  .free-hero-title {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 700;
    font-size: clamp(2.4rem, 5vw, 3.5rem);
    line-height: 1.15;
    color: #fff;
    margin-bottom: 1.2rem;
    text-shadow: 0 2px 12px rgba(0,0,0, .4);
  }
  .free-hero-sub {
    font-family: Arial, Helvetica, sans-serif;
    color: rgba(255,255,255, .9);
    margin-top: 1.5rem;
    font-size: 1.05rem;
    line-height: 1.65;
    text-shadow: 0 1px 6px rgba(0,0,0, .3);
  }
  .free-hero-sub strong {
    color: #fff;
  }
  .free-hero-sub a {
    color: #E8C77E;
    text-decoration: underline;
    font-weight: 600;
  }
  .free-hero-sub a:hover {
    color: #f2d68a;
  }




  /* login */

     /* Light, premium login design – consistent with registration page */
        .login-hero {
            position: relative;
            min-height: 40vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?q=80&w=1600&auto=format&fit=crop') center/cover no-repeat;
            overflow: hidden;
        }
        .login-hero::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(46,93,80,0.7) 0%, rgba(14,30,26,0.85) 100%);
            z-index: 1;
        }
        .login-hero-content {
            position: relative;
            z-index: 2;
            text-align: center;
            color: #fff;
            padding: 0 1.5rem;
            margin-top: 60px;
        }
        .login-hero-content .eyebrow {
            color: var(--c-gold-light);
            justify-content: center;
        }
        .login-hero-content .eyebrow::before {
            background: var(--c-gold-light);
        }
        .login-hero-content .hero-title {
            color: #fff;
            font-size: clamp(2rem, 5vw, 2.8rem);
            font-weight: 700;
            line-height: 1.15;
            margin-bottom: 1rem;
            text-shadow: 0 2px 8px rgba(0,0,0,0.3);
        }
        .login-hero-content .hero-sub {
            color: rgba(255,255,255, 0.9);
            max-width: 500px;
            margin-inline: auto;
            font-size: 1rem;
        }

        .login-form-wrapper {
            max-width: 480px;
            margin: 120px auto 0;
            position: relative;
            z-index: 3;
            padding: 0 1.5rem 4rem;
        }
        .login-card {
            background: #ffffff;
            border-radius: 28px;
            padding: 2.8rem 2.5rem;
            box-shadow: 0 30px 60px -20px rgba(11,22,19, 0.2), 0 0 0 1px rgba(184,155,94, 0.15);
            border: 1px solid rgba(46,93,80, 0.1);
        }
        .login-card h2 {
            color: var(--c-primary-dark);
            font-family: var(--font-display);
            font-weight: 700;
            margin-bottom: 0.5rem;
            font-size: 1.8rem;
            text-align: center;
        }
        .login-card .form-subtitle {
            color: var(--c-text-soft);
            text-align: center;
            margin-bottom: 2rem;
            font-size: 0.95rem;
        }
        .login-card .form-group {
            margin-bottom: 1.3rem;
        }
        .login-card label {
            display: block;
            font-size: 0.75rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--c-moss);
            margin-bottom: 0.5rem;
        }
        .login-card input {
            width: 100%;
            padding: 0.9rem 1.1rem;
            border-radius: 14px;
            border: 1.5px solid rgba(46,93,80, 0.15);
            background: var(--c-bg);
            color: var(--c-text);
            font-family: var(--font-body);
            font-size: 0.95rem;
            transition: all 0.3s ease;
        }
        .login-card input:focus {
            border-color: var(--c-gold);
            background: #fff;
            outline: none;
            box-shadow: 0 0 0 4px rgba(184,155,94,0.1);
        }
        .login-card input::placeholder {
            color: #999;
        }
        .login-card .remember-forgot {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 1rem 0 1.5rem;
            font-size: 0.85rem;
        }
        .login-card .remember-forgot label {
            display: inline-flex;
            align-items: center;
            gap: 0.4rem;
            text-transform: none;
            letter-spacing: normal;
            font-weight: 400;
            color: var(--c-text-soft);
            margin-bottom: 0;
            font-size: 0.85rem;
        }
        .login-card .remember-forgot input[type="checkbox"] {
            width: auto;
            accent-color: var(--c-gold);
        }
        .login-card .remember-forgot a {
            color: var(--c-gold);
            text-decoration: none;
            font-weight: 600;
        }
        .login-card .btn-submit {
            width: 100%;
            background: var(--grad-gold);
            color: #0B1613;
            font-weight: 700;
            border: none;
            padding: 1rem 2rem;
            border-radius: 100px;
            font-size: 1rem;
            letter-spacing: 0.02em;
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            box-shadow: 0 10px 28px -10px rgba(184,155,94, 0.5);
        }
        .login-card .btn-submit:hover {
            transform: translateY(-3px);
            box-shadow: 0 16px 32px -12px rgba(184,155,94, 0.7);
        }
        .login-card .register-link {
            text-align: center;
            margin-top: 1.8rem;
            color: var(--c-text-soft);
            font-size: 0.9rem;
        }
        .login-card .register-link a {
            color: var(--c-gold);
            font-weight: 600;
        }
        .form-success {
            display: none;
            align-items: center;
            gap: .7rem;
            padding: .95rem 1.1rem;
            border-radius: 14px;
            background: #EAF3EA;
            border: 1px solid var(--c-gold-light);
            color: #2E5D50;
            font-size: .9rem;
            margin-bottom: 1.5rem;
            text-align: center;
        }
        .form-success.show { display: flex; }
        .form-error {
            display: none;
            align-items: center;
            gap: .7rem;
            padding: .95rem 1.1rem;
            border-radius: 14px;
            background: #FDECEC;
            border: 1px solid #E07A7A;
            color: #a12b2b;
            font-size: .9rem;
            margin-bottom: 1.5rem;
            text-align: center;
        }
        .form-error.show { display: flex; }

        @media(max-width: 500px) {
            .login-card { padding: 2rem 1.5rem; }
        }






        /* ============ DONATION PAGE SCOPED STYLES ============ */
.donation-page .hero{
  position:relative;min-height: 100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(184,155,94,.18), transparent 55%),
    radial-gradient(ellipse at 80% 80%, rgba(62,124,89,.25), transparent 55%),
    var(--grad-forest);
}
.donation-page .hero-bg-photo{
  position:absolute;inset:0;background:url('../image/donation-image.png') center/cover no-repeat;opacity:.55;
}
.donation-page .hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,22,19,.35) 0%, rgba(11,22,19,.55) 55%, rgba(11,22,19,.92) 100%);z-index:1;}
.donation-page .hero-content{position:relative;z-index:2;text-align:center;color:var(--c-white);max-width:820px;padding:0 1.6rem; margin-top: 90px !important;}
.donation-page .hero-content .eyebrow{justify-content:center;color:var(--c-gold-light);}
.donation-page .hero-content .eyebrow::before{background:var(--c-gold-light);}
.donation-page .hero-title{color:#fff;font-size:clamp(2.4rem,5vw,3.7rem);line-height:1.1;margin-bottom:1.2rem;}
.donation-page .hero-title em{font-style:italic;color:var(--c-gold-light);}
.donation-page .hero-sub{color:rgba(255,255,255,.82);max-width:700px;margin-inline:auto;font-size:1.08rem;}
.donation-page .hero-sub strong{color:var(--c-gold-light);font-weight:700;}

/* ============ DONATION TICKET ============ */
.donation-page .donate-section{background:var(--grad-forest);position:relative;overflow:hidden;}
.donation-page .donate-section::before{
  content:'';position:absolute;top:-80px;right:-80px;width:320px;height:320px;
  background:var(--grad-glow);border-radius:50%;opacity:.5;pointer-events:none;
}
.donation-page .glass-dark{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
}
.donation-page .ticket-card .form-group label{color: #fff;}
.donation-page .ticket-card{padding:2.6rem 2.2rem;border-radius:var(--radius-lg);box-shadow:var(--shadow-deep);position:relative;z-index:1;}
.donation-page .ticket-card .section-title{font-size:clamp(1.4rem,2.6vw,1.9rem);}

.donation-page .form-group{margin-bottom:1.1rem;}
.donation-page .form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.1rem;}
.donation-page .form-group input,.donation-page .form-group select{
  width:100%;padding:.95rem 1.1rem;border-radius:12px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);
  color:var(--c-white);font-family:inherit;font-size:.92rem;
  transition:border .3s ease, background .3s ease, box-shadow .3s ease;
}
.donation-page .form-group input::placeholder{color:rgba(255,255,255,.4);}
.donation-page .form-group input:focus{border-color:var(--c-gold);background:rgba(255,255,255,.14);outline:none;box-shadow:0 0 0 4px rgba(184,155,94,.18);}
.donation-page .field-label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:.5rem;}
.donation-page .amount-input-wrap{display:flex;align-items:center;background:rgba(255,255,255,.08);border-radius:12px;border:1px solid rgba(255,255,255,.2);transition:border .3s ease, box-shadow .3s ease;}
.donation-page .amount-input-wrap:focus-within{border-color:var(--c-gold);box-shadow:0 0 0 4px rgba(184,155,94,.18);}
.donation-page .amount-input-wrap span{padding-left:1.1rem;font-size:1.3rem;font-weight:700;color:var(--c-gold-light);}
.donation-page .amount-input-wrap input{background:transparent;border:none;color:#fff;flex:1;padding:.95rem 1rem .95rem .5rem;font-size:1.05rem;font-weight:700;}
.donation-page .pay-note{color:rgba(255,255,255,.65);font-size:.83rem;margin-bottom:1.6rem;text-align:center;}
.donation-page .secure-note{text-align:center;margin-top:1rem;font-size:.76rem;color:rgba(255,255,255,.45);}

/* ============ WHY CARDS ============ */
.donation-page .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;}
.donation-page .why-card{
  background:var(--c-white);border-radius:var(--radius-md);
  padding:2.1rem;border-left:3px solid var(--c-gold);
  box-shadow:var(--shadow-soft);transition:transform .35s var(--ease-organic), box-shadow .35s var(--ease-organic);
}
.donation-page .why-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-deep);}
.donation-page .why-card h4{font-size:1.2rem;margin-bottom:.5rem; color: var( --c-gold);}
.donation-page .why-card p{color:#555;font-size:.98rem;}

/* ============ PLAQUE GRID ============ */
.donation-page .plaque-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.donation-page .plaque{
  background:var(--c-white);border-radius:var(--radius-md);
  padding:2rem;border:1px solid rgba(46,93,80,.08);
  transition:all .35s var(--ease-organic);
}
.donation-page .plaque:hover{transform:translateY(-5px);box-shadow:var(--shadow-soft);border-color:var(--c-gold-light);}
.donation-page .plaque h4{font-size:1.3rem;margin-bottom:.5rem;}
.donation-page .plaque p{color:#555;font-size:1.2rem;}

@media(max-width:860px){
  .donation-page .why-grid,.donation-page .plaque-grid{grid-template-columns:1fr;}
  .donation-page .form-row{grid-template-columns:1fr;}
}

/* ============ FAQ ============ */
.donation-page .faq-list{margin-top:2rem;}
.donation-page .faq-item{border-bottom:1px solid rgba(46,93,80,.15);}
.donation-page .faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;
  padding:1.4rem .2rem;font-weight:700;background:none;border:none;cursor:pointer;
  font-family:var(--font-body);font-size:.98rem;color:var(--c-deep);text-align:left;
}
.donation-page .faq-q span{
  flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--c-light-green);
  color:var(--c-primary);display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;transition:transform .3s var(--ease-organic), background .3s var(--ease-organic), color .3s var(--ease-organic);
}
.donation-page .faq-item.open .faq-q span{transform:rotate(45deg);background:var(--c-gold);color:#1a1a1a;}
.donation-page .faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease-organic);}
.donation-page .faq-a p{padding-bottom:1.2rem;color:#555;font-size:.93rem;}

/* Terms checkbox styling */
.donation-page .terms-check {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}
.donation-page .terms-check input[type="checkbox"] {
  width: auto;
  margin-top: 0.2rem;
  accent-color: var(--c-gold);
}
.donation-page .terms-check label {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.8);
  line-height: 1.4;
}
.donation-page .terms-check label a {
  color: var(--c-gold-light);
  text-decoration: underline;
  font-weight: 600;
}
.donation-page .terms-error {
  color: #ffb3b3;
  font-size: 0.8rem;
  margin-top: -0.5rem;
  margin-bottom: 1rem;
  display: none;
}

.donation-page .payment-methods {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
        color: #fff;
    margin-bottom: 10px;
}

.donation-page .payment-methods i {
    color: #fff;
    font-size: 32px;
}







  /* ========== LIGHT, PREMIUM REGISTRATION DESIGN ========== */
        .reg-hero {
            position: relative;
            min-height: 65vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?q=80&w=1600&auto=format&fit=crop') center/cover no-repeat;
            overflow: hidden;
        }
        .reg-hero::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(46,93,80,0.7) 0%, rgba(14,30,26,0.85) 100%);
            z-index: 1;
        }
        .reg-hero-content {
            position: relative;
            z-index: 2;
            text-align: center;
            color: #fff;
            padding: 0 1.5rem;
            margin-top: 60px;
        }
        .reg-hero-content .eyebrow {
            color: var(--c-gold-light);
            justify-content: center;
        }
        .reg-hero-content .eyebrow::before {
            background: var(--c-gold-light);
        }
        .reg-hero-content .hero-title {
            color: #fff;
            font-size: clamp(2rem, 5vw, 2.8rem);
            font-weight: 700;
            line-height: 1.15;
            margin-bottom: 1rem;
            text-shadow: 0 2px 8px rgba(0,0,0,0.3);
        }
        .reg-hero-content .hero-sub {
            color: rgba(255,255,255, 0.9);
            max-width: 550px;
            margin-inline: auto;
            font-size: 1rem;
        }

        .registration-form-wrapper {
            max-width: 780px;
            margin: 40px auto 0;
            position: relative;
            z-index: 3;
            padding: 0 1.5rem 4rem;
        }
        .registration-card {
            background: #ffffff;
            border-radius: 28px;
            padding: 2.8rem 2.5rem;
            box-shadow: 0 30px 60px -20px rgba(11,22,19, 0.2), 0 0 0 1px rgba(184,155,94, 0.15);
            border: 1px solid rgba(46,93,80, 0.1);
        }
        .registration-card h2 {
            color: var(--c-primary-dark);
            font-family: var(--font-display);
            font-weight: 700;
            margin-bottom: 0.5rem;
            font-size: 1.8rem;
            text-align: center;
        }
        .registration-card .form-subtitle {
            color: var(--c-text-soft);
            text-align: center;
            margin-bottom: 2rem;
            font-size: 0.95rem;
        }
        .registration-card .form-group {
            margin-bottom: 1.3rem;
        }
        .registration-card label {
            display: block;
            font-size: 0.75rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--c-moss);
            margin-bottom: 0.5rem;
        }
        .registration-card input,
        .registration-card select,
        .registration-card textarea {
            width: 100%;
            padding: 0.9rem 1.1rem;
            border-radius: 14px;
            border: 1.5px solid rgba(46,93,80, 0.15);
            background: var(--c-bg);
            color: var(--c-text);
            font-family: var(--font-body);
            font-size: 0.95rem;
            transition: all 0.3s ease;
        }
        .registration-card textarea {
            resize: vertical;
            min-height: 100px;
        }
        .registration-card input:focus,
        .registration-card select:focus,
        .registration-card textarea:focus {
            border-color: var(--c-gold);
            background: #fff;
            outline: none;
            box-shadow: 0 0 0 4px rgba(184,155,94,0.1);
        }
        .registration-card input::placeholder,
        .registration-card textarea::placeholder {
            color: #999;
        }
        .registration-card select option {
            color: #111;
        }
        .registration-card .form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1.2rem;
        }
        .registration-card .btn-submit {
            width: 100%;
            background: var(--grad-gold);
            color: #0B1613;
            font-weight: 700;
            border: none;
            padding: 1rem 2rem;
            border-radius: 100px;
            font-size: 1rem;
            letter-spacing: 0.02em;
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            margin-top: 0.5rem;
            box-shadow: 0 10px 28px -10px rgba(184,155,94, 0.5);
        }
        .registration-card .btn-submit:hover {
            transform: translateY(-3px);
            box-shadow: 0 16px 32px -12px rgba(184,155,94, 0.7);
        }
        .registration-card .terms-check {
            display: flex;
            align-items: flex-start;
            gap: 0.5rem;
            margin: 1.2rem 0;
        }
        .registration-card .terms-check input[type="checkbox"] {
            width: auto;
            margin-top: 0.3rem;
            accent-color: var(--c-gold);
        }
        .registration-card .terms-check label {
            text-transform: none;
            letter-spacing: normal;
            font-weight: 400;
            font-size: 0.85rem;
            color: var(--c-text-soft);
            margin-bottom: 0;
        }
        .registration-card .terms-check a {
            color: var(--c-gold);
            text-decoration: underline;
        }
        .login-link {
            text-align: center;
            margin-top: 1.8rem;
            color: var(--c-text-soft);
            font-size: 0.9rem;
        }
        .login-link a {
            color: var(--c-gold);
            font-weight: 600;
        }
        .form-success {
            display: none;
            align-items: center;
            gap: .7rem;
            padding: .95rem 1.1rem;
            border-radius: 14px;
            background: #EAF3EA;
            border: 1px solid var(--c-gold-light);
            color: #2E5D50;
            font-size: .9rem;
            margin-bottom: 1.5rem;
            text-align: center;
        }
        .form-success.show { display: flex; }

        @media(max-width: 600px) {
            .registration-card { padding: 2rem 1.5rem; }
            .registration-card .form-row { grid-template-columns: 1fr; }
        }

        /* ============================================================
           BLOG & BLOG DETAILS STYLES
           ============================================================ */
        .blog-hero {
          position: relative;
          min-height: 50vh;
          display: flex;
          align-items: center;
          justify-content: center;
          overflow: hidden;
          background: linear-gradient(155deg, #1a2f27 0%, #2E5D50 40%, #0E1E1A 100%);
        }

        .blog-hero-overlay {
          position: absolute;
          top: 0; left: 0; width: 100%; height: 100%;
          background: rgba(0,0,0, .4);
          z-index: 1;
        }

        .blog-hero-content {
          position: relative;
          z-index: 2;
          margin-top: 60px;
          text-align: center;
          color: #fff;
          padding: 0 1.5rem;
        }

        .blog-hero-content .eyebrow {
          color: #E8C77E;
          justify-content: center;
        }
        .blog-hero-content .eyebrow::before {
          background: #E8C77E;
        }

        .blog-hero-content .hero-title {
          color: #fff;
          font-size: clamp(2.4rem, 5vw, 3.2rem);
          font-weight: 700;
          line-height: 1.15;
          margin-bottom: 1rem;
          text-shadow: 0 2px 10px rgba(0,0,0, .3);
        }

        .blog-hero-content .hero-sub {
          color: rgba(255,255,255, .9);
          max-width: 600px;
          margin-inline: auto;
          margin-top: 1rem;
          font-size: 1.05rem;
          text-shadow: 0 1px 6px rgba(0,0,0, .25);
        }

        .blog-card {
          width: 100%;
          background: var(--c-white);
          border-radius: var(--radius-md);
          overflow: hidden;
          box-shadow: var(--shadow-soft);
          border: 1px solid rgba(46,93,80,.08);
          transition: transform .35s var(--ease-organic), box-shadow .35s var(--ease-organic);
          cursor: pointer;
        }
        .blog-card:hover {
          transform: translateY(-6px);
          box-shadow: 0 36px 80px -28px rgba(11,22,19,.45);
        }

        .blog-card-img {
          width: 100%;
          height: 220px;
          overflow: hidden;
        }
        .blog-card-img img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }

        .blog-card-body {
          padding: 2rem 1.5rem;
          display: flex;
          flex-direction: column;
        }

        .blog-category {
          display: inline-block;
          font-size: 0.75rem;
          font-weight: 700;
          letter-spacing: 0.12em;
          text-transform: uppercase;
          color: var(--c-gold);
          margin-bottom: 0.8rem;
        }

        .blog-title {
          font-family: var(--font-display);
          font-weight: 700;
          font-size: 1.35rem;
          color: var(--c-primary-dark);
          line-height: 1.25;
          margin-bottom: 0.7rem;
        }

        .blog-excerpt {
          font-size: 0.92rem;
          color: var(--c-text-soft);
          line-height: 1.6;
          margin-bottom: 1.5rem;
          flex: 1;
        }

        .blog-meta {
          display: flex;
          align-items: center;
          gap: 1rem;
          font-size: 0.75rem;
          color: #6b6b6b;
          margin-bottom: 1.2rem;
          padding-top: 1rem;
          border-top: 1px solid rgba(46,93,80,.1);
        }
        .blog-meta span {
          display: flex;
          align-items: center;
          gap: 0.25rem;
        }
        .blog-meta i {
          color: var(--c-gold);
          font-size: 0.7rem;
        }

        .blog-read-more {
          display: inline-flex;
          align-items: center;
          gap: 0.4rem;
          font-size: 0.85rem;
          font-weight: 700;
          color: var(--c-gold);
          transition: gap 0.3s var(--ease-organic);
        }
        .blog-read-more i {
          font-size: 0.7rem;
          transition: transform 0.3s;
        }
        .blog-card:hover .blog-read-more {
          gap: 0.8rem;
        }
        .blog-card:hover .blog-read-more i {
          transform: translateX(3px);
        }

        /* ==================== BLOG DETAIL CODES ==================== */
        .blog-hero-detail {
          position: relative;
          min-height: 60vh;
          display: flex;
          align-items: center;
          overflow: hidden;
          margin-top: 70px;
          color: var(--c-white);
          background-size: cover;
          background-position: center;
          padding: 4rem 0;
        }
        .blog-hero-detail-overlay {
          position: absolute;
          inset: 0;
          background: linear-gradient(180deg, rgba(14,30,26,.35) 0%, rgba(11,20,17,.68) 60%, rgba(9,16,14,.94) 100%);
          z-index: 1;
        }
        .blog-hero-detail-content {
          position: relative;
          z-index: 2;
          max-width: 820px;
          margin: 0 auto;
          padding: 0 1.5rem;
          display: flex;
          flex-direction: column;
        }
        .tag-pill {
          display: inline-flex;
          align-items: center;
          gap: 0.5rem;
          font-family: var(--font-body);
          font-size: 0.74rem;
          font-weight: 700;
          width: fit-content;
          letter-spacing: 0.14em;
          text-transform: uppercase;
          color: #241505;
          background: var(--grad-gold);
          padding: 0.45rem 1rem;
          border-radius: 100px;
          margin-bottom: 1.3rem;
        }
        .hero-title {
          font-family: var(--font-display);
          font-weight: 600;
          font-size: clamp(2.3rem, 4.6vw, 3.4rem);
          color: var(--c-white);
          margin-bottom: 1.4rem;
          line-height: 1.14;
          text-shadow: 0 2px 16px rgba(0,0,0,0.25);
        }
        .post-meta {
          display: flex;
          align-items: center;
          flex-wrap: wrap;
          gap: 0.5rem 1.4rem;
          color: rgba(255,255,255,0.85);
          font-family: var(--font-body);
          font-size: 0.92rem;
          font-weight: 500;
          margin-bottom: 1.8rem;
        }
        .post-meta span {
          display: flex;
          align-items: center;
          gap: 0.45rem;
        }
        .post-meta i {
          color: var(--c-gold-light);
          font-size: 0.82rem;
        }
        .post-meta .dot {
          width: 3px;
          height: 3px;
          border-radius: 50%;
          background: rgba(255,255,255,0.4);
        }
        .breadcrumb {
          display: flex;
          align-items: center;
          gap: 0.5rem;
          font-family: var(--font-body);
          font-size: 0.8rem;
          font-weight: 600;
          color: rgba(255,255,255,0.6);
          letter-spacing: 0.01em;
        }
        .breadcrumb a {
          color: rgba(255,255,255,0.8);
          transition: color 0.25s ease;
        }
        .breadcrumb a:hover {
          color: var(--c-gold-light);
        }
        .breadcrumb i {
          font-size: 0.6rem;
          color: rgba(255,255,255,0.4);
        }

        .article-section {
          padding: 0 0 5.5rem;
          margin-top: 50px;
          background: var(--c-light-green);
        }
        .article-layout {
          display: grid;
          grid-template-columns: 1fr 320px;
          gap: 2.5rem;
          margin: -6rem auto 0;
          align-items: start;
          position: relative;
          z-index: 3;
        }
        @media (max-width: 860px) {
          .article-layout {
            grid-template-columns: 1fr;
            margin-top: -2.5rem;
          }
        }
        .article-card {
          background: var(--c-white);
          border-radius: var(--radius-lg);
          box-shadow: var(--shadow-soft);
          padding: clamp(1.75rem, 4vw, 3.25rem);
        }
        .back-link {
          display: inline-flex;
          align-items: center;
          gap: .5rem;
          color: var(--c-gold);
          font-weight: 700;
          font-size: .85rem;
          margin-bottom: 2.2rem;
          transition: gap .3s;
        }
        .back-link:hover {
          gap: .8rem;
        }
        .back-link i {
          font-size: .68rem;
        }
        .article-body .lead {
          font-family: var(--font-display);
          font-size: 1.35rem;
          font-weight: 500;
          color: var(--c-primary-dark);
          line-height: 1.5;
          margin-bottom: 2.1rem;
          padding-bottom: 2rem;
          border-bottom: 1px solid rgba(46,93,80,.12);
        }
        .article-body p.drop {
          font-size: 1.06rem;
          color: var(--c-text-soft);
          line-height: 1.85;
          margin-bottom: 1.5rem;
        }
        .article-body p.drop::first-letter {
          font-family: var(--font-display);
          font-size: 3.6rem;
          font-weight: 600;
          line-height: 0.75;
          float: left;
          margin: .1rem .55rem 0 0;
          color: var(--c-gold);
        }
        .article-body p {
          font-size: 1.06rem;
          color: var(--c-text-soft);
          line-height: 1.85;
          margin-bottom: 1.5rem;
        }
        .article-body h2 {
          font-family: var(--font-display);
          font-weight: 600;
          font-size: 1.75rem;
          margin: 2.6rem 0 1.15rem;
          color: var(--c-primary-dark);
          line-height: 1.25;
          padding-left: 1.1rem;
          border-left: 4px solid var(--c-gold);
        }
        .pull-quote {
          margin: 2.4rem 0;
          padding: 1.9rem 2.1rem;
          background: var(--c-light-green);
          border-radius: var(--radius-md);
          position: relative;
        }
        .pull-quote i.fa-quote-left {
          color: var(--c-gold);
          font-size: 1.3rem;
          margin-bottom: .8rem;
          display: block;
        }
        .pull-quote p {
          font-family: var(--font-display);
          font-size: 1.15rem;
          font-weight: 500;
          color: var(--c-primary-dark);
          line-height: 1.55;
          margin: 0;
        }
        .pull-quote a {
          color: var(--c-primary);
          text-decoration: underline;
          text-underline-offset: 2px;
        }
        .tag-row {
          display: flex;
          flex-wrap: wrap;
          gap: .6rem;
          margin-top: 2.2rem;
        }
        .article-tag {
          font-size: .78rem;
          font-weight: 600;
          color: var(--c-primary);
          background: var(--c-light-green);
          padding: .45rem .95rem;
          border-radius: 100px;
          transition: background .25s ease, color .25s ease;
        }
        .article-tag:hover {
          background: var(--c-gold);
          color: #fff;
        }
        .share-section {
          margin-top: 2.6rem;
          padding-top: 2rem;
          border-top: 1px solid rgba(46,93,80,.15);
          display: flex;
          align-items: center;
          justify-content: space-between;
          flex-wrap: wrap;
          gap: 1rem;
        }
        .share-section h4 {
          font-family: var(--font-display);
          font-weight: 600;
          font-size: 1rem;
          color: var(--c-primary-dark);
        }
        .share-buttons {
          display: flex;
          gap: .7rem;
          flex-wrap: wrap;
        }
        .share-btn {
          width: 38px;
          height: 38px;
          border-radius: 50%;
          background: var(--c-light-green);
          color: var(--c-primary);
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 1rem;
          transition: background .3s, color .3s, transform .3s;
        }
        .share-btn:hover {
          background: var(--c-gold);
          color: #fff;
          transform: translateY(-3px);
        }

        .sidebar {
          display: flex;
          flex-direction: column;
          gap: 1.6rem;
          position: sticky;
          top: 100px;
        }
        .sidebar-card {
          background: var(--c-white);
          border-radius: var(--radius-md);
          box-shadow: var(--shadow-soft);
          padding: 1.8rem;
        }
        .sidebar-card h4 {
          font-family: var(--font-display);
          font-weight: 600;
          font-size: 1.05rem;
          color: var(--c-primary-dark);
          margin-bottom: 1.1rem;
          display: flex;
          align-items: center;
          gap: .55rem;
        }
        .sidebar-card h4 i {
          color: var(--c-gold);
          font-size: .85rem;
        }
        .author-bio {
          display: flex;
          gap: 1rem;
          align-items: center;
        }
        .author-avatar {
          width: 56px;
          height: 56px;
          border-radius: 50%;
          background: linear-gradient(135deg, var(--c-gold), var(--c-gold-light));
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 1.35rem;
          font-weight: 700;
          color: #241505;
          flex-shrink: 0;
        }
        .author-info h5 {
          font-family: var(--font-display);
          font-size: 1rem;
          color: var(--c-primary-dark);
          margin-bottom: .3rem;
        }
        .author-info p {
          font-size: .85rem;
          color: var(--c-text-soft);
          line-height: 1.55;
        }
        .related-list {
          list-style: none;
          padding: 0;
          margin: 0;
        }
        .related-list li {
          padding: .75rem 0;
          border-bottom: 1px solid rgba(46,93,80,.08);
          display: flex;
          align-items: baseline;
          gap: .6rem;
        }
        .related-list li:last-child {
          border-bottom: none;
          padding-bottom: 0;
        }
        .related-list li i {
          color: var(--c-gold);
          font-size: .65rem;
          flex-shrink: 0;
        }
        .related-list a {
          font-size: .89rem;
          color: var(--c-primary);
          font-weight: 600;
          transition: color .3s;
          line-height: 1.4;
        }
        .related-list a:hover {
          color: var(--c-gold);
        }
        .article-section .newsletter-card {
          background: var(--grad-forest);
          color: var(--c-white);
        }
        .article-section .newsletter-card h4 {
          color: var(--c-white);
        }
        .article-section .newsletter-card h4 i {
          color: var(--c-gold-light);
        }
        .article-section .newsletter-card p {
          font-size: .85rem;
          color: rgba(255,255,255,.72);
          margin-bottom: 1.1rem;
          line-height: 1.55;
        }
        .article-section .newsletter-form {
          display: flex;
          flex-direction: column;
          gap: .7rem;
        }
        .article-section .newsletter-form input {
          padding: .8rem 1rem;
          border-radius: var(--radius-sm);
          border: 1px solid rgba(255,255,255,.18);
          background: rgba(255,255,255,.07);
          color: var(--c-white);
          font-family: var(--font-body);
          font-size: .88rem;
          outline: none;
        }
        .article-section .newsletter-form input::placeholder {
          color: rgba(255,255,255,.45);
        }
        .article-section .newsletter-form input:focus {
          border-color: var(--c-gold);
        }
        .article-section .newsletter-form button {
          background: var(--grad-gold);
          border: none;
          padding: .8rem 1rem;
          border-radius: var(--radius-sm);
          font-weight: 700;
          font-size: .85rem;
          color: #241505;
          cursor: pointer;
          transition: transform .3s var(--ease-organic);
        }
        .article-section .newsletter-form button:hover {
          transform: translateY(-2px);
        }
        @media (max-width: 860px) {
          .sidebar {
            position: static;
          }
        }
        .article-body > div > p:first-of-type::first-letter {
          font-family: var(--font-display);
          font-size: 3.6rem;
          font-weight: 600;
          line-height: 0.75;
          float: left;
          margin: .1rem .55rem 0 0;
          color: var(--c-gold);
        }