/*
Theme Name:  CAiCOM Child
Description: CAiCOM brand child theme for Full Site Editing
Author:      CAiCOM Ltd
Author URI:  https://caicom.net
Template:    twentytwentyfour
Version:     2.0.0
License:     GNU General Public License v2 or later
Text Domain: caicom-child
*/

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap');

/* ── BRAND TOKENS ── */
:root {
  --cai-black:   #080808;
  --cai-near:    #0d0d0d;
  --cai-card:    #111118;
  --cai-pv:      #9B8FFF;
  --cai-pm:      #7F77DD;
  --cai-pd:      #2A1F7A;
  --cai-pa:      #534AB7;
  --cai-pl:      #D4CFFF;
  --cai-white:   #FFFFFF;
  --cai-off:     #E8E6FF;
  --cai-muted:   #666680;
  --cai-border:  rgba(155,143,255,0.14);
  --cai-border2: rgba(155,143,255,0.30);
}

/* ── GLOBAL RESET ── */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  background-color: var(--cai-black) !important;
  color: var(--cai-off) !important;
  font-family: 'DM Sans', -apple-system, sans-serif !important;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* ── HIDE DEFAULT SITE HEADER/FOOTER FROM PARENT THEME ──
   The CAiCOM homepage HTML includes its own nav and footer,
   so we suppress the FSE header/footer on the front page only */
.home .wp-block-template-part[data-slug="header"],
.page-template-home .wp-block-template-part[data-slug="header"],
.home .wp-block-template-part[data-slug="footer"],
.page-template-home .wp-block-template-part[data-slug="footer"] {
  display: none !important;
}

/* Also hide if using body class approach */
body.caicom-fullpage .wp-block-template-part {
  display: none !important;
}

/* ── REMOVE DEFAULT PAGE PADDING ── */
.wp-site-blocks { padding-top: 0 !important; padding-bottom: 0 !important; }
.entry-content, .wp-block-post-content { padding: 0 !important; margin: 0 !important; max-width: 100% !important; }
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: 100% !important;
}

/* ── CAICOM PAGE CONTENT ── */
/* All CAiCOM custom HTML lives inside .caicom-site */
.caicom-site {
  background: var(--cai-black);
  color: var(--cai-off);
  font-family: 'DM Sans', sans-serif;
  overflow-x: hidden;
}

/* ── NAV ── */
.cai-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 56px;
  transition: background 0.4s, backdrop-filter 0.4s;
}
.cai-nav.scrolled {
  background: rgba(8,8,8,0.94);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--cai-border);
}
.cai-nav-brand { display: flex; align-items: center; gap: 16px; text-decoration: none; }
.cai-nav-brand svg { width: 40px; height: 60px; overflow: visible; display: block; }
.cai-nav-wm {
  font-family: 'Syne', sans-serif; font-size: 22px; font-weight: 800;
  letter-spacing: 2px; color: #fff; white-space: nowrap;
}
/* Ai = both A and i in purple, italic */
.cai-nav-wm .cai-ai-highlight { color: var(--cai-pl); font-style: italic; letter-spacing: 0; }
.cai-nav-links { display: flex; align-items: center; gap: 32px; list-style: none; margin: 0; padding: 0; }
.cai-nav-links a {
  font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 2px;
  text-transform: uppercase; color: var(--cai-muted); text-decoration: none;
  transition: color 0.2s;
}
.cai-nav-links a:hover { color: var(--cai-pv); }
.cai-nav-cta {
  color: var(--cai-pv) !important; border: 1px solid rgba(155,143,255,0.35) !important;
  padding: 9px 22px; border-radius: 2px;
  transition: background 0.2s !important;
}
.cai-nav-cta:hover { background: rgba(155,143,255,0.1) !important; }

/* ── ANIMATIONS ── */
@keyframes cai-gridDrift  { 0%{transform:translateY(0)} 100%{transform:translateY(72px)} }
@keyframes cai-glowPulse  { 0%,100%{opacity:1} 50%{opacity:.6} }
@keyframes cai-iconFloat  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes cai-fadeUp     { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} }
@keyframes cai-tagPulse   { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.3;transform:scale(.7)} }
@keyframes cai-underline  { from{transform:scaleX(0)} to{transform:scaleX(1)} }
@keyframes cai-bounce     { 0%,100%{transform:rotate(45deg) translateY(0)} 50%{transform:rotate(45deg) translateY(5px)} }
@keyframes cai-iDot       { 0%,100%{opacity:1;transform:translateX(-50%) scale(1)} 50%{opacity:.3;transform:translateX(-50%) scale(.6)} }
@keyframes cai-iBreathe   { 0%,100%{text-shadow:0 0 60px rgba(155,143,255,.3)} 50%{text-shadow:0 0 100px rgba(155,143,255,.6)} }
@keyframes cai-hexPulse   { 0%,100%{opacity:.5} 50%{opacity:1} }
@keyframes cai-rotate     { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes cai-counter    { from{transform:rotate(0deg)} to{transform:rotate(-360deg)} }
@keyframes cai-vendor     { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── HERO ── */
.cai-hero {
  min-height: 100vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  position: relative; overflow-x: hidden; padding: 120px 56px 80px; text-align: center;
}
.cai-hero-grid {
  position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(155,143,255,.035) 1px,transparent 1px),
                    linear-gradient(90deg,rgba(155,143,255,.035) 1px,transparent 1px);
  background-size: 72px 72px;
  animation: cai-gridDrift 28s linear infinite;
}
.cai-glow-a { position:absolute;top:-15%;right:-5%;width:700px;height:700px;background:radial-gradient(circle,rgba(42,31,122,.35) 0%,transparent 65%);pointer-events:none;animation:cai-glowPulse 8s ease-in-out infinite; }
.cai-glow-b { position:absolute;bottom:-20%;left:5%;width:600px;height:600px;background:radial-gradient(circle,rgba(83,74,183,.2) 0%,transparent 65%);pointer-events:none;animation:cai-glowPulse 10s ease-in-out infinite 2s; }
.cai-hero-content { position:relative;z-index:2;max-width:1100px;width:100%;overflow:visible; }

.cai-tag {
  display:inline-flex;align-items:center;gap:10px;
  font-family:'DM Mono',monospace;font-size:11px;letter-spacing:3px;text-transform:uppercase;
  color:var(--cai-pv);border:1px solid rgba(155,143,255,.25);padding:7px 18px;border-radius:2px;
  margin-bottom:44px;animation:cai-fadeUp .7s .2s both;
}
.cai-tag-dot { width:6px;height:6px;border-radius:50%;background:var(--cai-pv);animation:cai-tagPulse 2s infinite; }

.cai-logo-display {
  display:flex;align-items:center;justify-content:center;gap:36px;
  margin-bottom:48px;flex-wrap:nowrap;animation:cai-fadeUp .8s .4s both;
}
.cai-logo-icon { flex-shrink:0;padding:14px;overflow:visible; }
.cai-logo-icon svg { width:76px;height:116px;overflow:visible;display:block;filter:drop-shadow(0 0 18px rgba(155,143,255,.5));animation:cai-iconFloat 6s ease-in-out infinite; }

.cai-wm-block { display:flex;flex-direction:column;align-items:flex-start;min-width:0; }
.cai-wm {
  font-family:'Syne',sans-serif;font-size:clamp(52px,8vw,108px);font-weight:800;
  letter-spacing:-1px;line-height:1;color:#fff;white-space:nowrap;display:block;
}
/* Ai wrapper — both A and i in purple */
.cai-wm-ai { color:var(--cai-pl); display:inline; }
/* i gets italic + animated underline */
.cai-wm .cai-wm-i { position:relative;display:inline-block;color:var(--cai-pl);font-style:italic; }
.cai-wm-i::after {
  content:'';position:absolute;bottom:-4px;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--cai-pv),var(--cai-pl));border-radius:2px;
  animation:cai-underline 1s 1.2s both;display:block;
}
.cai-wm-sub {
  font-family:'DM Mono',monospace;font-size:12px;letter-spacing:4px;
  text-transform:uppercase;color:rgba(155,143,255,.45);margin-top:10px;white-space:nowrap;
}

.cai-hero-hl {
  font-family:'Syne',sans-serif;font-size:clamp(32px,4.5vw,64px);font-weight:800;
  line-height:1.05;letter-spacing:-1.5px;color:#fff;margin-bottom:24px;
  animation:cai-fadeUp .8s .6s both;
}
.cai-hero-hl .acc { color:var(--cai-pv); }
.cai-hero-hl .dim { color:rgba(255,255,255,.28); }
.cai-hero-sub {
  font-size:clamp(15px,1.6vw,19px);font-weight:300;color:rgba(255,255,255,.45);
  line-height:1.75;max-width:640px;margin:0 auto 48px;
  animation:cai-fadeUp .8s .75s both;
}

.cai-actions { display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:72px;animation:cai-fadeUp .8s .9s both; }
.cai-btn-primary {
  font-family:'DM Mono',monospace;font-size:12px;font-weight:500;letter-spacing:2px;
  text-transform:uppercase;color:var(--cai-black);background:var(--cai-pv);
  border:none;padding:16px 36px;border-radius:2px;cursor:pointer;
  text-decoration:none;display:inline-block;transition:background .2s,transform .15s;
}
.cai-btn-primary:hover { background:var(--cai-pl);transform:translateY(-2px); }
.cai-btn-ghost {
  font-family:'DM Mono',monospace;font-size:12px;letter-spacing:2px;text-transform:uppercase;
  color:var(--cai-off);background:transparent;border:1px solid rgba(255,255,255,.18);
  padding:16px 36px;border-radius:2px;text-decoration:none;display:inline-block;
  transition:border-color .2s,color .2s;
}
.cai-btn-ghost:hover { border-color:var(--cai-pv);color:var(--cai-pv); }

.cai-stats {
  display:flex;width:100%;max-width:860px;margin:0 auto;
  border:1px solid var(--cai-border);border-radius:2px;overflow:hidden;
  animation:cai-fadeUp .8s 1.1s both;
}
.cai-stat { flex:1;padding:18px 12px;text-align:center;border-right:1px solid var(--cai-border);background:rgba(17,17,24,.85);min-width:0; }
.cai-stat:last-child { border-right:none; }
.cai-stat-n { font-family:'Syne',sans-serif;font-size:34px;font-weight:800;color:var(--cai-pv);line-height:1;display:block;margin-bottom:4px; }
.cai-stat-l { font-family:'DM Mono',monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--cai-muted); }

.cai-scroll-hint {
  position:absolute;bottom:32px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  font-family:'DM Mono',monospace;font-size:9px;letter-spacing:3px;text-transform:uppercase;
  color:rgba(155,143,255,.3);animation:cai-fadeUp .8s 1.5s both;
}
.cai-scroll-arrow {
  width:20px;height:20px;border-right:1px solid rgba(155,143,255,.3);
  border-bottom:1px solid rgba(155,143,255,.3);transform:rotate(45deg);
  animation:cai-bounce 2s ease-in-out infinite;
}

/* ── BRAND STORY ── */
.cai-nameplate-section {
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;padding:80px 56px;background:var(--cai-near);
}
.cai-nameplate {
  font-family:'Syne',sans-serif;font-size:clamp(56px,11vw,160px);font-weight:800;
  letter-spacing:-3px;line-height:1;margin-bottom:12px;white-space:nowrap;
}
.cai-nm-dim { color:rgba(255,255,255,.32); }
.cai-nm-i {
  color:var(--cai-pv);position:relative;display:inline-block;
}
.cai-nm-i::after {
  content:'';position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);
  width:8px;height:8px;background:var(--cai-pv);border-radius:50%;
  animation:cai-iDot 2s ease-in-out infinite;
}

/* Acronym rows */
.cai-acro {
  display:flex;border:1px solid var(--cai-border);overflow:hidden;
  transition:border-color .3s,background .3s;margin-bottom:2px;
}
.cai-acro:hover { border-color:var(--cai-border2);background:rgba(42,31,122,.08); }
.cai-acro-col {
  width:96px;min-width:96px;max-width:96px;
  display:flex;align-items:center;justify-content:center;
  background:var(--cai-card);border-right:1px solid var(--cai-border);
  overflow:hidden;padding:20px 8px;
}
.cai-acro-letter { font-family:'Syne',sans-serif;font-weight:800;line-height:1;color:rgba(155,143,255,.32); }
.cai-acro-letter.lg  { font-size:52px; }
.cai-acro-letter.sm  { font-size:28px;letter-spacing:-1px; }
.cai-acro-letter.i   { color:var(--cai-pv);font-style:italic; }
.cai-acro-i-row      { background:rgba(42,31,122,.18);border-color:rgba(155,143,255,.2); }
.cai-acro-detail     { padding:22px 28px; }
.cai-acro-word       { font-family:'Syne',sans-serif;font-size:18px;font-weight:700;color:#fff;margin-bottom:6px; }
.cai-acro-i-row .cai-acro-word  { color:var(--cai-pl); }
.cai-acro-desc       { font-size:14px;color:var(--cai-muted);line-height:1.55; }
.cai-acro-i-row .cai-acro-desc  { color:rgba(212,207,255,.5); }

/* Big i section */
.cai-big-i {
  font-family:'Syne',sans-serif;font-size:clamp(160px,25vw,300px);font-weight:800;
  line-height:.85;color:var(--cai-pv);display:block;margin-bottom:52px;
  animation:cai-iBreathe 4s ease-in-out infinite;
}

/* Philosophy pillars grid */
.cai-pillars { display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--cai-border);margin-top:56px; }
.cai-pillar {
  background:var(--cai-black);padding:48px 32px;transition:background .3s;
  position:relative;overflow:hidden;cursor:pointer;
}
.cai-pillar:hover { background:var(--cai-card); }
.cai-pillar::before {
  content:'';position:absolute;bottom:0;left:0;right:0;height:2px;
  background:var(--cai-pv);transform:scaleX(0);transform-origin:left;transition:transform .4s ease;
}
.cai-pillar:hover::before { transform:scaleX(1); }
.cai-pillar-letter { font-family:'Syne',sans-serif;font-weight:800;line-height:1;margin-bottom:20px; }
.cai-pillar-word   { font-family:'Syne',sans-serif;font-size:16px;font-weight:700;color:#fff;margin-bottom:12px; }
.cai-pillar-body   { font-size:13px;font-weight:300;color:rgba(255,255,255,.4);line-height:1.7; }

/* ── SERVICES GRID ── */
.cai-svc-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--cai-border);margin-top:56px; }
.cai-svc {
  background:var(--cai-black);padding:36px 28px;transition:background .3s;
  position:relative;overflow:hidden;
}
.cai-svc::before {
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--cai-pv);transform:scaleX(0);transform-origin:left;transition:transform .4s ease;
}
.cai-svc:hover { background:var(--cai-card); }
.cai-svc:hover::before { transform:scaleX(1); }
.cai-svc-title { font-family:'Syne',sans-serif;font-size:15px;font-weight:700;color:#fff;margin-bottom:10px; }
.cai-svc-body  { font-size:13px;font-weight:300;color:var(--cai-muted);line-height:1.7; }
.cai-svc-tag   { display:inline-block;margin-top:14px;font-family:'DM Mono',monospace;font-size:9px;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;border-radius:2px; }
.tag-core { color:var(--cai-pm);background:rgba(127,119,221,.12); }
.tag-ai   { color:#9FDDCC;background:rgba(29,158,117,.1); }
.tag-data { color:#FAC775;background:rgba(239,159,39,.1); }

/* ── VENDOR STRIP ── */
.cai-vendor-mask {
  overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,black 7%,black 93%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,black 7%,black 93%,transparent);
}
.cai-vendor-track { display:flex;animation:cai-vendor 30s linear infinite;width:max-content; }
.cai-vendor-track:hover { animation-play-state:paused; }
.cai-vendor-item  { display:flex;align-items:center;padding:0 48px;border-right:1px solid var(--cai-border);height:40px; }
.cai-vendor-name  { font-family:'Syne',sans-serif;font-size:14px;font-weight:700;color:rgba(255,255,255,.13);letter-spacing:2px;text-transform:uppercase;white-space:nowrap;transition:color .3s; }
.cai-vendor-item:hover .cai-vendor-name { color:rgba(155,143,255,.5); }

/* ── REVEAL ── */
.cai-reveal   { opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease; }
.cai-reveal.in{ opacity:1;transform:none; }
.cai-reveal-l { opacity:0;transform:translateX(-28px);transition:opacity .8s ease,transform .8s ease; }
.cai-reveal-l.in{ opacity:1;transform:none; }
.cai-reveal-r { opacity:0;transform:translateX(28px);transition:opacity .8s ease,transform .8s ease; }
.cai-reveal-r.in{ opacity:1;transform:none; }

/* ── SECTION UTILITIES ── */
.cai-eyebrow {
  font-family:'DM Mono',monospace;font-size:11px;letter-spacing:3px;
  text-transform:uppercase;color:var(--cai-pm);margin-bottom:14px;display:block;
}
.cai-section-title { font-family:'Syne',sans-serif;font-size:clamp(32px,4vw,52px);font-weight:800;line-height:1.1;letter-spacing:-1px;color:#fff;margin-bottom:18px; }
.cai-section-body  { font-size:17px;font-weight:300;color:rgba(255,255,255,.48);line-height:1.75; }
.cai-accent { color:var(--cai-pv); }
.cai-italic { font-style:italic; }

/* ── FOOTER ── */
.cai-footer { background:var(--cai-near);border-top:1px solid var(--cai-border);padding:60px 56px 40px; }
.cai-footer-top { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;margin-bottom:52px; }
.cai-footer-brand { font-family:'Syne',sans-serif;font-size:20px;font-weight:800;letter-spacing:3px;color:#fff;margin-bottom:12px; }
.cai-footer-brand .cai-i { color:var(--cai-pv);font-style:italic; }
.cai-footer-tag { font-family:'DM Mono',monospace;font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--cai-muted);margin-bottom:14px; }
.cai-footer-desc { font-size:13px;color:rgba(255,255,255,.3);line-height:1.7;max-width:260px; }
.cai-footer-col-title { font-family:'DM Mono',monospace;font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--cai-pm);margin-bottom:18px; }
.cai-footer-links { list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px; }
.cai-footer-links a { font-size:13px;color:rgba(255,255,255,.35);text-decoration:none;transition:color .2s; }
.cai-footer-links a:hover { color:var(--cai-pv); }
.cai-footer-bottom { border-top:1px solid var(--cai-border);padding-top:24px;display:flex;justify-content:space-between;align-items:center; }
.cai-footer-copy { font-family:'DM Mono',monospace;font-size:10px;letter-spacing:1px;color:rgba(255,255,255,.15); }

/* ── RESPONSIVE ── */
@media (max-width:1024px) {
  .cai-nav { padding:16px 32px; }
  .cai-hero { padding:100px 32px 60px; }
  .cai-svc-grid, .cai-pillars { grid-template-columns:repeat(2,1fr); }
  .cai-footer-top { grid-template-columns:1fr 1fr;gap:32px; }
}
@media (max-width:768px) {
  .cai-nav { padding:14px 20px; }
  .cai-nav-links { display:none; }
  .cai-hero { padding:100px 24px 60px; }
  .cai-svc-grid, .cai-pillars { grid-template-columns:1fr; }
  .cai-stats { flex-wrap:wrap; }
  .cai-stat { flex:0 0 50%; border-bottom:1px solid var(--cai-border); }
  .cai-footer-top { grid-template-columns:1fr; }
  .cai-logo-display { gap:20px; }
  .cai-logo-icon svg { width:52px;height:80px; }
}
