/* cleveland-style.css - Indigo + Green theme with gradients and preloader */
/* (content omitted in this message for brevity, full file created on disk) */
:root{--indigo:#283593;--green:#43a047;--bg:#f8f9fa;--text:#212121;--gradient: linear-gradient(90deg,var(--indigo),var(--green));}
*{box-sizing:border-box}html,body{height:100%;}body{font-family:Inter,Roboto,Arial,sans-serif;margin:0;color:var(--text);background:var(--bg);scroll-behavior:smooth;} .container{max-width:1100px;margin:0 auto;padding:24px;} /* preloader */ #preloader{position:fixed;inset:0;background:linear-gradient(135deg,rgba(40,53,147,0.95),rgba(67,160,71,0.95));display:flex;align-items:center;justify-content:center;z-index:9999;color:#fff;flex-direction:column} #preloader .logo{height:70px;margin-bottom:14px} #preloader .text{font-weight:700;letter-spacing:0.4px} #preloader.fade-out{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s ease} /* Header */ .site-header{position:fixed;top:0;left:0;right:0;background:var(--gradient);color:#fff;z-index:60;box-shadow:0 6px 24px rgba(0,0,0,0.12)} .header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;max-width:1200px;margin:0 auto} .brand{display:flex;align-items:center;gap:12px} .logo{height:46px} .brand-name{font-weight:700;color:#fff} .main-nav a{color:#fff;text-decoration:none;margin:0 10px;font-weight:600;opacity:0.95} .main-nav a:hover{opacity:1;text-decoration:underline} .menu-toggle{display:none;background:transparent;border:0;color:#fff;font-size:20px} /* Hero */ .hero{height:520px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-top:72px} .slider{position:absolute;inset:0;display:block} .slide{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(0.55);opacity:0;transition:opacity 1s ease;will-change:opacity} .slide.show{opacity:1} .hero-content{position:relative;z-index:40;text-align:center;color:#fff;padding:24px;max-width:900px} .hero h1{font-size:42px;margin:0 0 12px;text-shadow:0 8px 30px rgba(0,0,0,0.45)} .lead{font-size:18px;opacity:0.95} .btn{display:inline-block;margin-top:14px;padding:12px 20px;border-radius:10px;background:var(--gradient);color:#fff;font-weight:700;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease} .btn:hover{transform:translateY(-4px);box-shadow:0 10px 25px rgba(0,0,0,0.18)} /* Sections */ .section{padding:80px 0;background:transparent} .section.gradient{background: linear-gradient(180deg, rgba(40,53,147,0.06), rgba(67,160,71,0.03));} .section-title{color:var(--indigo);font-size:28px;margin-bottom:12px;text-align:center} .intro{max-width:820px;margin:0 auto 22px;color:#333;text-align:center;line-height:1.6} .two-col{display:flex;gap:24px;margin-top:24px} .col{flex:1;background:#fff;padding:22px;border-radius:12px;box-shadow:0 10px 30px rgba(5,30,80,0.06)} /* Therapeutic cards */ .thera-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:18px} .card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,0.06);display:flex;gap:12px;align-items:center;transition:transform .28s ease} .card:hover{transform:translateY(-8px);box-shadow:0 14px 30px rgba(0,0,0,0.12)} .card svg{width:54px;height:54px;flex-shrink:0} /* Values grid */ .values-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-top:20px} .value-card{background:rgba(255,255,255,0.98);padding:18px;border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,0.06);text-align:center;font-weight:700;cursor:pointer;transition:transform .28s ease} .value-card:hover{transform:translateY(-8px);box-shadow:0 14px 30px rgba(0,0,0,0.12)} /* value desc */ .value-desc{margin-top:20px;text-align:center;color:#1b263b;font-style:italic} /* reveal animation */ .reveal{opacity:0;transform:translateY(24px);transition:all .7s cubic-bezier(.2,.9,.3,1) 0s} .reveal.active{opacity:1;transform:none} /* CTA */ .cta-box{margin-top:30px;text-align:center} .cta-box .cta-btn{background:transparent;border:2px solid rgba(255,255,255,0.12);padding:12px 18px;border-radius:10px;color:#fff;text-decoration:none;font-weight:700} .cta-gradient{padding:40px 20px;border-radius:16px;background:var(--gradient);color:#fff;text-align:center;margin-top:30px} /* Footer */ .site-footer{background:linear-gradient(90deg,var(--indigo),var(--green));color:#fff;padding:28px 0;margin-top:40px} .footer-inner{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:0 24px} .footer-inner a{color:#fff;text-decoration:underline} /* responsive */ @media (max-width:900px){ .two-col{flex-direction:column} .hero{height:420px} .hero h1{font-size:28px} .main-nav{display:none} .menu-toggle{display:block} .header-inner{padding:10px 16px} .container{padding:14px} .values-grid{grid-template-columns:repeat(2,1fr)} } @media (max-width:480px){ .values-grid{grid-template-columns:repeat(1,1fr)} .hero h1{font-size:22px} }