:root{--bg:#05080e;--panel:#090f19;--text:#f5f8ff;--muted:#8798ae;--cyan:#75e8ff;--cyan-strong:#14bdf5;--line:rgba(115,200,255,.21)}
body{background:#05080e}
.brand-word{font-size:25px;letter-spacing:-.065em;font-weight:900;line-height:1;color:#f0f7ff}
.brand-word span{color:#67dcff}.brand-word small{display:block;font-size:7px;letter-spacing:.2em;margin-top:6px;font-weight:700;color:#8ea4b9}
.header-cta{font-size:10px;letter-spacing:.12em;font-weight:800;border:1px solid #357a9a;padding:13px 16px;color:#ccefff}
.header-cta:hover{background:#0c6387}
.hero{background:radial-gradient(ellipse 60% 65% at 72% 42%,rgba(17,106,180,.22),transparent 75%),linear-gradient(145deg,#070b13,#04070c 60%)}
.hero-glow{border-color:rgba(63,161,255,.12);box-shadow:0 0 0 8vw rgba(21,119,255,.018),0 0 0 18vw rgba(6,80,156,.016)}
.hero-grid{grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr)}
.hero-kicker{color:#a8c4dd;font-size:10px;letter-spacing:.21em;font-weight:800;margin-top:38px}
.hero h1{font-size:clamp(54px,6.2vw,110px);margin:20px 0 26px}
.hero h1 .hero-h1-top{color:#f5f8ff}.hero h1 .hero-h1-bottom{color:#b8cbdc;font-size:.55em;letter-spacing:-.065em}
.hero h1 em{font-weight:850;color:#4dd3ff}
.hero-lead{color:#b3c3d3;max-width:540px}
.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;background:#44cdff;color:#00131f;font-size:10px;font-weight:850;letter-spacing:.1em;padding:18px 21px;border:1px solid #6ae0ff;transition:background .25s,transform .25s}
.primary-button:hover{background:#a6efff;transform:translateY(-2px)}
.outline-button{border:1px solid #42637e;background:#091421;color:#e2f6ff;font-size:10px;letter-spacing:.1em;font-weight:800;padding:17px 19px;transition:background .25s}
.outline-button:hover{background:#173448}
.hero-actions{gap:13px}
.hero-portrait,.scroll-portrait{box-shadow:0 0 110px rgba(15,128,241,.2)}
.content-section{position:relative;padding:125px clamp(25px,7vw,118px);overflow:hidden}
.section-tag{font-size:11px;letter-spacing:.22em;color:#65d7ff;font-weight:850;margin:0 0 25px}
.section-heading{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px,.6fr);gap:18px 80px;align-items:end;margin-bottom:48px}
.section-heading .section-tag{grid-column:1/-1}
.section-heading h2,.local-heading h2{font-size:clamp(42px,5vw,82px);line-height:.99;letter-spacing:-.06em;margin:0}
.section-heading h2 em,.local-heading h2 em,.case-grid h2 em{font-style:normal;color:#65d7ff;font-weight:300}
.section-heading>p:last-child{font-size:16px;line-height:1.7;color:#b0c0d3;max-width:440px}
.services-section{background:linear-gradient(180deg,#070c14,#0b1521)}
.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:#284058;border:1px solid #284058}
.service-card{background:#08111b;padding:34px 28px 27px;min-height:370px;display:flex;flex-direction:column;transition:background .3s,transform .3s}
.service-card:hover{background:#11263a;transform:translateY(-5px)}
.service-n,.service-foot{font-size:9px;color:#66c9ed;font-weight:800;letter-spacing:.13em}
.service-symbol{font-size:42px;color:#4ccafa;margin:30px 0 15px}
.service-card h3{font-size:clamp(20px,1.7vw,27px);letter-spacing:-.035em;line-height:1.1;margin:0 0 17px}
.service-card p{color:#9eb1c7;line-height:1.65;font-size:13px;margin:0 0 32px}
.service-foot{margin-top:auto;color:#637f99;line-height:1.5}
.evolution{background:#05080e}
.case-section{background:linear-gradient(155deg,#091522,#06101a)}
.case-top{display:flex;justify-content:space-between;align-items:center;gap:25px;color:#6889a6;font-size:10px;letter-spacing:.14em;font-weight:800}
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}
.case-grid h2{font-size:clamp(45px,5.2vw,87px);line-height:1;letter-spacing:-.065em;margin:15px 0 35px}
.case-grid h2 span{color:#51d6ff}
.case-grid h2 em{font-size:.51em;letter-spacing:-.04em}
.case-grid p{max-width:570px;color:#acbed0;font-size:16px;line-height:1.85}
.case-tags{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 32px}
.case-tags span{border:1px solid #2e5370;padding:10px 12px;font-size:9px;letter-spacing:.12em;color:#aadcf2;font-weight:800}
.case-link{font-size:11px;letter-spacing:.16em;font-weight:800;color:#62ddff;border-bottom:1px solid #459cb7;padding-bottom:10px}
.case-visual{position:relative;aspect-ratio:1/1;min-height:350px;overflow:hidden;background:radial-gradient(circle,#0f4770 0%,#0b1b2d 48%,#060b13 80%);border:1px solid #34607d;display:grid;place-items:center}
.case-visual:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#76bfff13 1px,transparent 1px),linear-gradient(90deg,#76bfff13 1px,transparent 1px);background-size:32px 32px}
.case-orbit{position:absolute;width:64%;aspect-ratio:1;border:1px solid #4bd6ff55;border-radius:50%;box-shadow:0 0 75px #0da8ff26}
.case-orbit.b{width:88%;border-style:dashed;animation:spin 55s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.case-centre{position:relative;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center}
.room-icon{font-size:100px;line-height:1;color:#7ceaff;text-shadow:0 0 50px #2ccaff}
.case-centre strong{font-size:clamp(27px,3vw,55px);letter-spacing:-.065em;line-height:.95}.case-centre small{font-size:9px;letter-spacing:.2em;color:#79bfdc;font-weight:800}
.case-ui-top,.case-ui-bottom{position:absolute;left:25px;right:25px;font-size:9px;letter-spacing:.16em;color:#70c7e7;font-weight:800}
.case-ui-top{top:25px;display:flex;justify-content:space-between}.case-ui-bottom{bottom:25px}
.local-section{display:grid;grid-template-columns:1fr 1fr;gap:8vw;background:#0a1018;border-top:1px solid #1b394c}
.local-copy{padding-top:37px;color:#b1c2d1;font-size:17px;line-height:1.8}.local-copy strong{color:#d6f5ff}
.outro{background:#e7f3fa}.outro h2{font-size:clamp(55px,7vw,120px)}.outro h2 i{color:#137da9}.outro-eyebrow{color:#1682ac}
.contact-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}.contact-actions .secondary-button{margin-top:0;background:#d4e5ef;color:#082c40}.contact-actions .secondary-button:hover{background:#b4dcec}
.site-footer{background:#05080e}
@media(max-width:1150px){.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero h1{font-size:clamp(52px,6vw,86px)}}
@media(max-width:850px){.header-cta{margin-left:auto;font-size:8px;padding:10px}.hero-grid{grid-template-columns:1fr}.hero h1{font-size:clamp(50px,9vw,84px)}.section-heading,.case-grid,.local-section{grid-template-columns:1fr}.case-grid{gap:35px}.content-section{padding:90px 25px}.service-card{min-height:300px}.case-visual{max-width:600px;width:100%}}
@media(max-width:560px){.hero h1{font-size:clamp(43px,11vw,66px)}.hero-h1-bottom{font-size:.54em!important}.hero-kicker{margin-top:22px}.hero-actions{align-items:stretch}.primary-button,.outline-button{font-size:9px}.service-grid{grid-template-columns:1fr}.service-card{min-height:270px}.section-heading h2,.local-heading h2{font-size:45px}.case-top>span{display:none}.case-grid h2{font-size:47px}.case-visual{min-height:300px}.case-centre strong{font-size:35px}.local-copy{padding-top:0}.header-cta{display:none}.contact-actions{flex-direction:column;align-items:stretch}}

/* V3 — Portrait blended into the entire page, with binary-code atmosphere. */
#binaryRain{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.site-header,.hero,.content-section,.evolution,.outro,.site-footer{position:relative;z-index:1}
.hero:before,.chapter-grid{display:none!important}
.hero{background:linear-gradient(90deg,rgba(4,8,15,.94) 0%,rgba(4,8,15,.81) 39%,rgba(4,8,15,.25) 100%);isolation:isolate}
.hero-grid{display:block;min-height:640px}
.hero-copy{width:min(59%,780px);z-index:8}
.hero-art{position:absolute;top:-4%;right:-8%;width:63%;height:112%;padding:0;margin:0;z-index:2;pointer-events:auto}
.hero-portrait{width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:auto;background:transparent;box-shadow:none!important;margin:0;overflow:hidden;mask-image:radial-gradient(ellipse 58% 64% at 50% 46%,#000 39%,rgba(0,0,0,.97) 60%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 58% 64% at 50% 46%,#000 39%,rgba(0,0,0,.97) 60%,transparent 100%)}
.hero-portrait .portrait-base,.hero-portrait canvas{object-fit:cover}
.hero-art .portrait-meta,.hero-art .vertical-code,.hero-portrait .frame-corners,.hero-portrait .face-crosshair{display:none!important}
.hero-portrait:after{display:none}
.hero-bottom{position:relative;z-index:9}
.services-section{background:linear-gradient(180deg,rgba(7,13,22,.88),rgba(8,16,26,.92))}
.evolution{background:rgba(4,9,16,.91)}
.case-section{background:linear-gradient(150deg,rgba(8,19,32,.88),rgba(5,13,24,.9))}
.local-section{background:rgba(7,13,22,.9)}
.outro{background:rgba(8,17,29,.94);color:#eff8ff}
.outro h2,.outro .outro-copy{color:#eff8ff}
.outro h2 i{color:#5bdbff}
.outro .outro-eyebrow{color:#5bdbff}
.site-footer{background:rgba(4,9,15,.97)}
@media(max-width:1150px){
  .hero-copy{width:64%}
  .hero-art{right:-14%;width:68%}
}
@media(max-width:850px){
  .hero{background:linear-gradient(180deg,rgba(4,8,15,.95),rgba(4,8,15,.76))}
  .hero-grid{display:flex;flex-direction:column;min-height:0}
  .hero-copy{width:100%}
  .hero-art{position:relative;top:auto;right:auto;width:min(100%,560px);height:min(68vh,640px);min-height:380px;margin:-25px auto -35px}
  .hero-portrait{width:100%;height:100%;max-width:none;max-height:none}
}
@media(max-width:560px){
  .hero-art{height:480px;min-height:0;margin:-16px auto -32px;width:116%}
  .hero h1{position:relative;z-index:10}
}
/* Deep-black visual foundation. The binary canvas remains visible and crisp. */
html,body{background:#010203!important}
.hero{background:linear-gradient(90deg,rgba(1,2,3,.88),rgba(1,2,3,.60) 55%,rgba(1,2,3,.12))!important}
.hero-glow{display:none!important}
.services-section{background:rgba(1,2,3,.85)!important}
.evolution{background:rgba(1,2,3,.83)!important}
.case-section{background:rgba(1,2,3,.83)!important}
.local-section{background:rgba(1,2,3,.83)!important}
.outro{background:rgba(1,2,3,.9)!important}
.site-footer{background:rgba(1,2,3,.97)!important}
#binaryRain{opacity:.94}
@media(max-width:850px){.hero{background:linear-gradient(180deg,rgba(1,2,3,.88),rgba(1,2,3,.45))!important}}

/* V4 — two genuine alpha cutouts, aligned in one portrait in the hero only. */
.hero-grid{min-height:740px}
.hero-art{width:min(49vw,745px);height:auto;aspect-ratio:1086/1448;top:-35px;right:-3%;mix-blend-mode:normal}
.hero-portrait{width:100%;height:100%;aspect-ratio:1086/1448;overflow:visible!important;mask-image:none!important;-webkit-mask-image:none!important;background:transparent!important}
.hero-portrait .portrait-base{width:100%;height:100%;object-fit:contain}
.hero-portrait .reveal-canvas{width:100%;height:100%}
.hero-portrait:after{display:none}
.ambient-grain{display:none!important}
.approach-section{background:rgba(1,2,3,.88);border-top:1px solid #163047;border-bottom:1px solid #163047}
.approach-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:7vw;align-items:end}
.approach-intro h2{font-size:clamp(42px,5vw,80px);line-height:1.04;letter-spacing:-.06em;margin:0}
.approach-intro h2 em{font-style:normal;color:#61d9ff;font-weight:350}
.approach-intro p{font-size:16px;color:#a5bed1;line-height:1.8;max-width:540px}
.approach-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#224159;margin-top:65px;border:1px solid #224159}
.approach-steps article{background:#060c12;padding:34px;min-height:230px}
.approach-steps span{font-size:10px;color:#5acdf4;font-weight:800;letter-spacing:.14em}
.approach-steps h3{font-size:24px;line-height:1.2;letter-spacing:-.035em;margin:35px 0 14px}
.approach-steps p{color:#93a9bc;font-size:13px;line-height:1.7}
@media(max-width:850px){
  .hero-grid{min-height:0}
  .hero-art{width:min(100%,540px);height:auto;aspect-ratio:1086/1448;top:auto;right:auto}
  .hero-portrait{width:100%;height:100%}
  .approach-intro{grid-template-columns:1fr;gap:20px}
  .approach-steps{grid-template-columns:1fr;margin-top:40px}
  .approach-steps article{min-height:0}
}
/* V5 — no oval crop. Intact face dissolves vertically into live jacket fragments. */
.hero-art{-webkit-mask-image:none!important;mask-image:none!important}
.hero-portrait{
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 11%,#000 89%,transparent 100%)!important;
  mask-image:linear-gradient(to right,transparent 0%,#000 11%,#000 89%,transparent 100%)!important;
}
.hero-portrait .portrait-base,.hero-portrait .reveal-canvas{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 69%,rgba(0,0,0,.92) 73%,rgba(0,0,0,.28) 79%,transparent 85%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 69%,rgba(0,0,0,.92) 73%,rgba(0,0,0,.28) 79%,transparent 85%);
}
.hero-portrait .fragment-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4;opacity:1}
/* V8 — one optical black across the canvas; no gradients or rectangular glow. */
html,body,.hero{background:#000!important}
.hero::before,.hero-glow{display:none!important}
.hero-art,.hero-portrait{background:transparent!important;box-shadow:none!important}
/* Keep the human portrait physically present and let the dark jacket melt
   naturally into black; no particles, hexagons, outlines or artificial oval. */
.hero-portrait .portrait-base,.hero-portrait .reveal-canvas{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 70%,rgba(0,0,0,.96) 76%,rgba(0,0,0,.63) 83%,rgba(0,0,0,.18) 93%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 70%,rgba(0,0,0,.96) 76%,rgba(0,0,0,.63) 83%,rgba(0,0,0,.18) 93%,transparent 100%);
}
.hero-portrait .fragment-canvas{display:none!important}
/* V9 — one uninterrupted black plane, with Matrix digits *behind* every section. */
html,body{background:#000!important}
.hero,.services-section,.approach-section,.case-section,.local-section,.outro,.site-footer{
  background:transparent!important;
  background-image:none!important;
}
.hero-bottom-line{display:none!important}
.approach-section{border-top:0!important}
#binaryRain{z-index:0;opacity:1;filter:none}
.site-header,.hero,.content-section,.outro,.site-footer{position:relative;z-index:1}
/* V11 — natural portrait retouch and an explicit WhatsApp contact CTA. */
.whatsapp-button{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:57px;padding:14px 19px;color:#fff;background:#188c4b;
  border:1px solid #31bd73;font-size:10px;font-weight:850;
  letter-spacing:.09em;text-decoration:none;
  transition:background .25s,transform .25s,box-shadow .25s;
}
.whatsapp-button:hover{background:#21a95e;transform:translateY(-2px);box-shadow:0 9px 32px rgba(23,170,88,.17)}
.whatsapp-button:focus-visible{outline:2px solid #fff;outline-offset:4px}
.whatsapp-icon{height:24px;width:24px;flex:none;display:block}
.whatsapp-arrow{font-size:18px;font-weight:400;margin-left:4px}
.hero-portrait{border:0!important;outline:0!important}
@media(max-width:560px){.whatsapp-button{width:100%;min-height:54px;padding:14px 16px;font-size:9px}.hero-actions{align-items:stretch}}
/* V13 — align both hero calls to action on a single baseline. */
.hero-actions{display:flex;align-items:stretch;gap:13px}
.hero-actions .primary-button,.hero-actions .whatsapp-button{
  height:58px;min-height:58px;align-self:stretch;margin:0;
  padding-top:0;padding-bottom:0;box-sizing:border-box;
}
@media(max-width:560px){
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .primary-button,.hero-actions .whatsapp-button{width:100%;height:54px;min-height:54px}
}
/* V14 — broader photographic feather: the jacket disappears into true black,
   while face, hair, neck and upper shoulder contours remain untouched. */
.hero-portrait .portrait-base,.hero-portrait .reveal-canvas{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 62%,rgba(0,0,0,.97) 68%,rgba(0,0,0,.84) 75%,rgba(0,0,0,.53) 84%,rgba(0,0,0,.18) 94%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 62%,rgba(0,0,0,.97) 68%,rgba(0,0,0,.84) 75%,rgba(0,0,0,.53) 84%,rgba(0,0,0,.18) 94%,transparent 100%);
}
/* V15 — fragmented horizontal transmission lines limited to the torso. */
.hero-portrait .streak-canvas{
  position:absolute;inset:0;width:100%;height:100%;z-index:4;
  display:block;pointer-events:none;opacity:.92;
}
/* V16 — the horizontal bands are actual transparent image data, not an
   almost-invisible runtime overlay. Do not mask the designed streak tails. */
.hero-portrait{-webkit-mask-image:none!important;mask-image:none!important}
.hero-portrait .portrait-base{-webkit-mask-image:none!important;mask-image:none!important}
.hero-portrait .streak-canvas{display:none!important}
/* V17 — vertical streams with feathered tips; face and upper jacket intact. */
.hero-portrait .portrait-base{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 80%,rgba(0,0,0,.92) 87%,rgba(0,0,0,.55) 95%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 80%,rgba(0,0,0,.92) 87%,rgba(0,0,0,.55) 95%,transparent 100%)!important;
}
/* Let the full decorative circle span the previous section instead of being
   cut by the contact section's overflow boundary. */
.outro{overflow:visible!important}
.outro-orbit{
  width:min(62vw,950px)!important;
  top:-13vw!important;
  right:6vw!important;
  aspect-ratio:1!important;
  border:1px solid rgba(65,171,214,.13)!important;
  box-shadow:0 0 0 10vw rgba(22,116,163,.007)!important;
}
@media(max-width:850px){.outro-orbit{width:86vw!important;right:7vw!important;top:-20vw!important}}
/* V19 — substantially lower the opacity of the vertical tails until they
   vanish into actual alpha. Keep the face and the jacket collar sharp. */
.hero-portrait .portrait-base{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 56%,rgba(0,0,0,.93) 64%,rgba(0,0,0,.70) 73%,rgba(0,0,0,.39) 82%,rgba(0,0,0,.12) 92%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 56%,rgba(0,0,0,.93) 64%,rgba(0,0,0,.70) 73%,rgba(0,0,0,.39) 82%,rgba(0,0,0,.12) 92%,transparent 100%)!important;
}
.cursor-ring{width:22px;height:22px;border-color:rgba(91,221,255,.68)}
.cursor-ring.active{width:38px;height:38px;border-color:rgba(91,221,255,.78);box-shadow:0 0 12px rgba(50,192,255,.12)}
/* NEXUS concept — full-bleed procedural core replaces the portrait. */
.hero{isolation:isolate;overflow:hidden;background:#000!important}
.hero #universe{position:absolute!important;inset:0!important;display:block;width:100%;height:100%;z-index:0;pointer-events:none}
.hero .hero-grid{position:relative;z-index:2;pointer-events:none}
.hero-copy,.hero-copy a,.hero-copy button{pointer-events:auto}
.hero .hero-glow{display:none!important}
.nexus-art{min-height:min(68vh,690px);width:100%!important;max-width:none!important;align-self:center;display:flex;flex-direction:column;justify-content:space-between;padding:42px 0!important;pointer-events:none}
.nexus-tag{font-size:10px;letter-spacing:.2em;color:#9ac6db;font-weight:800;display:flex;gap:9px;align-items:center;justify-content:flex-end;white-space:nowrap}
.nexus-dot{width:7px;height:7px;border-radius:50%;background:#7cf5ff;box-shadow:0 0 14px #59ecff;animation:nexusBlink 2s ease-in-out infinite}
.nexus-orbit-label{align-self:flex-end;color:#7096b1;font-size:9px;line-height:1.8;text-align:right;letter-spacing:.19em;margin-top:auto}
.nexus-controls{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:15px;pointer-events:auto}
.nexus-controls button{font:800 9px/1 Arial,sans-serif;letter-spacing:.14em;border:1px solid rgba(101,198,241,.33);background:rgba(1,9,19,.75);color:#d1eaff;padding:12px 15px;cursor:pointer;transition:border .2s,background .2s}
.nexus-controls button:hover{border-color:#7ee8ff;background:#0d2233}
@keyframes nexusBlink{50%{opacity:.38;box-shadow:0 0 4px #59ecff}}
@media(max-width:850px){.hero{min-height:870px!important}.hero #universe{height:100%!important}.hero .hero-grid{gap:0!important}.nexus-art{min-height:340px!important;padding:12px 0!important;position:relative;z-index:1}.nexus-tag{justify-content:flex-start}.nexus-orbit-label{display:none}.nexus-controls{justify-content:flex-start;margin-top:auto}.hero-copy{position:relative;z-index:4}.hero .hero-bottom{position:relative;z-index:4}}
@media(max-width:560px){.hero{min-height:900px!important}.nexus-art{min-height:320px!important}.nexus-controls button{font-size:8px;padding:12px 9px}}
/* Editorial section — future CMS content slots, currently honest teasers. */
.blog-section{background:#03070c!important;border-top:1px solid rgba(109,171,202,.14)}
.blog-heading{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(250px,.6fr);gap:42px;align-items:end;margin-bottom:56px}
.blog-heading h2{font-size:clamp(46px,5.6vw,92px);line-height:.98;letter-spacing:-.065em;margin:0}
.blog-heading h2 em{font-style:normal;color:#69cfff;font-weight:350}
.blog-heading>p{font-size:15px;line-height:1.85;color:#9cacc2;max-width:450px;margin:0}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.blog-card{border:1px solid rgba(90,150,186,.24);background:#071018;min-width:0;transition:border .3s,transform .3s}
.blog-card:hover{border-color:rgba(101,217,249,.65);transform:translateY(-5px)}
.blog-art{height:240px;display:flex;justify-content:space-between;flex-direction:column;padding:19px 22px;position:relative;overflow:hidden;background:radial-gradient(circle at 65% 52%,rgba(41,120,184,.34),transparent 55%),linear-gradient(145deg,#111c30,#03070d)}
.blog-art-commerce{background:radial-gradient(circle at 55% 52%,rgba(99,66,173,.36),transparent 59%),linear-gradient(145deg,#101025,#03070d)}
.blog-art-ai{background:radial-gradient(circle at 55% 52%,rgba(26,146,169,.33),transparent 58%),linear-gradient(145deg,#071b25,#03070d)}
.blog-art:before{content:"";position:absolute;inset:18% -30%;border:1px solid rgba(112,195,239,.16);border-radius:50%;transform:rotate(-23deg)}
.blog-art:after{content:"";position:absolute;inset:32% -26%;border:1px solid rgba(112,195,239,.12);border-radius:50%;transform:rotate(33deg)}
.blog-art>span{font:700 9px/1.4 monospace;letter-spacing:.17em;color:#80b5ce;z-index:1}
.blog-art>span:last-child{text-align:right}
.blog-art-graphic{position:absolute;inset:0;display:grid;place-items:center;color:#a2eaff;font-size:clamp(75px,8vw,130px);font-weight:200;text-shadow:0 0 50px rgba(82,197,255,.3)}
.blog-art-commerce .blog-art-graphic{color:#b8a1ff}.blog-card-body{padding:28px 26px 30px;display:flex;flex-direction:column;min-height:292px}
.blog-category{font-size:9px;letter-spacing:.18em;color:#79daf8;font-weight:800}
.blog-card h3{font-size:clamp(19px,1.65vw,26px);line-height:1.22;letter-spacing:-.035em;margin:17px 0 14px;font-weight:750}
.blog-card p{font-size:13px;line-height:1.7;color:#93a6bd;margin:0 0 30px}
.blog-status{display:block;font:800 9px/1.5 monospace;letter-spacing:.1em;color:#627f95;border-top:1px solid rgba(121,176,201,.18);padding-top:18px;margin-top:auto}
.blog-note{font-size:12px;line-height:1.65;color:#718da3;margin:27px 0 0;max-width:620px}
@media(max-width:900px){.blog-heading{grid-template-columns:1fr;gap:24px}.blog-grid{grid-template-columns:1fr 1fr}.blog-art{height:210px}}
@media(max-width:650px){.blog-grid{grid-template-columns:1fr}.blog-art{height:215px}.blog-card-body{min-height:0}.blog-heading h2{font-size:clamp(44px,10vw,65px)}}
/* Keep the cursor marker fine; the gravity effect should be the focus. */
.cursor-ring{width:12px!important;height:12px!important;border-width:1px!important;box-shadow:0 0 6px rgba(76,194,242,.12)!important}
.cursor-ring.active{width:18px!important;height:18px!important;box-shadow:0 0 8px rgba(76,194,242,.18)!important}
/* V20 — vertical materialization dissolves gently into true transparency.
   Keep eyes, skin and hair fully opaque; erase the rectangular lower edge. */
.hero-portrait .portrait-base{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 49%,rgba(0,0,0,.96) 57%,rgba(0,0,0,.78) 65%,rgba(0,0,0,.47) 73%,rgba(0,0,0,.22) 81%,rgba(0,0,0,.065) 90%,transparent 99%)!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 49%,rgba(0,0,0,.96) 57%,rgba(0,0,0,.78) 65%,rgba(0,0,0,.47) 73%,rgba(0,0,0,.22) 81%,rgba(0,0,0,.065) 90%,transparent 99%)!important;
}
.hero-portrait .reveal-canvas{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 49%,rgba(0,0,0,.96) 57%,rgba(0,0,0,.78) 65%,rgba(0,0,0,.47) 73%,rgba(0,0,0,.22) 81%,rgba(0,0,0,.065) 90%,transparent 99%)!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 49%,rgba(0,0,0,.96) 57%,rgba(0,0,0,.78) 65%,rgba(0,0,0,.47) 73%,rgba(0,0,0,.22) 81%,rgba(0,0,0,.065) 90%,transparent 99%)!important;
}