:root {
      --primary:       #fb5755;
      --primary-dark:  #d93f3d;
      --primary-light: #ff8f8e;
      --secondary:     #ffe8da;
      --secondary-dark:#ffd4bb;
      --gold:          #ffb347;
      --gold-dark:     #e89d35;
      --text-dark:     #1a0a00;
      --text-mid:      #4a2010;
      --text-light:    #7a5040;
      --white:         #ffffff;
      --bg-light:      #fff9f7;
      --border:        rgba(251,87,85,0.15);
      --shadow:        0 8px 32px rgba(251,87,85,0.13);
      --radius:        18px;
      --radius-sm:     10px;
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: 'Nunito', sans-serif;
      background: var(--bg-light);
      color: var(--text-dark);
      line-height: 1.75;
      overflow-x: hidden;
    }
    h1,h2,h3,h4 { font-family: 'Baloo 2', cursive; line-height: 1.2; }
    a { text-decoration: none; color: inherit; }
    img { max-width: 100%; display: block; }
    .container { max-width: 1160px; margin: 0 auto; padding: 0 20px; }

    /* ── MARQUEE ── */
    .top-bar {
      background: var(--primary); color: #fff;
      font-size: 13px; font-weight: 700;
      padding: 7px 0; overflow: hidden; white-space: nowrap;
    }
    .mq { display: inline-block; animation: mq 32s linear infinite; }
    .mq span { margin: 0 50px; }
    @keyframes mq { from { transform: translateX(100vw); } to { transform: translateX(-100%); } }

    /* ── HEADER ── */
    header {
      background: #fff;
      box-shadow: 0 2px 18px rgba(251,87,85,0.09);
      position: sticky; top: 0; z-index: 999;
    }
    .header-inner {
      display: flex; align-items: center; justify-content: space-between;
      padding: 12px 20px; max-width: 1160px; margin: 0 auto;
    }
    .logo { display: flex; align-items: center; gap: 11px; }
    /* Logo icon — swap .logo-icon for <img> when you have the real logo */
    .logo-icon {
      width: 46px; height: 46px;
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: 12px; display: flex; align-items: center; justify-content: center;
      font-family: 'Baloo 2', cursive; font-weight: 900; font-size: 20px; color: #fff;
      box-shadow: 0 4px 14px rgba(251,87,85,0.35);
      flex-shrink: 0;
    }
    .logo-text .brand { font-family: 'Baloo 2', cursive; font-size: 22px; font-weight: 900; color: var(--primary); display: block; line-height: 1; }
    .logo-text .sub { font-size: 11px; color: var(--text-light); font-weight: 600; }

    nav { display: flex; gap: 2px; }
    nav a { font-weight: 700; font-size: 14px; color: var(--text-mid); padding: 8px 12px; border-radius: 8px; transition: all .2s; }
    nav a:hover { background: var(--secondary); color: var(--primary); }

    /* ── BUTTONS ── */
    .btn {
      display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      padding: 13px 28px; border-radius: 50px;
      font-family: 'Baloo 2', cursive; font-weight: 800; font-size: 15px;
      cursor: pointer; border: none; transition: all .25s; text-decoration: none;
      line-height: 1;
    }
    .btn-primary  { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; box-shadow:0 6px 20px rgba(251,87,85,.38); }
    .btn-primary:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(251,87,85,.5); }
    .btn-gold     { background: linear-gradient(135deg,var(--gold),var(--gold-dark)); color:#3a2000; box-shadow:0 6px 20px rgba(255,179,71,.38); }
    .btn-gold:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(255,179,71,.5); }
    .btn-outline  { background:transparent; color:var(--primary); border:2.5px solid var(--primary); }
    .btn-outline:hover { background:var(--primary); color:#fff; }
    .btn-white    { background:#fff; color:var(--primary); }
    .btn-white:hover { background:var(--secondary); transform:translateY(-2px); }
    .btn-lg  { padding:16px 40px; font-size:17px; }
    .btn-sm  { padding:9px 20px; font-size:13px; }
    .btn-full{ width:100%; }

    /* ── HERO ── */
    .hero {
      background: linear-gradient(140deg, #1a0500 0%, #3d0e0d 55%, #1a0500 100%);
      padding: 70px 0 58px; position: relative; overflow: hidden;
    }
    .hero::before {
      content:''; position:absolute; inset:0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fb5755' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E");
    }
    .hero-glow { position:absolute; width:520px; height:520px; background:radial-gradient(circle,rgba(251,87,85,.28) 0%,transparent 70%); top:-150px; right:-80px; pointer-events:none; }
    .hero-inner { position:relative; display:grid; grid-template-columns:1fr 400px; gap:48px; align-items:center; max-width:1160px; margin:0 auto; padding:0 20px; }
    .hero-badge { display:inline-flex; align-items:center; gap:8px; background:rgba(255,179,71,.14); border:1px solid rgba(255,179,71,.38); color:var(--gold); font-size:13px; font-weight:800; padding:6px 16px; border-radius:50px; margin-bottom:18px; }
    .hero-badge .dot { width:8px; height:8px; background:var(--gold); border-radius:50%; animation:blink 1.5s infinite; }
    @keyframes blink { 0%,100%{opacity:1;}50%{opacity:.3;} }
    .hero h1 { font-size:clamp(28px,4.2vw,52px); font-weight:900; color:#fff; margin-bottom:16px; }
    .hero h1 .hi { color:var(--primary); }
    .hero p.hero-sub { color:rgba(255,255,255,.74); font-size:16px; margin-bottom:28px; max-width:500px; line-height:1.8; }
    .hero-ctas { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px; }
    .hero-stats { display:flex; gap:30px; flex-wrap:wrap; }
    .hero-stat .num { font-family:'Baloo 2',cursive; font-size:23px; font-weight:900; color:#fff; display:block; }
    .hero-stat .lbl { font-size:12px; color:rgba(255,255,255,.5); font-weight:600; }

    /* phone mockup */
    .hero-phone { width:100%; max-width:270px; margin:0 auto; background:linear-gradient(145deg,#2a0a08,#450f0d); border-radius:36px; border:3px solid rgba(251,87,85,.35); padding:18px; box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 50px rgba(251,87,85,.18); }
    .phone-screen { background:#0d0200; border-radius:22px; padding:16px; display:flex; flex-direction:column; gap:9px; }
    .ps-logo { background:var(--primary); border-radius:10px; padding:9px 12px; font-family:'Baloo 2',cursive; font-weight:900; font-size:19px; color:#fff; text-align:center; }
    .ps-row { background:rgba(251,87,85,.12); border:1px solid rgba(251,87,85,.28); border-radius:9px; padding:9px 13px; display:flex; align-items:center; justify-content:space-between; color:#fff; }
    .ps-row .g { font-weight:800; font-size:13px; }
    .ps-row .p { color:var(--gold); font-weight:800; font-size:12px; }
    .ps-bar { background:linear-gradient(135deg,rgba(255,179,71,.2),rgba(255,179,71,.05)); border:1px solid rgba(255,179,71,.28); border-radius:9px; padding:9px; text-align:center; color:var(--gold); font-weight:800; font-size:12px; }

    /* ── TRUST BAR ── */
    .trust-bar { background:#fff; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:18px 0; }
    .trust-items { display:flex; justify-content:center; align-items:center; gap:32px; flex-wrap:wrap; }
    .trust-item { display:flex; align-items:center; gap:9px; font-weight:700; font-size:14px; color:var(--text-mid); }
    .ti { width:33px; height:33px; background:var(--secondary); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:16px; }

    /* ── SECTION HELPERS ── */
    section { padding:68px 0; }
    .sec-label { display:inline-block; background:var(--secondary); color:var(--primary); font-size:12px; font-weight:800; padding:5px 15px; border-radius:50px; letter-spacing:1px; text-transform:uppercase; margin-bottom:12px; }
    .section-title { text-align:center; margin-bottom:46px; }
    .section-title h2 { font-size:clamp(24px,3.5vw,40px); font-weight:900; color:var(--text-dark); margin-bottom:12px; }
    .section-title h2 span { color:var(--primary); }
    .section-title p { font-size:15px; color:var(--text-light); max-width:580px; margin:0 auto; }
    .divider { width:56px; height:5px; background:linear-gradient(to right,var(--primary),var(--gold)); border-radius:3px; margin:14px auto 0; }

    /* ── ABOUT ── */
    .about-section { background:#fff; }
    .about-grid { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:start; }
    .about-text h2 { font-size:clamp(23px,3vw,35px); font-weight:900; color:var(--text-dark); margin-bottom:14px; }
    .about-text h2 span { color:var(--primary); }
    .about-text p { font-size:15px; color:var(--text-mid); margin-bottom:14px; line-height:1.82; }
    .about-ctas { display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; }

    .features-card { background:var(--bg-light); border:1.5px solid var(--border); border-radius:var(--radius); padding:30px; }
    .features-card h3 { font-size:19px; font-weight:900; color:var(--text-dark); margin-bottom:7px; }
    .features-card .fc-sub { font-size:13px; color:var(--text-light); margin-bottom:18px; }
    .feat-list { list-style:none; display:flex; flex-direction:column; gap:11px; }
    .feat-list li { display:flex; align-items:flex-start; gap:11px; font-size:14px; color:var(--text-mid); font-weight:600; }
    .feat-list li .ck { width:23px; height:23px; flex-shrink:0; background:var(--primary); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; margin-top:1px; }

    /* ── GAMES ── */
    .games-section { background:var(--bg-light); }
    .games-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
    .game-card { background:#fff; border:1.5px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:all .3s; }
    .game-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); border-color:var(--primary); }
    .game-head { padding:24px 24px 16px; display:flex; align-items:flex-start; gap:15px; }
    .game-icon { width:62px; height:62px; border-radius:15px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:30px; }
    .gi-c  { background:linear-gradient(135deg,#ff6b6b,#ee0979); }
    .gi-m  { background:linear-gradient(135deg,#2196F3,#0d47a1); }
    .gi-l  { background:linear-gradient(135deg,#f7971e,#ffd200); }
    .gi-f  { background:linear-gradient(135deg,#56ab2f,#a8e063); }
    .game-meta h3 { font-size:18px; font-weight:900; color:var(--text-dark); margin-bottom:5px; }
    .game-tag { display:inline-block; background:var(--secondary); color:var(--primary); font-size:11px; font-weight:800; padding:3px 10px; border-radius:50px; }
    .game-body { padding:0 24px 24px; }
    .game-body p { font-size:14px; color:var(--text-light); line-height:1.78; }

    /* ── TWO-COL STEPS LAYOUT ── */
    .steps-section   { background:#fff; }
    .steps-section.bg-alt { background:var(--bg-light); }
    .steps-dark-bg { background:linear-gradient(140deg,#1a0500,#3d0e0d); padding:76px 0; }

    .two-col { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:start; }

    .col-info h2 { font-size:clamp(22px,3vw,36px); font-weight:900; color:var(--text-dark); margin-bottom:14px; }
    .col-info h2 span { color:var(--primary); }
    .col-info h2.lc { color:#fff; }
    .col-info h2.lc span { color:var(--primary-light); }
    .col-info p { font-size:15px; color:var(--text-light); margin-bottom:14px; line-height:1.82; }
    .col-info p.lc { color:rgba(255,255,255,.72); }
    .col-info .note { font-size:13px; color:var(--text-light); background:var(--secondary); border-radius:var(--radius-sm); padding:12px 16px; margin-top:10px; margin-bottom:20px; }
    .col-info .note.dark { background:rgba(255,255,255,.08); color:rgba(255,255,255,.65); }

    .steps-card { background:#fff; border-radius:var(--radius); padding:34px; box-shadow:var(--shadow); border:1.5px solid var(--border); }
    .steps-card.dark { background:rgba(255,255,255,.06); border-color:rgba(251,87,85,.25); backdrop-filter:blur(10px); }
    .steps-card h3 { font-size:18px; font-weight:900; color:var(--text-dark); margin-bottom:20px; }
    .steps-card h3.lc { color:#fff; }

    .step-list { display:flex; flex-direction:column; gap:13px; }
    .step-item { display:flex; gap:13px; align-items:flex-start; }
    .sn { width:31px; height:31px; flex-shrink:0; background:linear-gradient(135deg,var(--primary),var(--primary-dark)); border-radius:50%; color:#fff; font-weight:900; font-size:14px; display:flex; align-items:center; justify-content:center; margin-top:2px; }
    .sn.dk { background:rgba(251,87,85,.22); border:1px solid rgba(251,87,85,.48); color:var(--primary-light); }
    .st h4 { font-size:14px; font-weight:800; color:var(--text-dark); margin-bottom:2px; }
    .st h4.lc { color:#fff; }
    .st p { font-size:13px; color:var(--text-light); }
    .st p.lc { color:rgba(255,255,255,.62); }

    /* login bullet list */
    .login-bullets { list-style:none; display:flex; flex-direction:column; gap:10px; margin-bottom:26px; }
    .login-bullets li { display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.82); font-weight:600; font-size:14px; }
    .lb-ck { width:22px; height:22px; flex-shrink:0; background:rgba(251,87,85,.22); border:1px solid rgba(251,87,85,.48); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--primary-light); font-size:11px; }

    /* ── DEPOSIT + WITHDRAW ── */
    .dw-section { background:var(--bg-light); }
    .dw-grid { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
    .dw-card { background:#fff; border-radius:var(--radius); padding:32px; box-shadow:var(--shadow); border:1.5px solid var(--border); }
    .dw-card.accent { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); border-color:transparent; }
    .dw-card h3 { font-size:19px; font-weight:900; color:var(--text-dark); margin-bottom:8px; display:flex; align-items:center; gap:9px; }
    .dw-card.accent h3 { color:#fff; }
    .dw-card > p { font-size:14px; color:var(--text-light); margin-bottom:20px; }
    .dw-card.accent > p { color:rgba(255,255,255,.8); }

    .pay-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:18px; }
    .pay-badge { background:var(--bg-light); border:1.5px solid var(--border); border-radius:var(--radius-sm); padding:10px 6px; text-align:center; font-weight:800; font-size:12px; color:var(--text-dark); transition:all .2s; }
    .pay-badge:hover { border-color:var(--primary); color:var(--primary); background:var(--secondary); }
    .pay-badge .pe { font-size:19px; display:block; margin-bottom:3px; }

    .dw-steps { display:flex; flex-direction:column; gap:10px; }
    .dw-step { display:flex; gap:11px; align-items:flex-start; }
    .dn { width:26px; height:26px; flex-shrink:0; background:var(--secondary); border-radius:50%; color:var(--primary); font-weight:900; font-size:12px; display:flex; align-items:center; justify-content:center; margin-top:2px; }
    .dw-card.accent .dn { background:rgba(255,255,255,.18); color:#fff; }
    .dt { font-size:14px; color:var(--text-mid); font-weight:600; padding-top:2px; }
    .dw-card.accent .dt { color:rgba(255,255,255,.88); }
    .min-bar { background:var(--secondary); border-radius:var(--radius-sm); padding:13px 17px; display:flex; align-items:center; justify-content:space-between; margin-top:16px; }
    .min-bar .ml { font-size:12px; color:var(--text-light); font-weight:700; }
    .min-bar .mv { font-family:'Baloo 2',cursive; font-size:25px; font-weight:900; color:var(--primary); }
    .min-bar-dark { background:rgba(255,255,255,.12); border-radius:var(--radius-sm); padding:13px 17px; display:flex; align-items:center; justify-content:space-between; margin-top:16px; }
    .min-bar-dark .ml { font-size:12px; color:rgba(255,255,255,.7); font-weight:700; }
    .min-bar-dark .mv { font-family:'Baloo 2',cursive; font-size:25px; font-weight:900; color:var(--gold); }

    /* ── REFERRAL ── */
    .referral-section { background:#fff; }
    .ref-box { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); border-radius:var(--radius); padding:48px 44px; display:grid; grid-template-columns:1fr auto; gap:36px; align-items:center; }
    .ref-box h2 { font-size:30px; font-weight:900; color:#fff; margin-bottom:12px; }
    .ref-box p { color:rgba(255,255,255,.82); font-size:15px; line-height:1.8; max-width:540px; }
    .ref-stat { background:rgba(255,255,255,.12); border-radius:var(--radius-sm); padding:22px 28px; text-align:center; }
    .ref-stat .rn { font-family:'Baloo 2',cursive; font-size:36px; font-weight:900; color:var(--gold); }
    .ref-stat .rl { font-size:12px; color:rgba(255,255,255,.68); font-weight:700; margin-top:4px; }

    /* ── HOW TO PLAY ── */
    .howplay-section { background:var(--bg-light); }
    .hp-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
    .hp-card { background:#fff; border:1.5px solid var(--border); border-radius:var(--radius); padding:26px 16px; text-align:center; transition:all .3s; }
    .hp-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); border-color:var(--primary); }
    .hp-num { width:42px; height:42px; margin:0 auto 12px; background:linear-gradient(135deg,var(--primary),var(--primary-dark)); border-radius:50%; color:#fff; font-family:'Baloo 2',cursive; font-weight:900; font-size:19px; display:flex; align-items:center; justify-content:center; box-shadow:0 5px 16px rgba(251,87,85,.33); }
    .hp-icon { font-size:28px; margin-bottom:10px; }
    .hp-card h4 { font-size:14px; font-weight:800; color:var(--text-dark); margin-bottom:6px; }
    .hp-card p { font-size:12px; color:var(--text-light); line-height:1.65; }

    /* ── CONCLUSION ── */
    .conclusion-section { background:#fff; }
    .conclusion-box { max-width:800px; margin:0 auto; background:var(--bg-light); border:1.5px solid var(--border); border-radius:var(--radius); padding:42px; }
    .conclusion-box h2 { font-size:26px; font-weight:900; color:var(--text-dark); margin-bottom:14px; }
    .conclusion-box h2 span { color:var(--primary); }
    .conclusion-box p { font-size:15px; color:var(--text-mid); line-height:1.85; margin-bottom:13px; }
    .conclusion-box p:last-of-type { margin-bottom:0; }
    .conc-ctas { display:flex; gap:13px; flex-wrap:wrap; margin-top:26px; }

    /* ── FAQ ── */
    .faq-section { background:var(--bg-light); }
    .faq-list { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:13px; }
    .faq-item { background:#fff; border:1.5px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; }
    .faq-item.open { border-color:var(--primary); }
    .faq-q { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; cursor:pointer; font-weight:800; font-size:15px; color:var(--text-dark); }
    .arr { width:27px; height:27px; flex-shrink:0; background:var(--secondary); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:17px; font-weight:900; transition:transform .3s; }
    .faq-item.open .faq-q .arr { transform:rotate(45deg); background:var(--primary); color:#fff; }
    .faq-a { display:none; padding:0 20px 16px; font-size:14px; color:var(--text-light); line-height:1.78; }
    .faq-item.open .faq-a { display:block; }

    /* ── CTA BANNER ── */
    .cta-section { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); padding:66px 0; text-align:center; }
    .cta-section h2 { font-size:clamp(25px,4vw,40px); font-weight:900; color:#fff; margin-bottom:13px; }
    .cta-section p { color:rgba(255,255,255,.82); font-size:16px; margin-bottom:28px; max-width:560px; margin-left:auto; margin-right:auto; }
    .cta-btns { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }

    /* ── FOOTER ── */
    footer { background:#0d0200; color:rgba(255,255,255,.66); }
    .footer-top { padding:54px 0 34px; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:34px; }
    .fl-logo { display:flex; align-items:center; gap:10px; margin-bottom:13px; }
    .fl-icon { width:41px; height:41px; background:var(--primary); border-radius:10px; display:flex; align-items:center; justify-content:center; font-family:'Baloo 2',cursive; font-weight:900; font-size:18px; color:#fff; flex-shrink:0; }
    .fl-name { font-family:'Baloo 2',cursive; font-size:20px; font-weight:900; color:#fff; }
    .footer-brand p { font-size:13px; line-height:1.75; max-width:270px; margin-bottom:17px; }
    .footer-col h4 { font-family:'Baloo 2',cursive; font-size:16px; font-weight:800; color:#fff; margin-bottom:13px; }
    .footer-col ul { list-style:none; display:flex; flex-direction:column; gap:8px; }
    .footer-col ul li a { font-size:13px; color:rgba(255,255,255,.55); transition:color .2s; }
    .footer-col ul li a:hover { color:var(--primary-light); }
    .footer-bottom { border-top:1px solid rgba(255,255,255,.07); padding:17px 0; text-align:center; }
    .footer-bottom p { font-size:12px; color:rgba(255,255,255,.33); }
    .footer-bottom a { color:var(--primary-light); }
    .disclaimer { background:rgba(255,255,255,.028); border-top:1px solid rgba(255,255,255,.05); padding:14px 0; text-align:center; }
    .disclaimer p { font-size:11px; color:rgba(255,255,255,.27); max-width:800px; margin:0 auto; line-height:1.65; }

    /* ── STICKY MOBILE CTA ── */
    .sticky-cta { position:fixed; bottom:0; left:0; right:0; background:#fff; border-top:2px solid var(--border); padding:11px 14px; display:none; gap:10px; z-index:998; box-shadow:0 -4px 18px rgba(0,0,0,.1); }
    .sticky-cta.show { display:flex; }

    /* ── RESPONSIVE ── */
    @media (max-width:980px) {
      .hero-inner, .about-grid, .two-col, .dw-grid, .ref-box { grid-template-columns:1fr; }
      .hero-phone { display:none; }
      .ref-box { padding:34px 26px; }
      .hp-grid { grid-template-columns:repeat(3,1fr); }
      .games-grid { grid-template-columns:1fr; }
      .footer-top { grid-template-columns:1fr 1fr; }
    }
    @media (max-width:640px) {
      nav { display:none; }
      .hp-grid { grid-template-columns:repeat(2,1fr); }
      .footer-top { grid-template-columns:1fr; }
      .cta-btns, .hero-ctas, .about-ctas, .conc-ctas { flex-direction:column; align-items:stretch; }
      .conclusion-box { padding:26px 18px; }
      .sticky-cta { flex-direction:column; }
      .dw-grid { grid-template-columns:1fr; }
    }

     /* ═══ BREADCRUMB ═══ */
    .breadcrumb-bar { background: var(--white); border-bottom: 1px solid var(--border); padding: 12px 0; }
    .breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; flex-wrap: wrap; }
    .breadcrumb a { color: var(--primary); transition: opacity .2s; }
    .breadcrumb a:hover { opacity: .75; }
    .breadcrumb .sep { color: var(--text-light); font-size: 12px; }
    .breadcrumb .current { color: var(--text-light); }

    /* ═══ PAGE HERO (About) ═══ */
    .page-hero {
      background: linear-gradient(140deg, #1a0500 0%, #3d0e0d 55%, #1a0500 100%);
      padding: 60px 0 54px; position: relative; overflow: hidden; text-align: center;
    }
    .page-hero::before {
      content:''; position:absolute; inset:0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fb5755' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E");
    }
    .hero-glow { position:absolute; width:460px; height:460px; background:radial-gradient(circle,rgba(251,87,85,.26) 0%,transparent 70%); top:-160px; right:-60px; pointer-events:none; }
    .hero-glow-l { position:absolute; width:320px; height:320px; background:radial-gradient(circle,rgba(251,87,85,.15) 0%,transparent 70%); bottom:-120px; left:-60px; pointer-events:none; }
    .page-hero-inner { position: relative; }
    .page-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(255,232,218,.12); border: 1px solid rgba(255,232,218,.3);
      color: var(--secondary); font-size: 13px; font-weight: 800;
      padding: 6px 16px; border-radius: 50px; margin-bottom: 18px;
    }
    .page-hero h1 { font-size: clamp(32px,5vw,56px); font-weight: 900; color: #fff; margin-bottom: 16px; }
    .page-hero h1 span { color: var(--primary); }
    .page-hero p { color: rgba(255,255,255,.74); font-size: 17px; max-width: 600px; margin: 0 auto; line-height: 1.8; }

    /* ═══ SECTION HELPERS ═══ */
    section { padding: 68px 0; }
    .sec-label {
      display: inline-block; background: var(--secondary); color: var(--primary);
      font-size: 12px; font-weight: 800; padding: 5px 15px;
      border-radius: 50px; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px;
    }
    .divider { width: 56px; height: 5px; background: linear-gradient(to right,var(--primary),var(--gold)); border-radius: 3px; margin: 14px 0 0; }
    .divider.center { margin: 14px auto 0; }

    /* ═══ MAIN CONTENT ═══ */
    .about-content-section { background: #fff; }
    .about-layout { display: grid; grid-template-columns: 1fr 340px; gap: 50px; align-items: start; }

    /* article prose */
    .about-article h2 {
      font-size: clamp(22px,2.8vw,32px); font-weight: 900; color: var(--text-dark);
      margin: 34px 0 12px; padding-top: 4px;
    }
    .about-article h2:first-child { margin-top: 0; }
    .about-article h2 span { color: var(--primary); }
    .about-article p { font-size: 15px; color: var(--text-mid); line-height: 1.88; margin-bottom: 16px; }
    .about-article p strong { color: var(--text-dark); }
    .about-article p a { color: var(--primary); font-weight: 700; border-bottom: 1px solid rgba(251,87,85,.3); transition: border-color .2s; }
    .about-article p a:hover { border-color: var(--primary); }

    /* highlight box */
    .highlight-box {
      background: linear-gradient(135deg, var(--secondary), #fff8f4);
      border: 1.5px solid rgba(251,87,85,.2);
      border-left: 4px solid var(--primary);
      border-radius: var(--radius-sm);
      padding: 20px 22px;
      margin: 24px 0;
    }
    .highlight-box p { margin: 0; font-size: 15px; color: var(--text-mid); line-height: 1.8; }
    .highlight-box p strong { color: var(--primary); }

    /* contact callout */
    .contact-callout {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: var(--radius);
      padding: 28px 30px;
      margin: 28px 0;
      display: flex;
      align-items: center;
      gap: 20px;
    }
    .cc-icon { font-size: 36px; flex-shrink: 0; }
    .cc-text h4 { font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 5px; }
    .cc-text p { font-size: 14px; color: rgba(255,255,255,.82); margin: 0; }
    .cc-text a { color: var(--gold); font-weight: 800; }
    .cc-text a:hover { text-decoration: underline; }

    /* ═══ SIDEBAR ═══ */
    .sidebar { display: flex; flex-direction: column; gap: 22px; }

    .sidebar-card {
      background: var(--bg-light); border: 1.5px solid var(--border);
      border-radius: var(--radius); padding: 26px;
    }
    .sidebar-card h3 { font-size: 17px; font-weight: 900; color: var(--text-dark); margin-bottom: 16px; display: flex; align-items: center; gap: 9px; }

    /* values list */
    .values-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
    .values-list li { display: flex; align-items: flex-start; gap: 11px; font-size: 14px; color: var(--text-mid); font-weight: 600; }
    .vl-icon { width: 32px; height: 32px; flex-shrink: 0; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 16px; background: var(--secondary); }

    /* quick links */
    .quick-links { list-style: none; display: flex; flex-direction: column; gap: 8px; }
    .quick-links li a {
      display: flex; align-items: center; justify-content: space-between;
      font-size: 14px; font-weight: 700; color: var(--text-mid);
      padding: 10px 14px; border-radius: var(--radius-sm);
      background: #fff; border: 1.5px solid var(--border);
      transition: all .2s;
    }
    .quick-links li a:hover { border-color: var(--primary); color: var(--primary); background: var(--secondary); }
    .quick-links li a .ql-arr { color: var(--primary); font-size: 16px; }

    /* cta card */
    .sidebar-cta {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: var(--radius); padding: 26px; text-align: center;
    }
    .sidebar-cta h3 { font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 8px; }
    .sidebar-cta p { font-size: 13px; color: rgba(255,255,255,.8); margin-bottom: 18px; }
    .sidebar-cta .btn { width: 100%; margin-bottom: 10px; }
    .sidebar-cta .btn:last-child { margin-bottom: 0; }

    /* ═══ PILLARS GRID ═══ */
    .pillars-section { background: var(--bg-light); }
    .pillars-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
    .pillar-card {
      background: #fff; border: 1.5px solid var(--border); border-radius: var(--radius);
      padding: 30px 24px; text-align: center; transition: all .3s;
    }
    .pillar-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: var(--primary); }
    .pillar-icon { font-size: 40px; margin-bottom: 14px; display: block; }
    .pillar-card h3 { font-size: 18px; font-weight: 900; color: var(--text-dark); margin-bottom: 10px; }
    .pillar-card p { font-size: 14px; color: var(--text-light); line-height: 1.75; }

    /* ═══ STATS ROW ═══ */
    .stats-section { background: linear-gradient(135deg, #1a0500, #3d0e0d); padding: 56px 0; }
    .stats-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
    .stat-box { text-align: center; }
    .stat-box .sn { font-family: 'Baloo 2', cursive; font-size: 38px; font-weight: 900; color: #fff; display: block; line-height: 1; }
    .stat-box .sl { font-size: 13px; color: rgba(255,255,255,.58); font-weight: 700; margin-top: 6px; display: block; }
    .stat-box .sn span { color: var(--primary); }

  
    /* ═══ CTA BANNER ═══ */
    .cta-section { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); padding: 66px 0; text-align: center; }
    .cta-section h2 { font-size: clamp(25px,4vw,40px); font-weight: 900; color: #fff; margin-bottom: 13px; }
    .cta-section p { color: rgba(255,255,255,.82); font-size: 16px; margin-bottom: 28px; max-width: 560px; margin-left: auto; margin-right: auto; }
    .cta-btns { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }



     /* ═══ RESPONSIVE ═══ */
    @media (max-width: 980px) {
      .about-layout { grid-template-columns: 1fr; }
      .sidebar { order: -1; display: grid; grid-template-columns: 1fr 1fr; }
      .pillars-grid { grid-template-columns: 1fr 1fr; }
      .stats-grid { grid-template-columns: repeat(2,1fr); }
      .interlink-grid { grid-template-columns: 1fr 1fr; }
      .footer-top { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 640px) {
      nav { display: none; }
      .sidebar { grid-template-columns: 1fr; }
      .pillars-grid, .interlink-grid { grid-template-columns: 1fr; }
      .stats-grid { grid-template-columns: repeat(2,1fr); }
      .footer-top { grid-template-columns: 1fr; }
      .cta-btns { flex-direction: column; align-items: center; }
      .sticky-cta { flex-direction: column; }
      .contact-callout { flex-direction: column; text-align: center; }
    }



/* contact us */

        /* ═══ BREADCRUMB ═══ */
    .breadcrumb-bar { background: #fff; border-bottom: 1px solid var(--border); padding: 12px 0; }
    .breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; flex-wrap: wrap; }
    .breadcrumb a { color: var(--primary); transition: opacity .2s; }
    .breadcrumb a:hover { opacity: .75; }
    .breadcrumb .sep { color: var(--text-light); font-size: 12px; }
    .breadcrumb .current { color: var(--text-light); }

    /* ═══ PAGE HERO ═══ */
    .page-hero {
      background: linear-gradient(140deg, #1a0500 0%, #3d0e0d 55%, #1a0500 100%);
      padding: 60px 0 54px; position: relative; overflow: hidden; text-align: center;
    }
    .page-hero::before {
      content:''; position:absolute; inset:0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fb5755' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E");
    }
    .hero-glow  { position:absolute; width:440px; height:440px; background:radial-gradient(circle,rgba(251,87,85,.26) 0%,transparent 70%); top:-160px; right:-60px; pointer-events:none; }
    .hero-glow-l{ position:absolute; width:300px; height:300px; background:radial-gradient(circle,rgba(251,87,85,.15) 0%,transparent 70%); bottom:-120px; left:-60px; pointer-events:none; }
    .page-hero-inner { position: relative; }
    .page-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(255,232,218,.12); border: 1px solid rgba(255,232,218,.3);
      color: var(--secondary); font-size: 13px; font-weight: 800;
      padding: 6px 16px; border-radius: 50px; margin-bottom: 18px;
    }
    .page-hero h1 { font-size: clamp(32px,5vw,56px); font-weight: 900; color: #fff; margin-bottom: 16px; }
    .page-hero h1 span { color: var(--primary); }
    .page-hero p  { color: rgba(255,255,255,.74); font-size: 17px; max-width: 580px; margin: 0 auto; line-height: 1.8; }

    /* ═══ SECTION HELPERS ═══ */
    section { padding: 68px 0; }
    .sec-label {
      display: inline-block; background: var(--secondary); color: var(--primary);
      font-size: 12px; font-weight: 800; padding: 5px 15px;
      border-radius: 50px; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px;
    }
    .divider        { width:56px; height:5px; background:linear-gradient(to right,var(--primary),var(--gold)); border-radius:3px; margin:14px 0 0; }
    .divider.center { margin:14px auto 0; }

    /* ═══ MAIN CONTACT LAYOUT ═══ */
    .contact-section { background: #fff; }
    .contact-layout  { display: grid; grid-template-columns: 1fr 380px; gap: 50px; align-items: start; }

    /* ── LEFT COLUMN ── */
    .contact-left h2 { font-size: clamp(22px,3vw,34px); font-weight: 900; color: var(--text-dark); margin-bottom: 14px; }
    .contact-left h2 span { color: var(--primary); }
    .contact-left > p { font-size: 15px; color: var(--text-mid); line-height: 1.88; margin-bottom: 30px; }

    /* big email card */
    .email-card {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: var(--radius);
      padding: 36px 38px;
      display: flex;
      align-items: center;
      gap: 24px;
      margin-bottom: 30px;
    }
    .ec-icon { font-size: 52px; flex-shrink: 0; filter: drop-shadow(0 4px 12px rgba(0,0,0,.2)); }
    .ec-body {}
    .ec-body h3 { font-size: 20px; font-weight: 900; color: #fff; margin-bottom: 6px; }
    .ec-body p  { font-size: 14px; color: rgba(255,255,255,.8); margin-bottom: 16px; line-height: 1.7; }
    .ec-link {
      display: inline-flex; align-items: center; gap: 10px;
      background: #fff; color: var(--primary);
      font-family: 'Baloo 2', cursive; font-weight: 900; font-size: 16px;
      padding: 12px 26px; border-radius: 50px;
      box-shadow: 0 6px 20px rgba(0,0,0,.18);
      transition: all .25s;
    }
    .ec-link:hover { background: var(--secondary); transform: translateY(-2px); }

    /* how we help list */
    .help-list { list-style: none; display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
    .help-list li {
      display: flex; align-items: flex-start; gap: 14px;
      background: var(--bg-light); border: 1.5px solid var(--border);
      border-radius: var(--radius-sm); padding: 16px 18px;
      transition: border-color .2s;
    }
    .help-list li:hover { border-color: var(--primary); }
    .hl-icon { font-size: 24px; flex-shrink: 0; margin-top: 1px; }
    .hl-text h4 { font-size: 15px; font-weight: 800; color: var(--text-dark); margin-bottom: 3px; }
    .hl-text p  { font-size: 13px; color: var(--text-light); line-height: 1.65; }

    /* ── RIGHT SIDEBAR ── */
    .contact-sidebar { display: flex; flex-direction: column; gap: 22px; }

    .sc { background: var(--bg-light); border: 1.5px solid var(--border); border-radius: var(--radius); padding: 26px; }
    .sc h3 { font-size: 17px; font-weight: 900; color: var(--text-dark); margin-bottom: 16px; display: flex; align-items: center; gap: 9px; }

    /* response time */
    .response-items { display: flex; flex-direction: column; gap: 12px; }
    .ri {
      display: flex; align-items: center; justify-content: space-between;
      background: #fff; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
      padding: 12px 16px;
    }
    .ri .rm { font-size: 13px; font-weight: 700; color: var(--text-mid); display: flex; align-items: center; gap: 8px; }
    .ri .rt { font-family: 'Baloo 2', cursive; font-size: 15px; font-weight: 900; color: var(--primary); }

    /* quick links */
    .ql-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
    .ql-list li a {
      display: flex; align-items: center; justify-content: space-between;
      font-size: 14px; font-weight: 700; color: var(--text-mid);
      padding: 10px 14px; border-radius: var(--radius-sm);
      background: #fff; border: 1.5px solid var(--border); transition: all .2s;
    }
    .ql-list li a:hover { border-color: var(--primary); color: var(--primary); background: var(--secondary); }
    .ql-arr { color: var(--primary); font-size: 16px; }

    /* cta sidebar */
    .sc-cta { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); border-color: transparent; }
    .sc-cta h3 { color: #fff; }
    .sc-cta p  { font-size: 13px; color: rgba(255,255,255,.8); margin-bottom: 18px; }
    .sc-cta .btn { width: 100%; margin-bottom: 10px; }
    .sc-cta .btn:last-child { margin-bottom: 0; }

    /* ═══ INTERLINK SECTION ═══ */
    .interlink-section { background: var(--bg-light); }
    .interlink-grid    { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
    .il-card {
      background: #fff; border: 1.5px solid var(--border); border-radius: var(--radius);
      padding: 26px 22px; transition: all .3s; display: flex; flex-direction: column; gap: 10px;
    }
    .il-card:hover { border-color: var(--primary); box-shadow: var(--shadow); transform: translateY(-4px); }
    .il-icon { font-size: 32px; }
    .il-card h3 { font-size: 16px; font-weight: 900; color: var(--text-dark); }
    .il-card p  { font-size: 13px; color: var(--text-light); line-height: 1.7; flex: 1; }
    .il-link    { display: inline-flex; align-items: center; gap: 6px; color: var(--primary); font-weight: 800; font-size: 13px; margin-top: 4px; transition: gap .2s; }
    .il-link:hover { gap: 10px; }

    /* ═══ CTA BANNER ═══ */
    .cta-section { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); padding: 66px 0; text-align: center; }
    .cta-section h2 { font-size: clamp(25px,4vw,40px); font-weight: 900; color: #fff; margin-bottom: 13px; }
    .cta-section p  { color: rgba(255,255,255,.82); font-size: 16px; margin-bottom: 28px; max-width: 560px; margin-left:auto; margin-right:auto; }
    .cta-btns { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }

      /* ═══ RESPONSIVE ═══ */
    @media (max-width: 980px) {
      .contact-layout  { grid-template-columns: 1fr; }
      .contact-sidebar { display: grid; grid-template-columns: 1fr 1fr; }
      .interlink-grid  { grid-template-columns: 1fr 1fr; }
      .footer-top      { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 640px) {
      nav { display: none; }
      .contact-sidebar { grid-template-columns: 1fr; }
      .interlink-grid  { grid-template-columns: 1fr; }
      .footer-top      { grid-template-columns: 1fr; }
      .cta-btns        { flex-direction: column; align-items: center; }
      .sticky-cta      { flex-direction: column; }
      .email-card      { flex-direction: column; text-align: center; }
    }

    /* dis */

     /* ═══ BREADCRUMB ═══ */
    .breadcrumb-bar { background: #fff; border-bottom: 1px solid var(--border); padding: 12px 0; }
    .breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; flex-wrap: wrap; }
    .breadcrumb a { color: var(--primary); transition: opacity .2s; }
    .breadcrumb a:hover { opacity: .75; }
    .breadcrumb .sep { color: var(--text-light); font-size: 12px; }
    .breadcrumb .current { color: var(--text-light); }

    /* ═══ PAGE HERO ═══ */
    .page-hero {
      background: linear-gradient(140deg, #1a0500 0%, #3d0e0d 55%, #1a0500 100%);
      padding: 60px 0 54px; position: relative; overflow: hidden;
    }
    .page-hero::before {
      content:''; position:absolute; inset:0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fb5755' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E");
    }
    .hero-glow   { position:absolute; width:440px; height:440px; background:radial-gradient(circle,rgba(251,87,85,.26) 0%,transparent 70%); top:-160px; right:-60px; pointer-events:none; }
    .hero-glow-l { position:absolute; width:300px; height:300px; background:radial-gradient(circle,rgba(251,87,85,.15) 0%,transparent 70%); bottom:-120px; left:-60px; pointer-events:none; }

    /* hero centred (no image) */
    .hero-two-col {
      position: relative;
      text-align: center;
    }
    .page-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(255,232,218,.12); border: 1px solid rgba(255,232,218,.3);
      color: var(--secondary); font-size: 13px; font-weight: 800;
      padding: 6px 16px; border-radius: 50px; margin-bottom: 18px;
    }
    .page-hero h1 { font-size: clamp(32px,5vw,54px); font-weight: 900; color: #fff; margin-bottom: 14px; }
    .page-hero h1 span { color: var(--primary); }
    .page-hero .hero-desc { color: rgba(255,255,255,.74); font-size: 16px; line-height: 1.8; max-width: 580px; margin: 0 auto 28px; }

    /* ═══ SECTION HELPERS ═══ */
    section { padding: 68px 0; }
    .sec-label {
      display: inline-block; background: var(--secondary); color: var(--primary);
      font-size: 12px; font-weight: 800; padding: 5px 15px;
      border-radius: 50px; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px;
    }
    .divider        { width:56px; height:5px; background:linear-gradient(to right,var(--primary),var(--gold)); border-radius:3px; margin:14px 0 0; }
    .divider.center { margin:14px auto 0; }

    /* ═══ MAIN LAYOUT ═══ */
    .disclaimer-section { background: #fff; }
    .disclaimer-layout  { display: grid; grid-template-columns: 1fr 340px; gap: 50px; align-items: start; }

    /* ── ARTICLE ── */
    .disclaimer-article {}

    /* section block */
    .disc-block {
      background: var(--bg-light);
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      padding: 32px 34px;
      margin-bottom: 24px;
      transition: border-color .25s;
    }
    .disc-block:hover { border-color: rgba(251,87,85,.35); }
    .disc-block:last-of-type { margin-bottom: 0; }

    .disc-block-head {
      display: flex; align-items: center; gap: 14px;
      margin-bottom: 16px;
      padding-bottom: 14px;
      border-bottom: 1.5px solid var(--border);
    }
    .db-icon {
      width: 46px; height: 46px; flex-shrink: 0;
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: 12px; display: flex; align-items: center; justify-content: center;
      font-size: 22px;
      box-shadow: 0 4px 14px rgba(251,87,85,.3);
    }
    .db-icon.light { background: var(--secondary); box-shadow: none; }
    .disc-block h2 { font-size: 20px; font-weight: 900; color: var(--text-dark); }
    .disc-block h2 span { color: var(--primary); }

    .disc-block p {
      font-size: 15px; color: var(--text-mid); line-height: 1.88; margin-bottom: 12px;
    }
    .disc-block p:last-child { margin-bottom: 0; }
    .disc-block p strong { color: var(--text-dark); }
    .disc-block p a {
      color: var(--primary); font-weight: 700;
      border-bottom: 1px solid rgba(251,87,85,.3); transition: border-color .2s;
    }
    .disc-block p a:hover { border-color: var(--primary); }

    /* highlight */
    .highlight-box {
      background: linear-gradient(135deg, var(--secondary), #fff8f4);
      border-left: 4px solid var(--primary);
      border-radius: var(--radius-sm);
      padding: 18px 20px;
      margin: 16px 0 0;
    }
    .highlight-box p { font-size: 14px; color: var(--text-mid); margin: 0; line-height: 1.8; }
    .highlight-box p strong { color: var(--primary); }

    /* contact callout */
    .contact-callout {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: var(--radius);
      padding: 28px 32px;
      display: flex; align-items: center; gap: 20px;
      margin-top: 28px;
    }
    .cc-icon { font-size: 38px; flex-shrink: 0; }
    .cc-text h4 { font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 5px; }
    .cc-text p  { font-size: 14px; color: rgba(255,255,255,.82); margin: 0; }
    .cc-text a  { color: var(--gold); font-weight: 800; }
    .cc-text a:hover { text-decoration: underline; }

    /* last updated */
    .last-updated {
      display: inline-flex; align-items: center; gap: 8px;
      background: var(--secondary); border-radius: 50px;
      padding: 7px 16px; font-size: 13px; font-weight: 700;
      color: var(--text-mid); margin-bottom: 24px;
    }

    /* ── SIDEBAR ── */
    .disc-sidebar { display: flex; flex-direction: column; gap: 22px; }

    .sc { background: var(--bg-light); border: 1.5px solid var(--border); border-radius: var(--radius); padding: 26px; }
    .sc h3 { font-size: 16px; font-weight: 900; color: var(--text-dark); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }

    /* table of contents */
    .toc-list { list-style: none; display: flex; flex-direction: column; gap: 6px; counter-reset: toc; }
    .toc-list li { counter-increment: toc; }
    .toc-list li a {
      display: flex; align-items: center; gap: 10px;
      font-size: 14px; font-weight: 700; color: var(--text-mid);
      padding: 9px 13px; border-radius: var(--radius-sm);
      background: #fff; border: 1.5px solid var(--border); transition: all .2s;
    }
    .toc-list li a::before {
      content: counter(toc, decimal-leading-zero);
      font-family: 'Baloo 2', cursive; font-weight: 900; font-size: 12px;
      color: var(--primary); min-width: 22px;
    }
    .toc-list li a:hover { border-color: var(--primary); color: var(--primary); background: var(--secondary); }

    /* quick links */
    .ql-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
    .ql-list li a {
      display: flex; align-items: center; justify-content: space-between;
      font-size: 14px; font-weight: 700; color: var(--text-mid);
      padding: 10px 14px; border-radius: var(--radius-sm);
      background: #fff; border: 1.5px solid var(--border); transition: all .2s;
    }
    .ql-list li a:hover { border-color: var(--primary); color: var(--primary); background: var(--secondary); }
    .ql-arr { color: var(--primary); font-size: 16px; }

    /* cta sidebar */
    .sc-cta { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); border-color: transparent; }
    .sc-cta h3 { color: #fff; }
    .sc-cta p  { font-size: 13px; color: rgba(255,255,255,.8); margin-bottom: 18px; }
    .sc-cta .btn { width: 100%; margin-bottom: 10px; }
    .sc-cta .btn:last-child { margin-bottom: 0; }

    /* contact card */
    .sc-contact { text-align: center; border-color: rgba(251,87,85,.3); }
    .sc-contact .email-pill {
      display: inline-flex; align-items: center; gap: 8px;
      background: var(--primary); color: #fff;
      font-family: 'Baloo 2', cursive; font-weight: 800; font-size: 15px;
      padding: 11px 20px; border-radius: 50px; margin-top: 14px;
      transition: all .25s;
    }
    .sc-contact .email-pill:hover { background: var(--primary-dark); transform: translateY(-2px); }

    /* ═══ INTERLINK SECTION ═══ */
    .interlink-section { background: var(--bg-light); }
    .interlink-grid    { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
    .il-card {
      background: #fff; border: 1.5px solid var(--border); border-radius: var(--radius);
      padding: 26px 22px; transition: all .3s; display: flex; flex-direction: column; gap: 10px;
    }
    .il-card:hover { border-color: var(--primary); box-shadow: var(--shadow); transform: translateY(-4px); }
    .il-icon { font-size: 32px; }
    .il-card h3 { font-size: 16px; font-weight: 900; color: var(--text-dark); }
    .il-card p  { font-size: 13px; color: var(--text-light); line-height: 1.7; flex: 1; }
    .il-link    { display:inline-flex; align-items:center; gap:6px; color:var(--primary); font-weight:800; font-size:13px; margin-top:4px; transition:gap .2s; }
    .il-link:hover { gap: 10px; }

    /* ═══ CTA BANNER ═══ */
    .cta-section { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); padding: 66px 0; text-align: center; }
    .cta-section h2 { font-size: clamp(25px,4vw,40px); font-weight: 900; color: #fff; margin-bottom: 13px; }
    .cta-section p  { color: rgba(255,255,255,.82); font-size: 16px; margin-bottom: 28px; max-width: 560px; margin-left:auto; margin-right:auto; }
    .cta-btns { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }

     /* ═══ RESPONSIVE ═══ */
    @media (max-width: 980px) {
      .disclaimer-layout  { grid-template-columns: 1fr; }
      .disc-sidebar       { display: grid; grid-template-columns: 1fr 1fr; }
      .interlink-grid     { grid-template-columns: 1fr 1fr; }
      .footer-top         { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 640px) {
      nav { display: none; }
      .disc-sidebar       { grid-template-columns: 1fr; }
      .interlink-grid     { grid-template-columns: 1fr; }
      .footer-top         { grid-template-columns: 1fr; }
      .cta-btns           { flex-direction: column; align-items: center; }
      .sticky-cta         { flex-direction: column; }
      .contact-callout    { flex-direction: column; text-align: center; }
      .disc-block         { padding: 24px 20px; }
    }

    
    /* ═══ BREADCRUMB ═══ */
    .breadcrumb-bar { background: #fff; border-bottom: 1px solid var(--border); padding: 12px 0; }
    .breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; flex-wrap: wrap; }
    .breadcrumb a { color: var(--primary); transition: opacity .2s; }
    .breadcrumb a:hover { opacity: .75; }
    .breadcrumb .sep { color: var(--text-light); font-size: 12px; }
    .breadcrumb .current { color: var(--text-light); }

    /* ═══ PAGE HERO ═══ */
    .page-hero {
      background: linear-gradient(140deg, #1a0500 0%, #3d0e0d 55%, #1a0500 100%);
      padding: 60px 0 54px; position: relative; overflow: hidden; text-align: center;
    }
    .page-hero::before {
      content:''; position:absolute; inset:0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fb5755' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E");
    }
    .hero-glow   { position:absolute; width:440px; height:440px; background:radial-gradient(circle,rgba(251,87,85,.26) 0%,transparent 70%); top:-160px; right:-60px; pointer-events:none; }
    .hero-glow-l { position:absolute; width:300px; height:300px; background:radial-gradient(circle,rgba(251,87,85,.15) 0%,transparent 70%); bottom:-120px; left:-60px; pointer-events:none; }
    .page-hero-inner { position: relative; }
    .page-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(255,232,218,.12); border: 1px solid rgba(255,232,218,.3);
      color: var(--secondary); font-size: 13px; font-weight: 800;
      padding: 6px 16px; border-radius: 50px; margin-bottom: 18px;
    }
    .page-hero h1 { font-size: clamp(32px,5vw,56px); font-weight: 900; color: #fff; margin-bottom: 16px; }
    .page-hero h1 span { color: var(--primary); }
    .page-hero p.hero-desc { color: rgba(255,255,255,.74); font-size: 17px; max-width: 600px; margin: 0 auto 28px; line-height: 1.8; }

    /* ═══ SECTION HELPERS ═══ */
    section { padding: 68px 0; }
    .sec-label {
      display: inline-block; background: var(--secondary); color: var(--primary);
      font-size: 12px; font-weight: 800; padding: 5px 15px;
      border-radius: 50px; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px;
    }
    .divider        { width:56px; height:5px; background:linear-gradient(to right,var(--primary),var(--gold)); border-radius:3px; margin:14px 0 0; }
    .divider.center { margin:14px auto 0; }

    /* ═══ MAIN LAYOUT ═══ */
    .rg-section { background: #fff; }
    .rg-layout  { display: grid; grid-template-columns: 1fr 340px; gap: 50px; align-items: start; }

    /* ── ARTICLE PROSE ── */
    .rg-article h2 {
      font-size: clamp(20px,2.6vw,30px); font-weight: 900; color: var(--text-dark);
      margin: 32px 0 12px;
    }
    .rg-article h2:first-child { margin-top: 0; }
    .rg-article h2 span { color: var(--primary); }
    .rg-article p {
      font-size: 15px; color: var(--text-mid); line-height: 1.88; margin-bottom: 14px;
    }
    .rg-article p strong { color: var(--text-dark); }
    .rg-article p a { color: var(--primary); font-weight: 700; border-bottom: 1px solid rgba(251,87,85,.3); transition: border-color .2s; }
    .rg-article p a:hover { border-color: var(--primary); }

    /* highlight strip */
    .hl-strip {
      background: linear-gradient(135deg, var(--secondary), #fff8f4);
      border-left: 4px solid var(--primary);
      border-radius: var(--radius-sm);
      padding: 18px 22px;
      margin: 16px 0;
    }
    .hl-strip p { font-size: 15px; color: var(--text-mid); margin: 0; line-height: 1.8; }
    .hl-strip p strong { color: var(--primary); }

    /* last-updated pill */
    .last-updated {
      display: inline-flex; align-items: center; gap: 8px;
      background: var(--secondary); border-radius: 50px;
      padding: 7px 16px; font-size: 13px; font-weight: 700;
      color: var(--text-mid); margin-bottom: 24px;
    }

    /* ── TIPS GRID (3 cards per row inside article) ── */
    .tips-grid {
      display: grid; grid-template-columns: repeat(3,1fr); gap: 16px;
      margin: 24px 0;
    }
    .tip-card {
      background: var(--bg-light); border: 1.5px solid var(--border);
      border-radius: var(--radius); padding: 22px 18px; text-align: center;
      transition: all .3s;
    }
    .tip-card:hover { border-color: var(--primary); box-shadow: var(--shadow); transform: translateY(-4px); }
    .tip-card .tc-icon { font-size: 34px; margin-bottom: 12px; display: block; }
    .tip-card h4 { font-size: 14px; font-weight: 900; color: var(--text-dark); margin-bottom: 7px; }
    .tip-card p  { font-size: 13px; color: var(--text-light); line-height: 1.65; }

    /* ── SIGNS CHECKLIST ── */
    .check-list { list-style: none; display: flex; flex-direction: column; gap: 10px; margin: 18px 0; }
    .check-list li {
      display: flex; align-items: flex-start; gap: 12px;
      background: var(--bg-light); border: 1.5px solid var(--border);
      border-radius: var(--radius-sm); padding: 13px 16px;
      font-size: 14px; color: var(--text-mid); font-weight: 600;
      transition: border-color .2s;
    }
    .check-list li:hover { border-color: var(--primary); }
    .check-list li .ci {
      width: 28px; height: 28px; flex-shrink: 0;
      border-radius: 50%; display: flex; align-items: center; justify-content: center;
      font-size: 14px; background: var(--secondary);
    }

    /* ── CONTACT CALLOUT ── */
    .contact-callout {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-radius: var(--radius); padding: 28px 32px;
      display: flex; align-items: center; gap: 20px; margin-top: 28px;
    }
    .cc-icon { font-size: 38px; flex-shrink: 0; }
    .cc-text h4 { font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 5px; }
    .cc-text p  { font-size: 14px; color: rgba(255,255,255,.82); margin: 0; }
    .cc-text a  { color: var(--gold); font-weight: 800; }
    .cc-text a:hover { text-decoration: underline; }

    /* ═══ COMMITMENTS SECTION ═══ */
    .commit-section { background: var(--bg-light); }
    .commit-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
    .commit-card {
      background: #fff; border: 1.5px solid var(--border); border-radius: var(--radius);
      padding: 30px 24px; text-align: center; transition: all .3s;
    }
    .commit-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: var(--primary); }
    .commit-icon { font-size: 40px; margin-bottom: 14px; display: block; }
    .commit-card h3 { font-size: 18px; font-weight: 900; color: var(--text-dark); margin-bottom: 10px; }
    .commit-card p  { font-size: 14px; color: var(--text-light); line-height: 1.75; }

    /* ═══ DARK REMINDER BANNER ═══ */
    .reminder-section {
      background: linear-gradient(140deg, #1a0500, #3d0e0d);
      padding: 60px 0; text-align: center;
    }
    .reminder-inner { max-width: 760px; margin: 0 auto; }
    .reminder-inner h2 { font-size: clamp(24px,3.5vw,38px); font-weight: 900; color: #fff; margin-bottom: 14px; }
    .reminder-inner h2 span { color: var(--primary); }
    .reminder-inner p  { color: rgba(255,255,255,.74); font-size: 16px; line-height: 1.82; margin-bottom: 28px; }
    .reminder-pills {
      display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-bottom: 32px;
    }
    .rpill {
      display: inline-flex; align-items: center; gap: 7px;
      background: rgba(255,232,218,.12); border: 1px solid rgba(255,232,218,.25);
      color: var(--secondary); font-size: 13px; font-weight: 800;
      padding: 8px 18px; border-radius: 50px;
    }

    /* ═══ SIDEBAR ═══ */
    .rg-sidebar { display: flex; flex-direction: column; gap: 22px; }
    .sc { background: var(--bg-light); border: 1.5px solid var(--border); border-radius: var(--radius); padding: 26px; }
    .sc h3 { font-size: 16px; font-weight: 900; color: var(--text-dark); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }

    /* ToC */
    .toc-list { list-style: none; display: flex; flex-direction: column; gap: 6px; counter-reset: toc; }
    .toc-list li { counter-increment: toc; }
    .toc-list li a {
      display: flex; align-items: center; gap: 10px;
      font-size: 14px; font-weight: 700; color: var(--text-mid);
      padding: 9px 13px; border-radius: var(--radius-sm);
      background: #fff; border: 1.5px solid var(--border); transition: all .2s;
    }
    .toc-list li a::before {
      content: counter(toc, decimal-leading-zero);
      font-family: 'Baloo 2', cursive; font-weight: 900; font-size: 12px;
      color: var(--primary); min-width: 22px;
    }
    .toc-list li a:hover { border-color: var(--primary); color: var(--primary); background: var(--secondary); }

    /* Quick links */
    .ql-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
    .ql-list li a {
      display: flex; align-items: center; justify-content: space-between;
      font-size: 14px; font-weight: 700; color: var(--text-mid);
      padding: 10px 14px; border-radius: var(--radius-sm);
      background: #fff; border: 1.5px solid var(--border); transition: all .2s;
    }
    .ql-list li a:hover { border-color: var(--primary); color: var(--primary); background: var(--secondary); }
    .ql-arr { color: var(--primary); font-size: 16px; }

    /* CTA sidebar */
    .sc-cta { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); border-color: transparent; }
    .sc-cta h3 { color: #fff; }
    .sc-cta p  { font-size: 13px; color: rgba(255,255,255,.8); margin-bottom: 18px; }
    .sc-cta .btn { width: 100%; margin-bottom: 10px; }
    .sc-cta .btn:last-child { margin-bottom: 0; }

    /* Contact card */
    .sc-contact { text-align: center; border-color: rgba(251,87,85,.3); }
    .email-pill {
      display: inline-flex; align-items: center; gap: 8px;
      background: var(--primary); color: #fff;
      font-family: 'Baloo 2', cursive; font-weight: 800; font-size: 14px;
      padding: 11px 20px; border-radius: 50px; margin-top: 14px; transition: all .25s;
    }
    .email-pill:hover { background: var(--primary-dark); transform: translateY(-2px); }

    /* ═══ INTERLINK SECTION ═══ */
    .interlink-section { background: var(--bg-light); }
    .interlink-grid    { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
    .il-card {
      background: #fff; border: 1.5px solid var(--border); border-radius: var(--radius);
      padding: 26px 22px; transition: all .3s; display: flex; flex-direction: column; gap: 10px;
    }
    .il-card:hover { border-color: var(--primary); box-shadow: var(--shadow); transform: translateY(-4px); }
    .il-icon { font-size: 32px; }
    .il-card h3 { font-size: 16px; font-weight: 900; color: var(--text-dark); }
    .il-card p  { font-size: 13px; color: var(--text-light); line-height: 1.7; flex: 1; }
    .il-link    { display:inline-flex; align-items:center; gap:6px; color:var(--primary); font-weight:800; font-size:13px; margin-top:4px; transition:gap .2s; }
    .il-link:hover { gap: 10px; }

    /* ═══ CTA BANNER ═══ */
    .cta-section { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); padding: 66px 0; text-align: center; }
    .cta-section h2 { font-size: clamp(25px,4vw,40px); font-weight: 900; color: #fff; margin-bottom: 13px; }
    .cta-section p  { color: rgba(255,255,255,.82); font-size: 16px; margin-bottom: 28px; max-width: 560px; margin-left:auto; margin-right:auto; }
    .cta-btns { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }


      @media (max-width: 980px) {
      .rg-layout       { grid-template-columns: 1fr; }
      .rg-sidebar      { display: grid; grid-template-columns: 1fr 1fr; }
      .tips-grid       { grid-template-columns: 1fr 1fr; }
      .commit-grid     { grid-template-columns: 1fr 1fr; }
      .interlink-grid  { grid-template-columns: 1fr 1fr; }
      .footer-top      { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 640px) {
      nav { display: none; }
      .rg-sidebar      { grid-template-columns: 1fr; }
      .tips-grid       { grid-template-columns: 1fr; }
      .commit-grid     { grid-template-columns: 1fr; }
      .interlink-grid  { grid-template-columns: 1fr; }
      .footer-top      { grid-template-columns: 1fr; }
      .cta-btns        { flex-direction: column; align-items: center; }
      .sticky-cta      { flex-direction: column; }
      .contact-callout { flex-direction: column; text-align: center; }
      .reminder-pills  { flex-direction: column; align-items: center; }
    
    }


    