/* DRPP visual system: diagrams, iconography and structural detail */
.hero .shell::after{display:none!important}
.hero{padding:92px 0 76px}
.hero::after{display:none}
.hero .shell.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);gap:clamp(40px,5vw,82px);align-items:center}
.hero-copy{position:relative;z-index:2;min-width:0}
.hero .kicker,.hero h1,.hero .body,.hero .actions{grid-column:auto}
.hero h1{max-width:760px;font-size:clamp(48px,5.8vw,84px)}
.hero .body{max-width:660px}

.system-visual{position:relative;z-index:1;width:100%;max-width:620px;justify-self:end;filter:drop-shadow(0 28px 52px rgba(0,0,0,.38))}
.system-visual-frame{position:relative;aspect-ratio:1.23/1;padding:12px;border:1px solid rgba(255,238,88,.58);background:linear-gradient(145deg,rgba(255,238,88,.08),rgba(6,20,38,.65) 46%,rgba(5,5,5,.94));box-shadow:12px 12px 0 rgba(255,238,88,.12),inset 0 0 0 1px rgba(255,255,255,.04);overflow:hidden}
.system-visual-frame::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,238,88,.16),transparent 28%),radial-gradient(circle at 73% 22%,rgba(255,238,88,.14),transparent 24%);pointer-events:none}
.system-visual svg{position:relative;display:block;width:100%;height:100%}
.system-visual-corner{position:absolute;width:38px;height:38px;border-color:var(--yellow);pointer-events:none}
.system-visual-corner-a{top:-7px;left:-7px;border-top:3px solid;border-left:3px solid}
.system-visual-corner-b{right:-7px;bottom:-7px;border-right:3px solid;border-bottom:3px solid}
.visual-link{fill:none;stroke:#FFEE58;stroke-width:3;stroke-opacity:.72;stroke-dasharray:8 8;animation:visual-dash 12s linear infinite}
.visual-road{fill:none;stroke:#FFEE58;stroke-width:18;stroke-linecap:square;stroke-linejoin:round;stroke-opacity:.86}
.visual-road-secondary{fill:none;stroke:#fff;stroke-width:4;stroke-dasharray:12 10;stroke-opacity:.38}
.visual-module,.visual-building,.visual-city,.visual-stage,.visual-node{transform-box:fill-box;transform-origin:center;transition:transform .25s ease,filter .25s ease}
.system-visual:hover .visual-module,.system-visual:hover .visual-building,.system-visual:hover .visual-city{filter:brightness(1.12)}
.system-visual:hover .visual-node-main{transform:scale(1.025)}
.visual-pulse{transform-box:fill-box;transform-origin:center;animation:visual-pulse 2.8s ease-in-out infinite}
.delay-1{animation-delay:.55s}
.delay-2{animation-delay:1.1s}

.visual-signal-strip{display:grid;grid-template-columns:1.2fr .75fr .5fr .75fr 1.2fr;height:8px;background:#fff}
.visual-signal-strip span:nth-child(odd){background:#061426}
.visual-signal-strip span:nth-child(2),.visual-signal-strip span:nth-child(4){background:#FFEE58}
.visual-signal-strip span:nth-child(3){background:#050505}

.visual-section{position:relative;overflow:hidden}
.visual-section>.shell{position:relative}
.visual-section::before{content:"";position:absolute;right:-110px;top:clamp(42px,7vw,100px);width:260px;height:260px;border:1px solid rgba(0,0,0,.08);transform:rotate(45deg);pointer-events:none}
.visual-section.dark::before{border-color:rgba(255,238,88,.11)}
.section-marker{display:flex;align-items:center;gap:12px;margin-bottom:24px;color:rgba(0,0,0,.28);font-size:11px;font-weight:900;letter-spacing:.12em}
.section-marker i{display:block;width:64px;height:2px;background:linear-gradient(90deg,var(--yellow),transparent)}
.dark .section-marker{color:rgba(255,255,255,.34)}

.split-aside{position:relative;overflow:hidden}
.split-aside::after{content:"";position:absolute;right:-38px;bottom:-38px;width:128px;height:128px;border:22px solid rgba(0,0,0,.08);transform:rotate(45deg)}
.split-aside-signal{display:flex;gap:6px;margin:0 0 24px}
.split-aside-signal span{width:22px;height:7px;background:#050505}
.split-aside-signal span:nth-child(2){width:42px;background:rgba(5,5,5,.38)}
.split-aside-signal span:nth-child(3){width:12px;background:#050505}
.dark .split-aside-signal span{background:#061426}
.split-aside li{position:relative;padding-left:30px}
.split-aside li::before{content:"";position:absolute;left:2px;top:15px;width:12px;height:7px;border-left:2px solid #050505;border-bottom:2px solid #050505;transform:rotate(-45deg)}

.visual-card-grid{position:relative;margin-top:38px}
.visual-card-grid::before{content:"";position:absolute;left:0;right:0;top:-19px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,238,88,.8),transparent)}
.visual-card{display:flex;flex-direction:column;padding-top:28px;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.visual-card:hover,.visual-card:focus-within{transform:translateY(-5px);border-color:rgba(5,5,5,.48);box-shadow:8px 8px 0 rgba(255,238,88,.7)}
.dark .visual-card:hover,.dark .visual-card:focus-within{border-color:var(--yellow)}
.visual-card h3{margin-top:24px;padding-right:40px}
.visual-card p{margin-bottom:18px}
.visual-card-arrow{position:absolute;right:24px;top:30px;color:#050505;font-size:21px;font-weight:800;transition:transform .2s ease}
.visual-card:hover .visual-card-arrow{transform:translate(3px,-3px)}

.visual-icon{position:relative;display:grid;place-items:center;width:72px;height:72px;border:1px solid rgba(5,5,5,.22);background:#061426;color:#fff;box-shadow:7px 7px 0 rgba(255,238,88,.72)}
.visual-icon::before{content:"";position:absolute;inset:8px;border:1px solid rgba(255,238,88,.22)}
.visual-icon svg{position:relative;z-index:1;width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.visual-icon-index{position:absolute;right:-8px;top:-9px;z-index:2;display:grid;place-items:center;min-width:27px;height:22px;padding:0 5px;background:#FFEE58;color:#050505;border:1px solid #050505;font-size:9px;font-weight:950;letter-spacing:.08em}
.visual-icon-mobility,.visual-icon-property,.visual-icon-ai{background:#061426}
.visual-icon-search,.visual-icon-automation,.visual-icon-governance{background:#050505}
.visual-icon-agent,.visual-icon-roadmap,.visual-icon-knowledge,.visual-icon-method{background:#131313}

.page-answer::before{content:"";position:absolute;left:0;top:0;width:clamp(70px,9vw,150px);height:100%;background:repeating-linear-gradient(180deg,rgba(255,238,88,.72) 0 8px,transparent 8px 24px);opacity:.22;pointer-events:none}
.page-answer-grid>div:first-child::before{content:"";display:block;width:80px;height:8px;margin-bottom:26px;background:linear-gradient(90deg,#061426 0 26%,#FFEE58 26% 76%,#050505 76%)}
.page-answer li{transition:padding-left .18s ease,background .18s ease}
.page-answer li:hover{padding-left:38px;background:rgba(255,238,88,.09)}

.page-faq-grid>div:first-child::after{content:"";display:block;width:120px;height:120px;margin-top:38px;border:1px solid rgba(255,238,88,.42);background:linear-gradient(135deg,rgba(255,238,88,.24) 0 50%,transparent 50%),repeating-linear-gradient(90deg,transparent 0 18px,rgba(255,255,255,.08) 18px 19px);box-shadow:10px 10px 0 rgba(255,238,88,.08)}
.page-faq details{transition:background .16s ease,padding-left .16s ease}
.page-faq details:hover{background:rgba(255,238,88,.035);padding-left:10px}

.visual-blog-hero{padding:112px 0 78px;border-bottom:8px solid #fff}
.visual-blog-hero .blog-hero-grid{grid-template-columns:minmax(0,1fr) minmax(390px,.82fr);align-items:center}
.blog-visual-stack{display:grid;gap:18px}
.blog-visual-stack .system-visual{max-width:none}
.blog-visual-stack .system-visual-frame{aspect-ratio:1.58/1}
.blog-visual-stack .blog-aside{margin:0}
.visual-blog-list{position:relative;padding-top:22px}
.visual-blog-list::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,#061426,#FFEE58 48%,transparent)}
.visual-blog-card{padding-top:28px;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.visual-blog-card::after{content:"";position:absolute;right:-52px;top:-52px;width:144px;height:144px;border:24px solid rgba(255,238,88,.13);transform:rotate(45deg)}
.visual-blog-card:hover,.visual-blog-card:focus-within{transform:translateY(-5px);border-color:#050505;box-shadow:10px 10px 0 rgba(255,238,88,.72)}
.visual-blog-card .visual-icon{margin-bottom:28px}
.visual-blog-card .blog-read{z-index:2}

@keyframes visual-dash{to{stroke-dashoffset:-160}}
@keyframes visual-pulse{0%,100%{transform:scale(.78);opacity:.56}50%{transform:scale(1.34);opacity:1}}

@media(max-width:1180px){
  .hero .shell.hero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);gap:38px}
  .system-visual{max-width:520px}
  .visual-blog-hero .blog-hero-grid{grid-template-columns:minmax(0,1fr) minmax(330px,.75fr);gap:38px}
}

@media(max-width:980px){
  .hero{padding:92px 0 62px}
  .hero .shell.hero-grid{grid-template-columns:1fr}
  .system-visual{justify-self:start;max-width:700px;width:100%}
  .system-visual-frame{aspect-ratio:1.5/1}
  .hero h1{max-width:860px}
  .visual-blog-hero .blog-hero-grid{grid-template-columns:1fr}
  .blog-visual-stack{max-width:760px}
}

@media(max-width:620px){
  .hero{padding:72px 0 48px}
  .hero .shell.hero-grid{gap:34px}
  .system-visual-frame{aspect-ratio:1.08/1;padding:6px;box-shadow:7px 7px 0 rgba(255,238,88,.12)}
  .system-visual-corner{width:24px;height:24px}
  .visual-signal-strip{height:6px}
  .section-marker{margin-bottom:18px}
  .visual-section::before{display:none}
  .visual-card-grid{margin-top:28px}
  .visual-icon{width:62px;height:62px}
  .visual-icon svg{width:36px;height:36px}
  .visual-card h3{margin-top:20px}
  .page-faq-grid>div:first-child::after{display:none}
  .visual-blog-hero{padding:82px 0 58px}
  .blog-visual-stack .system-visual-frame{aspect-ratio:1.1/1}
}

@media(prefers-reduced-motion:reduce){
  .visual-link,.visual-pulse{animation:none}
  .visual-card,.visual-module,.visual-building,.visual-city,.visual-node,.visual-blog-card{transition:none}
}
