/* High-energy visual layer: all motion is local and disabled for reduced motion. */
:root { --electric: #e5ad45; --ink-rgb: 8, 31, 50; }

body.is-loading { overflow: hidden; }

html.is-booting body::before {
  content: "CIDO";
  position: fixed; inset: 0; z-index: 101;
  display: grid; place-items: center;
  color: #fff; background: linear-gradient(120deg, #0b2860 0%, #173c83 48%, #087963 100%);
  background-image: linear-gradient(rgba(255,255,255,.075) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.075) 1px, transparent 1px), linear-gradient(120deg, #0b2860 0%, #173c83 48%, #087963 100%);
  background-size: 10vw 10vw, 10vw 10vw, 100% 100%;
  font: 900 clamp(72px, 15vw, 210px)/.72 Arial, sans-serif;
  letter-spacing: -.04em;
}

.intro-loader {
  position: fixed; inset: 0; z-index: 100;
  display: grid; place-items: center; overflow: hidden;
  color: #fff; background: linear-gradient(120deg, #0b2860 0%, #173c83 48%, #087963 100%);
  transition: clip-path 900ms cubic-bezier(.76, 0, .24, 1), visibility 900ms;
}

.intro-loader::before,
.hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.075) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.075) 1px, transparent 1px);
  background-size: 10vw 10vw; mask-image: linear-gradient(105deg, #000, transparent 83%);
}

.intro-loader__mark { position: relative; z-index: 1; overflow: hidden; padding: .08em .08em .16em .04em; letter-spacing: -.04em; font: 900 clamp(72px, 15vw, 210px)/.72 Arial, sans-serif; }
.intro-loader__mark span { display: block; transform: translateY(115%); animation: loader-word 900ms cubic-bezier(.16, 1, .3, 1) 120ms forwards; }
.intro-loader__line { position: absolute; top: calc(50% + clamp(54px, 9vw, 132px)); left: 50%; width: min(300px, 68vw); height: 2px; overflow: hidden; background: rgba(255,255,255,.25); transform: translateX(-50%); }
.intro-loader__line::after { content: ""; display: block; width: 100%; height: 100%; background: var(--electric); transform: translateX(-102%); animation: loader-line 1.1s cubic-bezier(.76, 0, .24, 1) 260ms forwards; }
.intro-loader.is-leaving { clip-path: inset(0 0 100% 0); visibility: hidden; }

.scroll-progress { position: fixed; z-index: 50; top: 0; left: 0; height: 3px; width: var(--scroll-progress, 0%); background: var(--electric); box-shadow: 0 0 18px rgba(229,173,69,.8); transition: width 80ms linear; }
.hero { isolation: isolate; background-image: radial-gradient(circle at 77% 20%, rgba(38,117,127,.24), transparent 31%); }
.hero::after { z-index: -1; opacity: .42; animation: grid-drift 16s linear infinite; }
.hero-copy { transform: none; }
.hero-photo { transform: none; transition: box-shadow 500ms ease; }
.hero-photo::after { content: ""; position: absolute; inset: -40%; background: linear-gradient(115deg, transparent 42%, rgba(255,255,255,.18) 50%, transparent 57%); transform: translateX(-150%) rotate(9deg); animation: hero-glint 5.5s cubic-bezier(.22,.61,.36,1) 1.8s infinite; pointer-events: none; }
.hero-photo:hover { box-shadow: 0 24px 55px rgba(0,0,0,.28); }

.js .hero .eyebrow, .js .hero h1, .js .hero .hero-lead, .js .hero .hero-actions, .js .hero .hero-facts { filter: blur(7px); }
.js .hero.hero--animate .eyebrow, .js .hero.hero--animate h1, .js .hero.hero--animate .hero-lead, .js .hero.hero--animate .hero-actions, .js .hero.hero--animate .hero-facts { filter: blur(0); }

.js .reveal { opacity: 0; filter: blur(8px); transform: translate3d(0, 48px, 0) scale(.98); transition: opacity 300ms cubic-bezier(.16,1,.3,1) var(--reveal-delay, 0ms), transform 300ms cubic-bezier(.16,1,.3,1) var(--reveal-delay, 0ms), filter 220ms ease var(--reveal-delay, 0ms); }
.js .reveal.reveal--visible { opacity: 1; filter: blur(0); transform: translate3d(0,0,0) scale(1); }

.priority-card, .credentials-card, .statement-card, .photo-placeholder, .social-links a { will-change: transform; }
.priority-card h3 { margin-top: 34px; }
.priority-card::after { content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none; background: linear-gradient(135deg, rgba(229,173,69,.16), transparent 45%); transition: opacity 350ms ease; }
.priority-card { position: relative; overflow: hidden; }
.social-links a { position: relative; overflow: hidden; }
.social-links a::before { content: ""; position: absolute; inset: 0; z-index: -1; transform: scaleX(0); transform-origin: left; background: rgba(22,77,115,.08); transition: transform 360ms cubic-bezier(.16,1,.3,1); }

@media (hover: hover) and (pointer: fine) {
  .priority-card:hover { transform: translate3d(0,-12px,0) scale(1.015); box-shadow: 0 28px 55px rgba(var(--ink-rgb),.2); }
  .priority-card:hover::after { opacity: 1; }
  .credentials-card:hover, .statement-card:hover { transform: translate3d(0,-10px,0) scale(1.012); box-shadow: 0 25px 48px rgba(var(--ink-rgb),.18); }
  .photo-placeholder:hover > * { transform: scale(1.075); }
  .photo-placeholder:hover { border-color: var(--electric); }
  .social-links a:hover { transform: translate3d(12px,0,0); color: var(--blue); }
  .social-links a:hover::before { transform: scaleX(1); }
  .button:hover { transform: translate3d(0,-5px,0) scale(1.04); box-shadow: 0 17px 30px rgba(0,0,0,.26); }
  .text-link:hover { transform: translate3d(8px,0,0); color: var(--electric); }
  .nav-cta:hover { transform: translateY(-4px) scale(1.05); box-shadow: 0 13px 24px rgba(var(--ink-rgb),.25); }
}

.desktop-nav a { position: relative; }
.desktop-nav a:hover { transform: none; }
.desktop-nav a:not(.nav-cta)::after { content: ""; position: absolute; left: 0; bottom: -9px; width: 100%; height: 2px; background: var(--electric); transform: scaleX(0); transform-origin: right; transition: transform 280ms cubic-bezier(.16,1,.3,1); }
.desktop-nav a.is-active:not(.nav-cta)::after, .desktop-nav a:not(.nav-cta):hover::after { transform: scaleX(1); transform-origin: left; }

@keyframes loader-word { to { transform: translateY(0); } }
@keyframes loader-line { to { transform: translateX(0); } }
@keyframes grid-drift { to { background-position: 10vw 10vw; } }
@keyframes hero-glint { 0%, 57% { transform: translateX(-150%) rotate(9deg); } 72%, 100% { transform: translateX(150%) rotate(9deg); } }

@media (max-width: 600px) {
  #menu-mobile:target:not(.menu-is-closed) {
    position: fixed;
    z-index: 19;
    top: 72px;
    right: 0;
    left: 0;
    max-height: calc(100vh - 72px);
    overflow-y: auto;
    box-shadow: 0 18px 30px rgba(8, 31, 50, .18);
  }
  #menu-mobile.menu-is-closed { display: none !important; }
  .intro-loader::before, .hero::after { background-size: 21vw 21vw; }
  .scroll-progress { height: 2px; }
  .js .reveal { transform: translate3d(0, 34px, 0); }
  .social-links a:hover { transform: none; }
}
