/* ═══════════════════════════════════════════════════════ INGLÉS 360 — MAIN CSS v5.0.0 Dark mode is DEFAULT. Always. Light mode via [data-theme="light"] on . Gradients kept everywhere they should be. ═══════════════════════════════════════════════════════ */ /* ── FONTS ──────────────────────────────────────────── */ @import url('https://fonts.googleapis.com/css2?family=Syne:wght@400..900&family=DM+Sans:ital,opsz,wght@0,9..40,300..700&display=swap'); /* ── TOKENS ─────────────────────────────────────────── */ :root { --i360-bg: #05060D; --i360-bg2: #0B0D1A; --i360-surface: rgba(255,255,255,.07); --i360-border: rgba(255,255,255,.11); --i360-text: #F8F9FF; --i360-muted: #C7CDEB; --i360-pink: #FF74B8; --i360-violet: #8B5CF6; --i360-blue: #49D2FF; --i360-cyan: #2BA3CC; /* THE GRADIENT — used everywhere */ --i360-grad: linear-gradient(90deg,#FF74B8,#8B5CF6,#49D2FF); --i360-grad-45: linear-gradient(135deg,#FF74B8,#8B5CF6,#49D2FF); --i360-grad-btn: linear-gradient(90deg,#FF74B8,#8B5CF6,#49D2FF); --i360-card-r: 22px; --i360-btn-r: 18px; --i360-pill: 999px; --i360-t: .18s ease; --i360-blur: blur(20px); --i360-hdr-bg: rgba(5,6,13,.90); --i360-hdr-h: 64px; --i360-pad: clamp(18px,5vw,52px); --i360-content: 820px; --i360-wide: 1360px; } /* ── RESET ───────────────────────────────────────────── */ *,*::before,*::after { box-sizing:border-box; } html { scroll-behavior:smooth; scroll-padding-top:calc(var(--i360-hdr-h) + 16px); -webkit-text-size-adjust:100%; } /* DARK MODE IS THE DEFAULT — always */ body { margin:0; background-color:var(--i360-bg); background-image: radial-gradient(54vw 44vh at 6% 10%, rgba(255,116,184,.22), transparent 62%), radial-gradient(56vw 48vh at 84% 12%, rgba(139,92,246,.26), transparent 60%), radial-gradient(48vw 42vh at 80% 78%, rgba(73,210,255,.18), transparent 60%), linear-gradient(180deg,#05060D,#0B0D1A 60%,#060711); color:var(--i360-text); font-family:'DM Sans',system-ui,sans-serif; font-size:17px; line-height:1.7; min-height:100vh; -webkit-tap-highlight-color:transparent; overflow-x:hidden; } img,video { max-width:100%; height:auto; display:block; } a { color:var(--i360-pink); text-decoration:none; transition:color var(--i360-t); } a:hover { color:var(--i360-blue); } a:focus-visible { outline:2px solid var(--i360-violet); outline-offset:3px; border-radius:4px; } h1,h2,h3,h4,h5,h6 { font-family:'Syne',system-ui,sans-serif; color:var(--i360-text); margin:0 0 .5em; line-height:1.1; } /* ── GRADIENT TEXT UTILITY — THE KEY ONE ────────────── */ /* Use .i360-grad on any span inside a heading or paragraph */ .i360-grad, span.i360-grad, .has-i360-grad-color { background:var(--i360-grad) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; display:inline; } /* Gradient text on headings that use the class directly */ h1.i360-grad-title, h2.i360-grad-title, h3.i360-grad-title { background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; } /* ── PAGE TITLE (inner pages) — gradient treatment ── */ .i360-page-title, .wp-block-post-title.i360-page-title { font-family:'Syne',system-ui,sans-serif !important; font-weight:900 !important; padding:clamp(40px,6vw,72px) var(--i360-pad) clamp(24px,3vw,40px); margin:0; background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; border-bottom:1px solid var(--i360-border); display:block; } /* ── EYEBROW ─────────────────────────────────────────── */ .i360-eyebrow { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.18em; color:var(--i360-muted); margin:0 0 12px; display:block; } /* ── LEAD TEXT ───────────────────────────────────────── */ .i360-lead { font-size:clamp(17px,1.9vw,21px); line-height:1.72; color:var(--i360-muted); max-width:800px; } /* ── HEADER ──────────────────────────────────────────── */ .i360-header { position:sticky !important; top:0 !important; z-index:200 !important; height:var(--i360-hdr-h); background:var(--i360-hdr-bg) !important; backdrop-filter:var(--i360-blur); -webkit-backdrop-filter:var(--i360-blur); border-bottom:1px solid var(--i360-border); display:flex !important; align-items:center !important; margin-block:0 !important; overflow:visible !important; } .i360-header .wp-block-group { margin-block:0 !important; } .i360-header__inner { width:100%; max-width:var(--i360-wide); margin-inline:auto; padding-inline:var(--i360-pad); display:flex !important; align-items:center !important; justify-content:space-between !important; height:100%; gap:16px; } /* ── LOGO ────────────────────────────────────────────── */ .i360-logo-wrap { display:flex !important; align-items:center !important; gap:10px !important; text-decoration:none !important; flex-shrink:0; } .i360-logo-img img { width:44px !important; height:44px !important; object-fit:contain !important; flex-shrink:0; } .i360-logo-img figure { margin:0 !important; } /* Logo text — always gradient */ .i360-logo, .i360-logo a, .wp-block-site-title.i360-logo, .wp-block-site-title.i360-logo a { font-family:'Syne',system-ui,sans-serif !important; font-size:clamp(20px,2.6vw,26px) !important; font-weight:900 !important; letter-spacing:-.02em !important; background:var(--i360-grad) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; text-decoration:none !important; line-height:1 !important; white-space:nowrap; } /* ── NAVIGATION ──────────────────────────────────────── */ .i360-header__right { display:flex !important; align-items:center !important; gap:6px !important; flex-shrink:0; } .i360-nav .wp-block-navigation__container { display:flex; align-items:center; gap:2px; list-style:none; margin:0; padding:0; } .i360-nav .wp-block-navigation-item__content, .i360-nav a { font-family:'DM Sans',system-ui,sans-serif; font-size:14px; font-weight:600; color:var(--i360-muted) !important; -webkit-text-fill-color:var(--i360-muted) !important; padding:7px 12px; border-radius:var(--i360-pill); transition:all var(--i360-t); text-decoration:none; white-space:nowrap; display:block; } .i360-nav .wp-block-navigation-item__content:hover, .i360-nav a:hover, .i360-nav .current-menu-item > .wp-block-navigation-item__content { color:var(--i360-text) !important; -webkit-text-fill-color:var(--i360-text) !important; background:rgba(255,255,255,.08); } /* Mobile nav overlay */ .i360-nav .wp-block-navigation__responsive-container.is-menu-open { background:var(--i360-hdr-bg); backdrop-filter:var(--i360-blur); -webkit-backdrop-filter:var(--i360-blur); padding:var(--i360-pad); } .i360-nav .wp-block-navigation__responsive-container-close svg, .i360-nav .wp-block-navigation__responsive-container-open svg { color:var(--i360-text); } /* ── THEME TOGGLE ────────────────────────────────────── */ .i360-theme-toggle { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; flex-shrink:0; border-radius:var(--i360-pill); border:1px solid var(--i360-border); background:rgba(255,255,255,.05); color:var(--i360-text); cursor:pointer; transition:background var(--i360-t); -webkit-appearance:none; appearance:none; position:relative; z-index:10; } .i360-theme-toggle:hover { background:rgba(255,255,255,.12); } .i360-theme-toggle:focus-visible { outline:2px solid var(--i360-violet); outline-offset:3px; } /* ── BUTTONS ─────────────────────────────────────────── */ /* Primary — gradient bg, white text, always */ .wp-block-button.i360-btn-primary .wp-block-button__link, .i360-btn-primary .wp-block-button__link { background:var(--i360-grad-btn) !important; color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF !important; font-family:'Syne',system-ui,sans-serif; font-weight:800; font-size:15px; padding:14px 26px; border-radius:var(--i360-btn-r); border:none !important; box-shadow:0 8px 28px rgba(139,92,246,.28); text-decoration:none; display:inline-flex; align-items:center; justify-content:center; transition:box-shadow var(--i360-t), transform var(--i360-t); cursor:pointer; white-space:nowrap; } .wp-block-button.i360-btn-primary .wp-block-button__link:hover { box-shadow:0 14px 40px rgba(139,92,246,.44); transform:translateY(-1px); color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF !important; } /* Ghost — border, white text */ .wp-block-button.i360-btn-ghost .wp-block-button__link, .i360-btn-ghost .wp-block-button__link { background:rgba(255,255,255,.06) !important; color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF !important; border:1px solid var(--i360-border) !important; font-family:'Syne',system-ui,sans-serif; font-weight:700; font-size:15px; padding:13px 24px; border-radius:var(--i360-btn-r); text-decoration:none; display:inline-flex; align-items:center; justify-content:center; transition:all var(--i360-t); cursor:pointer; white-space:nowrap; } .wp-block-button.i360-btn-ghost .wp-block-button__link:hover { background:rgba(255,255,255,.12) !important; border-color:rgba(255,255,255,.26) !important; } /* Button row — proper spacing, no stacking/merging */ .wp-block-buttons { display:flex !important; flex-wrap:wrap !important; gap:12px !important; align-items:center; margin-top:0; } /* ── CARDS ───────────────────────────────────────────── */ .i360-card, .wp-block-column.i360-card { background: linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04)), radial-gradient(500px 140px at 0% 0%, rgba(255,116,184,.08),transparent 60%), radial-gradient(500px 140px at 100% 0%,rgba(73,210,255,.06),transparent 60%); border:1px solid var(--i360-border); border-radius:var(--i360-card-r); padding:22px; box-shadow:0 12px 36px rgba(0,0,0,.28); transition:box-shadow var(--i360-t), border-color var(--i360-t), transform var(--i360-t); } .i360-card:hover { box-shadow:0 20px 52px rgba(0,0,0,.40); border-color:rgba(255,255,255,.20); transform:translateY(-2px); } /* Card text — always readable */ .i360-card h1,.i360-card h2,.i360-card h3, .i360-card h4,.i360-card h5,.i360-card h6 { color:var(--i360-text) !important; -webkit-text-fill-color:var(--i360-text) !important; } /* But gradient spans inside card headings still work */ .i360-card h1 .i360-grad, .i360-card h2 .i360-grad, .i360-card h3 .i360-grad { background:var(--i360-grad) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; } .i360-card p, .wp-block-column.i360-card p { color:var(--i360-muted) !important; } /* Accent card — gradient fill, DARK text */ .i360-card--accent, .wp-block-column.i360-card--accent { background:var(--i360-grad-45) !important; border-color:transparent !important; } .i360-card--accent h1,.i360-card--accent h2,.i360-card--accent h3, .i360-card--accent h4,.i360-card--accent p,.i360-card--accent span { color:#07101E !important; -webkit-text-fill-color:#07101E !important; } .i360-card--accent .wp-block-button.i360-btn-ghost .wp-block-button__link { color:#07101E !important; -webkit-text-fill-color:#07101E !important; border-color:rgba(0,0,0,.20) !important; background:rgba(0,0,0,.10) !important; } /* Glow border card */ .i360-card--glow { border:1px solid transparent !important; background: linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.06)) padding-box, var(--i360-grad) border-box !important; } /* ── STATS ───────────────────────────────────────────── */ .i360-stat-row.wp-block-columns { gap:14px !important; } .i360-stat, .wp-block-column.i360-stat { background:rgba(255,255,255,.06); border:1px solid var(--i360-border); border-radius:var(--i360-card-r); padding:24px; } /* Stat number — always gradient */ .i360-stat__n { font-family:'Syne',system-ui,sans-serif; font-size:clamp(36px,5vw,52px); font-weight:900; line-height:1; background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; display:block; margin:0 0 8px; } .i360-stat__l { font-size:15px; color:var(--i360-muted); margin:0; display:block; } /* ── SECTIONS ────────────────────────────────────────── */ .i360-section { padding-block:clamp(56px,8vw,112px); } .i360-section--stats { padding-block:clamp(40px,6vw,72px); } /* Section headings with gradient partial */ .i360-section h2 .i360-grad, .i360-section h3 .i360-grad { background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; } /* ── HERO ────────────────────────────────────────────── */ .i360-hero { padding-block:clamp(80px,10vw,150px); } .i360-hero h1 .i360-grad { background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; } /* ── CTA SECTION ─────────────────────────────────────── */ .i360-cta-section { padding-block:clamp(64px,9vw,120px); text-align:center; position:relative; } .i360-cta-section::before { content:''; position:absolute; inset:0; background:radial-gradient(60vw 60vh at 50% 50%,rgba(139,92,246,.12),transparent 70%); pointer-events:none; } .i360-cta-section h2 .i360-grad { background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; } /* ── CARD GRID ───────────────────────────────────────── */ .i360-card-row.wp-block-columns { gap:18px !important; } /* ── FOOTER ──────────────────────────────────────────── */ .i360-footer { border-top:1px solid var(--i360-border); padding-block:clamp(48px,6vw,80px) 36px; background:rgba(5,6,13,.88); } .i360-footer__grid { display:flex; flex-wrap:wrap; gap:clamp(24px,4vw,48px); justify-content:space-between; align-items:flex-start; margin-bottom:40px; } .i360-footer__brand { flex:0 0 260px; } .i360-footer__desc { color:var(--i360-muted); margin-top:10px; font-size:15px; } .i360-footer__col { flex:0 0 160px; } .i360-footer__col h6 { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.14em; color:var(--i360-muted); margin-bottom:14px; } .i360-footer__nav.wp-block-list { list-style:none !important; margin:0 !important; padding:0 !important; } .i360-footer__nav li { margin:0 !important; } .i360-footer__nav a,.i360-footer__nav li a { display:block; font-size:15px; color:var(--i360-muted) !important; padding:5px 0; transition:color var(--i360-t); } .i360-footer__nav a:hover { color:var(--i360-text) !important; } .i360-footer__bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; border-top:1px solid var(--i360-border); padding-top:20px; } .i360-footer__bottom p { margin:0; color:var(--i360-muted); font-size:13px; } .i360-footer__logo-img img { width:56px !important; height:56px !important; object-fit:contain !important; margin-bottom:8px; } .i360-footer__logo-img figure { margin:0 0 4px !important; } /* ── ACCESS GATE (shortcode fallback for public) ─────── */ .i360-access-gate { background:var(--i360-surface); border:1px solid var(--i360-border); border-radius:var(--i360-card-r); padding:clamp(40px,6vw,80px) var(--i360-pad); text-align:center; } .i360-access-gate p { font-size:17px; color:var(--i360-muted); margin:0; } .i360-access-gate a { color:var(--i360-pink); font-weight:700; } /* ── ZONE NOTICE (admin only) ────────────────────────── */ .i360-zone-notice { background:rgba(255,200,0,.07); border:1px dashed rgba(255,200,0,.28); border-radius:var(--i360-card-r); padding:20px; font-size:14px; color:var(--i360-muted); text-align:center; } /* ── 404 ─────────────────────────────────────────────── */ .i360-404 { padding-block:clamp(80px,12vw,160px); text-align:center; } .i360-404__num { font-family:'Syne',system-ui,sans-serif; font-size:clamp(80px,14vw,160px); font-weight:900; line-height:1; background:var(--i360-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; display:block; margin:0 0 16px; } /* ── POST CARDS ──────────────────────────────────────── */ .i360-post-card { background:var(--i360-surface); border:1px solid var(--i360-border); border-radius:var(--i360-card-r); overflow:hidden; transition:border-color var(--i360-t),box-shadow var(--i360-t); } .i360-post-card:hover { border-color:rgba(255,255,255,.22); box-shadow:0 12px 32px rgba(0,0,0,.32); } /* ── FORMS ───────────────────────────────────────────── */ input,textarea,select { background:rgba(255,255,255,.06); border:1px solid var(--i360-border); border-radius:14px; color:var(--i360-text); font:inherit; padding:12px 16px; width:100%; transition:border-color var(--i360-t); outline:none; } input:focus,textarea:focus,select:focus { border-color:var(--i360-violet); } input::placeholder,textarea::placeholder { color:var(--i360-muted); } /* ── SKIP LINK ───────────────────────────────────────── */ .skip-link { position:absolute; left:-999px; width:1px; height:1px; overflow:hidden; } .skip-link:focus { position:fixed; top:12px; left:12px; z-index:9999; width:auto; height:auto; padding:12px 20px; background:var(--i360-violet); color:#fff; border-radius:8px; font-weight:700; } /* ── WP BLOCK RESETS ─────────────────────────────────── */ .wp-block-group { margin-block:0 !important; } .wp-block-columns { gap:18px; } .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) { display:flex; align-items:center; } /* ── SCROLLBAR ───────────────────────────────────────── */ ::-webkit-scrollbar { width:8px; } ::-webkit-scrollbar-track { background:var(--i360-bg2); } ::-webkit-scrollbar-thumb { background:rgba(255,255,255,.16); border-radius:4px; } ::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,.28); } /* ═══════════════════════════════════════════════════════ PLUGIN CSS OVERRIDES — Dark theme compatibility Each plugin ships with light-mode hardcoded vars. These overrides make them match the dark theme. ═══════════════════════════════════════════════════════ */ /* ── COMMUNITY ───────────────────────────────────────── */ .com-wrapper { --com-surface: rgba(255,255,255,.07) !important; --com-surface-2: rgba(255,255,255,.04) !important; --com-border: rgba(255,255,255,.11) !important; --com-text: #F8F9FF !important; --com-muted: #C7CDEB !important; background:transparent !important; color:var(--i360-text) !important; } .com-card { background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04)) !important; border-color:rgba(255,255,255,.11) !important; color:var(--i360-text) !important; } .com-post-title { color:var(--i360-text) !important; } .com-nav-tab.is-active { color:var(--i360-pink) !important; border-bottom-color:var(--i360-pink) !important; } .com-zone-pill.is-active { background:var(--i360-violet) !important; border-color:var(--i360-violet) !important; } .com-chip.is-active { background:var(--i360-violet) !important; border-color:var(--i360-violet) !important; } .com-zone-badge { color:var(--i360-blue) !important; background:rgba(73,210,255,.10) !important; border-color:rgba(73,210,255,.20) !important; } /* ── EVENTS ──────────────────────────────────────────── */ .evt-wrapper { --evt-surface: rgba(255,255,255,.07) !important; --evt-surface-2: rgba(255,255,255,.04) !important; --evt-border: rgba(255,255,255,.11) !important; --evt-text: #F8F9FF !important; --evt-muted: #C7CDEB !important; background:transparent !important; color:var(--i360-text) !important; } .evt-card { background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04)) !important; border-color:rgba(255,255,255,.11) !important; color:var(--i360-text) !important; } .evt-card-title,.evt-card-title a { color:var(--i360-text) !important; } .evt-nav-tab.is-active { color:var(--i360-pink) !important; border-bottom-color:var(--i360-pink) !important; } .evt-type-badge { color:var(--i360-blue) !important; background:rgba(73,210,255,.10) !important; border-color:rgba(73,210,255,.20) !important; } .evt-xp-badge { background:rgba(255,209,102,.12) !important; color:#FFD166 !important; } .evt-suggestion-card { background:var(--i360-grad-45) !important; color:#fff !important; border:none !important; } .evt-meeting-box { background:rgba(255,255,255,.04) !important; border-color:rgba(255,255,255,.11) !important; } /* ── LIBRARY ─────────────────────────────────────────── */ .lib-wrapper { --lib-surface: rgba(255,255,255,.07) !important; --lib-surface-2: rgba(255,255,255,.04) !important; --lib-border: rgba(255,255,255,.11) !important; --lib-text: #F8F9FF !important; --lib-muted: #C7CDEB !important; --lib-primary: #49D2FF !important; background:transparent !important; color:var(--i360-text) !important; } .lib-card { background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04)) !important; border-color:rgba(255,255,255,.11) !important; color:var(--i360-text) !important; } .lib-card--cycle { background:var(--i360-grad-45) !important; border:none !important; color:#fff !important; } .lib-nav-tab.is-active { color:var(--i360-blue) !important; border-bottom-color:var(--i360-blue) !important; } .lib-material-card { background:rgba(255,255,255,.04) !important; border-color:rgba(255,255,255,.09) !important; } /* ── PROFILE LAB ─────────────────────────────────────── */ .pl-wrapper { --pl-surface: rgba(255,255,255,.07) !important; --pl-surface-2: rgba(255,255,255,.04) !important; --pl-border: rgba(255,255,255,.11) !important; --pl-text: #F8F9FF !important; --pl-muted: #C7CDEB !important; --pl-primary: #8B5CF6 !important; background:transparent !important; color:var(--i360-text) !important; } .pl-card { background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04)) !important; border-color:rgba(255,255,255,.11) !important; color:var(--i360-text) !important; } .pl-card--hero { background:var(--i360-grad-45) !important; border:none !important; color:#fff !important; } .pl-stat-card { background:rgba(255,255,255,.06) !important; border-color:rgba(255,255,255,.11) !important; } .pl-stat-number { color:var(--i360-pink) !important; } .pl-nav-tab.is-active { color:var(--i360-violet) !important; border-bottom-color:var(--i360-violet) !important; } .pl-badge--earned { border-color:var(--i360-violet) !important; } .pl-progress { background:rgba(255,255,255,.12) !important; } .pl-progress__bar { background:var(--i360-grad-btn) !important; } /* ── WEEKLY ENGINE ───────────────────────────────────── */ /* Already handled in plugin's own front.css dark overrides */ /* Extra safety overrides */ .iwe-shell { --iwe-text: #F8F9FF !important; --iwe-muted: #C7CDEB !important; --iwe-border: rgba(255,255,255,.11) !important; --iwe-bg: rgba(255,255,255,.06) !important; color:var(--i360-text) !important; background:transparent !important; } .iwe-btn-primary { background:var(--i360-grad-btn) !important; color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF !important; } /* ═══════════════════════════════════════════════════════ LIGHT MODE — data-theme="light" on ═══════════════════════════════════════════════════════ */ [data-theme="light"] { --i360-bg: #FFFFFF; --i360-bg2: #F4F7FF; --i360-surface: rgba(22,24,42,.05); --i360-border: rgba(22,24,42,.10); --i360-text: #14182A; --i360-muted: #57607F; --i360-hdr-bg: rgba(255,255,255,.92); } [data-theme="light"] body { background-color:#FFFFFF; background-image: radial-gradient(54vw 44vh at 6% 10%, rgba(255,116,184,.09), transparent 62%), radial-gradient(56vw 48vh at 84% 12%, rgba(139,92,246,.11), transparent 60%), radial-gradient(48vw 42vh at 80% 78%, rgba(26,127,160,.07), transparent 60%), linear-gradient(180deg,#FFFFFF,#F4F7FF 64%,#EEF2FF); color:#14182A; } /* Gradient text stays vivid in light mode — no override needed */ [data-theme="light"] .i360-card, [data-theme="light"] .wp-block-column.i360-card { background:rgba(255,255,255,.92) !important; border-color:rgba(22,24,42,.12) !important; box-shadow:0 2px 16px rgba(22,24,42,.08) !important; } [data-theme="light"] .i360-card h1, [data-theme="light"] .i360-card h2, [data-theme="light"] .i360-card h3 { color:#14182A !important; -webkit-text-fill-color:#14182A !important; } [data-theme="light"] .i360-card p { color:#57607F !important; } [data-theme="light"] .i360-stat, [data-theme="light"] .wp-block-column.i360-stat { background:rgba(255,255,255,.90) !important; border-color:rgba(22,24,42,.12) !important; } [data-theme="light"] .i360-stat__l { color:#57607F !important; } [data-theme="light"] .wp-block-button.i360-btn-ghost .wp-block-button__link { background:rgba(22,24,42,.05) !important; color:#14182A !important; -webkit-text-fill-color:#14182A !important; border-color:rgba(22,24,42,.15) !important; } [data-theme="light"] .wp-block-button.i360-btn-ghost .wp-block-button__link:hover { background:rgba(22,24,42,.09) !important; } [data-theme="light"] .i360-footer { background:rgba(240,243,255,.94); border-top-color:rgba(22,24,42,.10); } [data-theme="light"] .i360-footer__bottom { border-top-color:rgba(22,24,42,.10); } [data-theme="light"] .i360-footer__desc, [data-theme="light"] .i360-footer__bottom p, [data-theme="light"] .i360-footer__nav a { color:#57607F !important; } [data-theme="light"] .i360-nav .wp-block-navigation-item__content, [data-theme="light"] .i360-nav a { color:#57607F !important; -webkit-text-fill-color:#57607F !important; } [data-theme="light"] .i360-nav .wp-block-navigation-item__content:hover, [data-theme="light"] .i360-nav a:hover { color:#14182A !important; -webkit-text-fill-color:#14182A !important; background:rgba(22,24,42,.06); } [data-theme="light"] input, [data-theme="light"] textarea, [data-theme="light"] select { background:rgba(22,24,42,.04); border-color:rgba(22,24,42,.12); color:#14182A; } /* Light mode plugin overrides */ [data-theme="light"] .com-wrapper { --com-text:#14182A !important; --com-muted:#57607F !important; --com-surface:#FFFFFF !important; --com-surface-2:#F4F7FF !important; --com-border:rgba(22,24,42,.10) !important; } [data-theme="light"] .evt-wrapper { --evt-text:#14182A !important; --evt-muted:#57607F !important; --evt-surface:#FFFFFF !important; --evt-surface-2:#FFFBEB !important; --evt-border:rgba(22,24,42,.10) !important; } [data-theme="light"] .lib-wrapper { --lib-text:#14182A !important; --lib-muted:#57607F !important; --lib-surface:#FFFFFF !important; --lib-surface-2:#F0F9FF !important; --lib-border:rgba(22,24,42,.10) !important; } [data-theme="light"] .pl-wrapper { --pl-text:#14182A !important; --pl-muted:#57607F !important; --pl-surface:#FFFFFF !important; --pl-surface-2:#F8FAFC !important; --pl-border:rgba(22,24,42,.10) !important; } /* ── RESPONSIVE ──────────────────────────────────────── */ @media (max-width:1100px) { .i360-footer__grid { gap:24px; } } @media (max-width:768px) { :root { --i360-hdr-h:60px; } .i360-card-row.wp-block-columns, .i360-stat-row.wp-block-columns { flex-direction:column !important; gap:12px !important; } .i360-footer__grid { flex-direction:column; gap:28px; } .i360-footer__brand,.i360-footer__col { flex:none; width:100%; } } @media (max-width:480px) { .i360-hero { padding-block:56px 40px; } .i360-section { padding-block:48px; } .wp-block-buttons { flex-direction:column !important; align-items:flex-start !important; } } body,.i360-header,.i360-main,.i360-footer { overflow-x:hidden; }