/* =============================================
   Moring Slim — Subpages Stylesheet v2
   Professional design system for blog, legal, info
   ============================================= */

:root{
--primary:#E8467C;--primary-deep:#D13568;--primary-mid:#F06A96;--primary-light:#F5A0BB;--primary-pale:#FEF0F4;
--accent:#4DB892;--accent-dark:#237A5C;--accent-light:#6DCBA8;--accent-pale:#E6F6EF;
--gradient-cta:linear-gradient(135deg,#E8467C,#D13568);--gradient-brand:linear-gradient(135deg,#E8467C,#4DB892);--gradient-warm:linear-gradient(135deg,#FEF0F4,#E6F6EF);
--white:#fff;--off-white:#FEFCFD;--gray-50:#F9F7F8;--gray-100:#EEEAEC;--gray-200:#D9D3D6;--gray-300:#A8A0A4;--gray-400:#7A7378;
--text:#1F1D20;--text-mid:#4A464E;--text-light:#6B6570;
--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:28px;--radius-full:9999px;
--shadow-xs:0 1px 2px rgba(31,29,32,.04);--shadow-sm:0 2px 8px rgba(31,29,32,.06);--shadow-md:0 4px 20px rgba(31,29,32,.08);--shadow-lg:0 8px 40px rgba(31,29,32,.1);--shadow-xl:0 16px 60px rgba(31,29,32,.12);
--ease-out:cubic-bezier(.22,.61,.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;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:var(--text);line-height:1.75;font-size:16px;min-height:100vh;display:flex;flex-direction:column;background:var(--off-white)}
h1,h2,h3,h4,h5{font-family:'Outfit',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.25;letter-spacing:-.01em}
a{color:var(--primary);text-decoration:none;transition:color .2s}
a:hover{color:var(--primary-deep)}
img{max-width:100%;height:auto;display:block}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* =============================================
   HEADER
   ============================================= */
.page-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.06)}
.page-header .container{display:flex;align-items:center;justify-content:space-between;height:64px}
.page-header-logo{display:flex;align-items:center;gap:10px;font-family:'Outfit',sans-serif;font-weight:800;font-size:1.15rem;color:var(--primary-deep);text-decoration:none}
.page-header-logo:hover{text-decoration:none;color:var(--primary-deep)}
.page-header-logo img{width:auto;height:32px;object-fit:contain}
.page-header-nav{display:flex;align-items:center;gap:6px}
.page-header-nav a{font-size:.85rem;font-weight:600;color:var(--text-mid);text-decoration:none;padding:8px 14px;border-radius:var(--radius-sm);transition:all .2s}
.page-header-nav a:hover{color:var(--primary);background:var(--primary-pale);text-decoration:none}
.page-header-cta{background:var(--gradient-cta);color:var(--white)!important;padding:9px 22px;border-radius:var(--radius-full);font-weight:700;font-size:.82rem;border:none;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 12px rgba(232,70,124,.2)}
.page-header-cta:hover{transform:translateY(-1px);text-decoration:none;color:var(--white)!important;box-shadow:0 4px 20px rgba(232,70,124,.3)}
.page-hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.page-hamburger span{display:block;width:22px;height:2.5px;background:var(--text);border-radius:2px;transition:transform .3s,opacity .3s}

/* Mobile Nav Overlay (subpages) */
.mobile-nav-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#fff;z-index:1000;flex-direction:column;padding:0}
body.mobile-nav-open .mobile-nav-overlay{display:flex}
.mobile-nav-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--gray-100)}
.mobile-nav-logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--primary-deep);font-family:'Outfit',sans-serif;font-weight:800;font-size:1.1rem}
.mobile-nav-logo img{flex-shrink:0}
.mobile-nav-links{display:flex;flex-direction:column;align-items:center;gap:2px;padding:40px 20px 20px}
.mobile-nav-overlay a{font-size:1.1rem;font-weight:700;color:var(--text);padding:14px 24px;border-radius:var(--radius-md);text-align:center;text-decoration:none;transition:background .2s;width:100%;max-width:320px}
.mobile-nav-overlay a:hover{background:var(--primary-pale);text-decoration:none}
.mobile-nav-cta{display:flex;background:var(--gradient-cta);color:var(--white)!important;padding:16px 28px;border-radius:var(--radius-full);font-weight:700;font-size:1rem;border:none;cursor:pointer;margin:8px auto 0;justify-content:center;max-width:320px;width:100%;text-decoration:none!important}
.mobile-nav-close{background:none;border:none;font-size:1.6rem;cursor:pointer;color:var(--text-mid);width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}
.mobile-nav-close:hover{background:var(--gray-50)}

/* =============================================
   BREADCRUMB
   ============================================= */
.breadcrumb{padding:14px 0;background:var(--white);border-bottom:1px solid var(--gray-100)}
.breadcrumb-list{list-style:none;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.8rem}
.breadcrumb-list li{display:flex;align-items:center;gap:6px}
.breadcrumb-list li+li::before{content:'';width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23A8A0A4'%3E%3Cpath d='M6 3l5 5-5 5' stroke='%23A8A0A4' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;flex-shrink:0}
.breadcrumb-list a{color:var(--text-light);text-decoration:none;font-weight:500}
.breadcrumb-list a:hover{color:var(--primary)}
.breadcrumb-list .current{color:var(--text);font-weight:600}

/* =============================================
   PAGE CONTENT AREA
   ============================================= */
.page-content{flex:1;padding:48px 0 64px}
.page-content .container{max-width:780px}

/* =============================================
   ARTICLE / CONTENT TYPOGRAPHY
   ============================================= */
.content-body h1{font-size:2.2rem;font-weight:800;margin-bottom:12px;color:var(--text);letter-spacing:-.02em;line-height:1.2}
.content-body h2{font-size:1.4rem;font-weight:700;margin:40px 0 16px;color:var(--text);text-align:left;padding-bottom:10px;border-bottom:2px solid var(--gray-100);letter-spacing:-.01em}
.content-body h3{font-size:1.1rem;font-weight:700;margin:28px 0 10px;color:var(--text);padding-left:14px;border-left:3px solid var(--primary)}
.content-body p{margin-bottom:18px;color:var(--text-mid);line-height:1.8;font-size:.95rem}
.content-body ul,.content-body ol{margin:0 0 20px 0;padding-left:0;list-style:none;color:var(--text-mid)}
.content-body ul li,.content-body ol li{margin-bottom:10px;line-height:1.7;font-size:.95rem;padding-left:28px;position:relative}
.content-body ul li::before{content:'';position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:50%;background:var(--gradient-brand)}
.content-body ol{counter-reset:ol-counter}
.content-body ol li{counter-increment:ol-counter}
.content-body ol li::before{content:counter(ol-counter);position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--gradient-cta);color:var(--white);font-size:.7rem;font-weight:800;display:flex;align-items:center;justify-content:center;font-family:'Outfit',sans-serif}
.content-body strong{color:var(--text);font-weight:700}
.content-body em{color:var(--primary-deep);font-style:italic}
.content-body a{color:var(--primary);font-weight:600;text-decoration:underline;text-decoration-color:rgba(232,70,124,.3);text-underline-offset:3px;transition:text-decoration-color .2s}
.content-body a:hover{text-decoration-color:var(--primary)}

/* Blockquote */
.content-body blockquote{border:none;padding:24px 28px;margin:32px 0;background:linear-gradient(135deg,var(--primary-pale),rgba(232,70,124,.04));border-radius:var(--radius-xl);position:relative;font-style:italic;color:var(--text-mid);font-size:.95rem;line-height:1.8;border-left:4px solid var(--primary)}
.content-body blockquote::before{content:'\201C';position:absolute;top:-8px;left:16px;font-size:4rem;color:var(--primary-light);font-family:Georgia,serif;line-height:1;pointer-events:none}

/* Images */
.content-body img{border-radius:var(--radius-xl);margin:28px 0;box-shadow:var(--shadow-md)}

/* Tables */
.content-body table{width:100%;border-collapse:separate;border-spacing:0;margin:28px 0;font-size:.88rem;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--gray-100)}
.content-body thead{background:#D13568}
.content-body th{padding:14px 18px;color:#fff;font-weight:700;text-align:left;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;border:none}
.content-body td{padding:13px 18px;color:var(--text-mid);border-bottom:1px solid var(--gray-100);border:none;border-bottom:1px solid var(--gray-100)}
.content-body tbody tr{transition:background .15s}
.content-body tbody tr:hover{background:var(--primary-pale)}
.content-body tbody tr:last-child td{border-bottom:none}
.content-body tbody td:first-child{font-weight:600;color:var(--text)}

/* =============================================
   ARTICLE META
   ============================================= */
.article-meta{display:flex;align-items:center;gap:12px;margin-bottom:28px;padding:16px 20px;background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--gray-100);box-shadow:var(--shadow-xs);flex-wrap:wrap}
.article-meta-item{display:flex;align-items:center;gap:6px;font-size:.8rem;color:var(--text-light);font-weight:500}
.article-meta-item::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--gray-200)}
.article-meta-item:first-of-type::before{display:none}
.article-tag{display:inline-flex;padding:5px 14px;background:var(--gradient-cta);color:var(--white);border-radius:var(--radius-full);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;box-shadow:0 2px 8px rgba(232,70,124,.2)}

/* Article hero image */
.article-hero{width:100%;height:280px;object-fit:cover;border-radius:var(--radius-2xl);margin-bottom:32px;background:linear-gradient(135deg,var(--primary-pale) 0%,var(--accent-pale) 50%,var(--primary-pale) 100%);background-size:200% 200%;animation:heroGradient 6s ease infinite;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.article-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.03) 100%);border-radius:inherit}
@keyframes heroGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* =============================================
   CTA BOX IN CONTENT
   ============================================= */
.content-cta{background:var(--white);border-radius:var(--radius-2xl);padding:36px;margin:40px 0;text-align:center;border:2px solid var(--gray-100);position:relative;overflow:hidden;box-shadow:var(--shadow-md)}
.content-cta::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-brand)}
.content-cta img{margin:0 auto 16px;filter:drop-shadow(0 6px 16px rgba(0,0,0,.1))}
.content-cta h3{font-size:1.2rem;margin-bottom:8px;color:var(--primary-deep)}
.content-cta p{color:var(--text-mid);font-size:.9rem;margin-bottom:20px;max-width:400px;margin-left:auto;margin-right:auto}
.content-cta .btn-cta{display:inline-flex;align-items:center;gap:8px;padding:15px 36px;border-radius:var(--radius-full);font-family:'Outfit',sans-serif;font-weight:700;font-size:.95rem;border:none;cursor:pointer;background:var(--gradient-cta);color:var(--white);text-decoration:none;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 24px rgba(232,70,124,.25);animation:ctaPulse 2.5s ease-in-out infinite}
.content-cta .btn-cta:hover{transform:translateY(-2px);text-decoration:none;color:var(--white);box-shadow:0 6px 32px rgba(232,70,124,.35)}
@keyframes ctaPulse{0%,100%{box-shadow:0 4px 24px rgba(232,70,124,.25)}50%{box-shadow:0 4px 36px rgba(232,70,124,.4)}}

/* =============================================
   RELATED ARTICLES
   ============================================= */
.related-articles{margin-top:56px;padding-top:40px;border-top:2px solid var(--gray-100)}
.related-articles h2{font-size:1.25rem;margin-bottom:24px;text-align:left;border:none;padding:0}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.related-card{background:var(--white);border-radius:var(--radius-xl);border:1px solid var(--gray-100);overflow:hidden;transition:transform .3s var(--ease-out),box-shadow .3s;text-decoration:none;color:var(--text)}
.related-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);text-decoration:none;color:var(--text)}
.related-card-img{height:120px;background:linear-gradient(135deg,var(--primary-pale),var(--accent-pale));display:flex;align-items:center;justify-content:center;font-size:2.2rem;position:relative}
.related-card-body{padding:16px 18px}
.related-card-body h4{font-size:.88rem;margin-bottom:6px;line-height:1.35;font-weight:700}
.related-card-body p{font-size:.76rem;color:var(--text-light);line-height:1.55;margin:0}

/* =============================================
   BLOG INDEX
   ============================================= */
.blog-hero{background:linear-gradient(170deg,#FEF0F4 0%,#FFF5F7 30%,#F0F7F3 60%,#FEF0F4 100%);padding:56px 0 40px;text-align:center;position:relative;overflow:hidden}
.blog-hero::before{content:'';position:absolute;top:-60px;right:-60px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(232,70,124,.06),transparent 70%);pointer-events:none}
.blog-hero::after{content:'';position:absolute;bottom:-40px;left:-40px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(77,184,146,.06),transparent 70%);pointer-events:none}
.blog-hero h1{font-size:2.4rem;font-weight:800;margin-bottom:10px;letter-spacing:-.02em;background:var(--gradient-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.blog-hero p{color:var(--text-mid);font-size:1.05rem;max-width:560px;margin:0 auto;line-height:1.7}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding:48px 0 64px}
.blog-card{background:var(--white);border-radius:var(--radius-2xl);border:1px solid var(--gray-100);overflow:hidden;transition:transform .35s var(--ease-out),box-shadow .35s;text-decoration:none;color:var(--text);position:relative}
.blog-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-brand);transform:scaleX(0);transition:transform .35s var(--ease-out);transform-origin:left;z-index:2}
.blog-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl);text-decoration:none}
.blog-card:hover::before{transform:scaleX(1)}
.blog-card-img{height:200px;display:flex;align-items:center;justify-content:center;font-size:3.5rem;position:relative;overflow:hidden}
.blog-card-img.bg-moringa{background:linear-gradient(135deg,#E6F6EF 0%,#D1F0E0 100%)}
.blog-card-img.bg-tips{background:linear-gradient(135deg,#FEF0F4 0%,#FBDCE6 100%)}
.blog-card-img.bg-jojo{background:linear-gradient(135deg,#EDF4FB 0%,#D6E8F7 100%)}
.blog-card-img.bg-metab{background:linear-gradient(135deg,#FEF9E7 0%,#FDF0C8 100%)}
.blog-card-img.bg-review{background:linear-gradient(135deg,#FEF0F4 0%,#E6F6EF 100%)}
.blog-card-img.bg-detox{background:linear-gradient(135deg,#EDF4FB 0%,#E6F6EF 100%)}
.blog-card-tag{position:absolute;top:14px;left:14px;padding:5px 14px;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-radius:var(--radius-full);font-size:.68rem;font-weight:700;color:var(--primary-deep);text-transform:uppercase;letter-spacing:.04em;box-shadow:var(--shadow-xs)}
.blog-card-body{padding:22px 24px 20px}
.blog-card-body h3{font-size:1.05rem;font-weight:700;margin-bottom:10px;line-height:1.35;letter-spacing:-.01em}
.blog-card-body p{font-size:.86rem;color:var(--text-mid);line-height:1.65;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.blog-card-footer{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid var(--gray-100);font-size:.76rem;color:var(--text-light)}
.blog-card-read{color:var(--primary);font-weight:700;display:flex;align-items:center;gap:4px;transition:gap .2s}
.blog-card:hover .blog-card-read{gap:8px}

/* =============================================
   LEGAL PAGE STYLES
   ============================================= */
.legal-content h1{margin-bottom:4px}
.legal-date{font-size:.82rem;color:var(--text-light);margin-bottom:28px;display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:var(--gray-50);border-radius:var(--radius-full)}
.legal-content h2{border-bottom:none;margin-top:36px;padding-bottom:0;padding-left:0;border-left:none;color:var(--text);font-size:1.2rem}
.legal-content h2::before{content:'§';margin-right:10px;color:var(--primary);font-weight:400}

/* =============================================
   CONTACT PAGE
   ============================================= */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:16px}
.contact-item{display:flex;gap:16px;padding:22px;background:var(--white);border-radius:var(--radius-xl);border:1px solid var(--gray-100);transition:transform .2s,box-shadow .2s}
.contact-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.contact-item-icon{width:48px;height:48px;border-radius:var(--radius-md);background:var(--gradient-warm);display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0}
.contact-item h4{font-size:.92rem;margin-bottom:4px;color:var(--text)}
.contact-item p{font-size:.85rem;color:var(--text-mid);margin:0}
.contact-form{background:var(--white);padding:32px;border-radius:var(--radius-2xl);border:1px solid var(--gray-100);box-shadow:var(--shadow-md)}
.contact-form .form-group{margin-bottom:18px}
.contact-form label{display:block;font-size:.82rem;font-weight:700;margin-bottom:6px;color:var(--text)}
.contact-form input,.contact-form textarea{width:100%;padding:13px 16px;border:1.5px solid var(--gray-200);border-radius:var(--radius-md);font-size:.92rem;font-family:inherit;color:var(--text);background:var(--white);transition:border-color .2s,box-shadow .2s}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--primary-light);box-shadow:0 0 0 3px rgba(232,70,124,.1)}
.contact-form textarea{resize:vertical;min-height:130px}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--gray-300)}
.contact-form .btn-cta{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:var(--radius-md);font-family:'Outfit',sans-serif;font-weight:700;font-size:.95rem;border:none;cursor:pointer;background:var(--gradient-cta);color:var(--white);transition:transform .2s,box-shadow .2s;box-shadow:0 4px 16px rgba(232,70,124,.2)}
.contact-form .btn-cta:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(232,70,124,.3)}

/* =============================================
   ABOUT US PAGE EXTRAS
   ============================================= */
.about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:32px 0}
.about-stat{background:var(--white);border-radius:var(--radius-xl);padding:24px;text-align:center;border:1px solid var(--gray-100);box-shadow:var(--shadow-xs)}
.about-stat-value{font-family:'Outfit',sans-serif;font-size:2rem;font-weight:800;background:var(--gradient-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.about-stat-label{font-size:.82rem;color:var(--text-mid);margin-top:4px}

/* =============================================
   INFO BOXES (can be used in any article)
   ============================================= */
.info-box{padding:20px 24px;border-radius:var(--radius-xl);margin:24px 0;font-size:.9rem;line-height:1.7}
.info-box.tip{background:var(--accent-pale);border-left:4px solid var(--accent);color:var(--accent-dark)}
.info-box.warning{background:#FEF3C7;border-left:4px solid #D97706;color:#92400E}
.info-box.important{background:var(--primary-pale);border-left:4px solid var(--primary);color:var(--primary-deep)}
.info-box strong{display:block;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}

/* =============================================
   KEY POINTS / SUMMARY BOX
   ============================================= */
.key-points{background:var(--white);border:2px solid var(--gray-100);border-radius:var(--radius-2xl);padding:28px;margin:32px 0;box-shadow:var(--shadow-sm)}
.key-points h4{font-size:.9rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--primary);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.key-points h4::before{content:'';width:24px;height:24px;border-radius:50%;background:var(--gradient-cta);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.key-points ul{margin:0;padding:0;list-style:none}
.key-points li{padding:10px 0;border-bottom:1px solid var(--gray-100);font-size:.9rem;color:var(--text-mid);padding-left:28px;position:relative}
.key-points li::before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:800;font-size:.85rem}
.key-points li:last-child{border-bottom:none;padding-bottom:0}

/* =============================================
   STEPS / PROCESS BOX
   ============================================= */
.steps-box{margin:32px 0}
.step-item{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--gray-100);align-items:flex-start}
.step-item:last-child{border-bottom:none}
.step-num{width:40px;height:40px;border-radius:50%;background:var(--gradient-cta);color:var(--white);display:flex;align-items:center;justify-content:center;font-family:'Outfit',sans-serif;font-weight:800;font-size:.95rem;flex-shrink:0;box-shadow:0 4px 12px rgba(232,70,124,.2)}
.step-content h4{font-size:1rem;font-weight:700;margin-bottom:4px}
.step-content p{font-size:.88rem;color:var(--text-mid);margin:0;line-height:1.65}

/* =============================================
   FOOTER
   ============================================= */
.page-footer{background:linear-gradient(180deg,#1F1D20 0%,#2B2A2E 100%);color:rgba(255,255,255,.8);padding:52px 0 24px;margin-top:auto}
.page-footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px;margin-bottom:28px}
.page-footer h4{color:var(--white);font-size:.88rem;margin-bottom:16px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.page-footer p,.page-footer a{font-size:.82rem;color:rgba(255,255,255,.7);line-height:1.7}
.page-footer a:hover{color:var(--white);text-decoration:none}
.page-footer-brand .page-footer-logo{display:flex;align-items:center;gap:6px;margin-bottom:12px;text-decoration:none}
.page-footer-brand .page-footer-logo strong{font-family:'Outfit',sans-serif;font-size:1.1rem;color:var(--white)}
.page-footer-brand p{margin-bottom:8px}
.page-footer-brand .page-footer-hours{font-size:.78rem;color:rgba(255,255,255,.55);margin-top:8px}
.page-footer-links{list-style:none}
.page-footer-links li{margin-bottom:7px}
.page-footer-links a{display:inline-flex;padding:2px 0;transition:color .2s,transform .2s}
.page-footer-links a:hover{color:rgba(255,255,255,1);transform:translateX(3px)}
.page-footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:18px;text-align:center;font-size:.76rem;color:rgba(255,255,255,.5)}

/* =============================================
   RESPONSIVE — Tablet (max 1024px)
   ============================================= */
@media(max-width:1024px){
.blog-grid{grid-template-columns:repeat(2,1fr);gap:24px}
.about-stats{grid-template-columns:repeat(3,1fr)}
.page-footer-grid{grid-template-columns:repeat(2,1fr);gap:24px}
}

/* =============================================
   RESPONSIVE — Mobile (max 768px)
   ============================================= */
@media(max-width:768px){
/* Base */
.container{padding:0 16px}

/* Header — mobile: hide desktop nav, show hamburger */
.page-hamburger{display:flex}
.page-header .container{height:56px}
.page-header-logo{font-size:1.05rem}
.page-header-logo img{height:28px}
.page-header-nav{display:none}

/* Breadcrumb */
.breadcrumb{padding:10px 0}
.breadcrumb-list{font-size:.75rem;gap:4px}
.breadcrumb-list li+li::before{width:12px;height:12px}

/* Page content */
.page-content{padding:32px 0 44px}
.page-content .container{max-width:100%}

/* Article typography */
.content-body h1{font-size:1.55rem;line-height:1.25}
.content-body h2{font-size:1.15rem;margin-top:28px;padding-bottom:8px}
.content-body h3{font-size:1rem;margin-top:22px;padding-left:12px}
.content-body p{font-size:.9rem;margin-bottom:14px;line-height:1.7}
.content-body ul li,.content-body ol li{font-size:.88rem;padding-left:24px;margin-bottom:8px}
.content-body ul li::before{top:8px;width:6px;height:6px}
.content-body ol li::before{width:20px;height:20px;font-size:.65rem}
.content-body blockquote{padding:20px;margin:24px 0;font-size:.88rem}
.content-body blockquote::before{font-size:3rem;top:-4px;left:12px}

/* Tables — horizontal scroll on mobile */
.content-body table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;margin:20px -16px;width:calc(100% + 32px);border-radius:0}
.content-body th{padding:11px 14px;font-size:.75rem}
.content-body td{padding:10px 14px;font-size:.82rem}

/* Article meta */
.article-meta{padding:12px 16px;gap:8px;margin-bottom:20px}
.article-meta-item{font-size:.74rem}
.article-tag{font-size:.66rem;padding:4px 10px}

/* Article hero */
.article-hero{height:180px;margin-bottom:24px;border-radius:var(--radius-xl)}

/* CTA box */
.content-cta{padding:28px 20px;margin:28px 0;border-radius:var(--radius-xl)}
.content-cta img{width:90px!important;height:auto!important}
.content-cta h3{font-size:1.08rem}
.content-cta p{font-size:.85rem}
.content-cta .btn-cta{padding:14px 28px;font-size:.9rem;width:100%;justify-content:center}

/* Related articles */
.related-articles{margin-top:40px;padding-top:28px}
.related-articles h2{font-size:1.1rem;margin-bottom:16px;border:none;padding:0}
.related-grid{grid-template-columns:1fr;gap:14px}
.related-card{display:flex;flex-direction:row;align-items:center}
.related-card-img{height:auto;width:80px;min-height:80px;flex-shrink:0;font-size:1.6rem;border-radius:var(--radius-lg) 0 0 var(--radius-lg)}
.related-card-body{padding:14px 16px}
.related-card-body h4{font-size:.84rem;margin-bottom:4px}
.related-card-body p{font-size:.72rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Blog index */
.blog-hero{padding:36px 0 24px}
.blog-hero h1{font-size:1.6rem}
.blog-hero p{font-size:.9rem}
.blog-grid{grid-template-columns:1fr;gap:18px;padding:28px 0 40px}
.blog-card-img{height:160px;font-size:2.8rem}
.blog-card-tag{font-size:.64rem;padding:4px 10px;top:10px;left:10px}
.blog-card-body{padding:18px 20px 16px}
.blog-card-body h3{font-size:.98rem;margin-bottom:8px}
.blog-card-body p{font-size:.82rem;margin-bottom:12px;-webkit-line-clamp:2}
.blog-card-footer{padding-top:12px;font-size:.72rem}

/* Legal pages */
.legal-content h2{font-size:1.05rem}
.legal-date{font-size:.76rem;padding:5px 12px}

/* Contact */
.contact-grid{grid-template-columns:1fr;gap:24px}
.contact-item{padding:18px}
.contact-item-icon{width:42px;height:42px}
.contact-item h4{font-size:.88rem}
.contact-item p{font-size:.82rem}
.contact-form{padding:24px 20px}
.contact-form input,.contact-form textarea{font-size:.9rem;padding:12px 14px}
.contact-form label{font-size:.8rem}

/* About stats */
.about-stats{grid-template-columns:1fr 1fr 1fr;gap:10px}
.about-stat{padding:18px 12px}
.about-stat-value{font-size:1.6rem}
.about-stat-label{font-size:.74rem}

/* Info/Key/Steps boxes */
.info-box{padding:16px 18px;margin:18px 0;font-size:.85rem}
.key-points{padding:22px 18px;margin:24px 0}
.key-points h4{font-size:.82rem}
.key-points li{font-size:.85rem;padding-left:24px;padding:8px 0 8px 24px}
.step-item{gap:14px;padding:16px 0}
.step-num{width:36px;height:36px;font-size:.85rem}
.step-content h4{font-size:.92rem}
.step-content p{font-size:.84rem}

/* Footer */
.page-footer{padding:36px 0 20px}
.page-footer-grid{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.page-footer h4{font-size:.8rem;margin-bottom:10px}
.page-footer p,.page-footer a,.page-footer-links a{font-size:.78rem}
.page-footer-brand .page-footer-logo strong{font-size:.95rem}
.page-footer-brand .page-footer-hours{font-size:.72rem}
.page-footer-bottom{padding-top:14px;font-size:.7rem}
}

/* =============================================
   RESPONSIVE — Small phones (max 480px)
   ============================================= */
@media(max-width:480px){
.content-body h1{font-size:1.35rem}
.content-body h2{font-size:1.05rem}
.content-body p,.content-body li{font-size:.86rem}
.content-body blockquote{padding:16px;font-size:.84rem}

.blog-hero h1{font-size:1.35rem}
.blog-hero p{font-size:.84rem}
.blog-hero{padding:28px 0 20px}
.blog-card-img{height:140px;font-size:2.4rem}
.blog-card-body{padding:16px}
.blog-card-body h3{font-size:.92rem}
.blog-card-body p{font-size:.78rem}

.about-stats{grid-template-columns:1fr}
.about-stat{padding:16px;flex-direction:row;text-align:left;display:flex;align-items:center;gap:14px}
.about-stat-value{font-size:1.8rem;margin:0}
.about-stat-label{font-size:.78rem;margin:0}

.page-footer-grid{grid-template-columns:1fr}
.page-footer-grid>nav:last-child{display:none}

.article-hero{height:140px}
.article-meta{flex-direction:column;align-items:flex-start;gap:6px}

.content-cta{padding:22px 16px}
.content-cta img{width:72px!important}
.content-cta h3{font-size:1rem}

.contact-form{padding:20px 16px}

.related-card-img{width:64px;min-height:64px;font-size:1.3rem}
.related-card-body{padding:12px 14px}
.related-card-body h4{font-size:.8rem}
}