/* Hayanezu's floating branding cards, rebuilt as hollow DO red 3D outlines.
   Reference composition: https://hayanezu.com/branding/ */
.bw-page .bw-wire-hero{background:#08090b;color:#fff;padding:28px 0 64px;border-bottom:1px solid #301017;isolation:isolate}
.bw-wire-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 82% 56%,#6a061214,transparent 43%);pointer-events:none}
.bw-wire-hero .bw-breadcrumb{color:#b8afb1;font-size:13px;margin-bottom:40px;gap:14px}
.bw-wire-hero .bw-breadcrumb a{color:#d2cbce;text-underline-offset:4px}
.bw-wire-hero .bw-breadcrumb a:hover{color:#fff}
.bw-hero-layout{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,1fr);gap:16px;align-items:center;min-height:460px}
.bw-hero-copy{position:relative;z-index:2;padding:22px 0 30px;min-width:0}
.bw-page .bw-wire-hero h1{color:#fff8f6;font-size:clamp(40px,4.35vw,62px);line-height:1.07;letter-spacing:-.045em;margin-bottom:27px;max-width:680px;text-wrap:balance}
.bw-page .bw-wire-hero .bw-lead{font-size:clamp(17px,1.65vw,20px);line-height:1.65;max-width:555px;color:#c4b9bd;margin:0 0 34px}
.bw-wire-hero .cta-row{gap:14px;margin-top:0}
.bw-wire-hero .btn{font-size:15px;padding:13px 22px;line-height:1.5}
.bw-wire-hero .btn-primary{background:#e0162b;color:#fff;box-shadow:0 8px 26px -12px #e0162b70}
.bw-wire-hero .btn-primary:hover{background:#ff2941;box-shadow:0 8px 30px -12px #e0162b90}
.bw-wire-hero .btn-outline{color:#f6edf0;border:1px solid #817078;background:transparent}
.bw-wire-hero .btn-outline:hover{background:#fff8f6;color:#1b1115;border-color:#fff8f6}
.bw-wire-hero a:focus-visible,.bw-wire-hero button:focus-visible{outline:3px solid #ff7b8b;outline-offset:5px}
.bw-brand-visual{position:relative;width:100%;aspect-ratio:1/1;min-width:0;margin:0;color:#f0223c;align-self:center;--bw-motion:paused}
.bw-brand-space{position:absolute;inset:0;perspective:1050px;perspective-origin:50% 48%;pointer-events:none}
.bw-brand-scene{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(-12deg) rotateY(-20deg) rotateZ(3deg);animation:bw-brand-orbit 18s ease-in-out infinite;animation-play-state:var(--bw-motion)}
.bw-wire-card{position:absolute;transform-style:preserve-3d}
.bw-wire-card--type{left:8%;top:5%;width:43%;height:50%;transform:translateZ(-45px) rotateZ(-16deg) rotateY(7deg);animation:bw-type-float 12s ease-in-out infinite;animation-play-state:var(--bw-motion)}
.bw-wire-card--logo{left:28%;top:29%;width:64%;height:48%;transform:translateZ(40px) rotateZ(9deg) rotateX(-4deg);animation:bw-logo-float 14s ease-in-out infinite;animation-play-state:var(--bw-motion)}
.bw-wire-card--palette{left:18%;top:77%;width:60%;height:18%;transform:translateZ(82px) rotateZ(-10deg) rotateX(7deg);animation:bw-palette-float 13s ease-in-out infinite;animation-play-state:var(--bw-motion)}
.bw-wire-face{position:absolute;inset:0;width:100%;height:100%;overflow:visible;backface-visibility:visible}
.bw-wire-face--front{transform:translateZ(12px);filter:drop-shadow(0 0 2px #e0162b60)}
.bw-wire-face--back{transform:translateZ(-12px);color:#a60e25;opacity:.8}
.bw-wire-face path,.bw-wire-face rect,.bw-wire-face circle,.bw-wire-face text{vector-effect:non-scaling-stroke}
.bw-wire-card--logo .bw-wire-face--front{stroke-width:1.5;color:#ff3049}
.bw-wire-card--logo .bw-wire-face--back{color:#d31731}
.bw-wire-edge{position:absolute;width:24px;height:1px;display:block;background:#c91a32;transform:translateX(-50%) rotateY(90deg);transform-origin:center}
.bw-wire-edge--tl{left:2%;top:2%}
.bw-wire-edge--tr{left:98%;top:2%}
.bw-wire-edge--bl{left:2%;bottom:2%}
.bw-wire-edge--br{left:98%;bottom:2%}
.bw-motion-toggle{position:absolute;right:0;bottom:0;display:grid;place-items:center;width:44px;height:44px;border:1px solid #79404b;border-radius:50%;padding:0;background:#0b0a0c;color:#e5a2ad;cursor:pointer;z-index:3;transition:border-color .2s,color .2s}
.bw-motion-toggle[hidden]{display:none}
.bw-motion-toggle:hover{border-color:#ff4159;color:#fff}
.bw-motion-play{display:none}
.bw-motion-toggle[aria-pressed=true] .bw-motion-play{display:block}
.bw-motion-toggle[aria-pressed=true] .bw-motion-pause{display:none}
@keyframes bw-brand-orbit{0%,100%{transform:rotateX(-12deg) rotateY(-20deg) rotateZ(3deg)}50%{transform:rotateX(8deg) rotateY(16deg) rotateZ(-3deg)}}
@keyframes bw-type-float{0%,100%{transform:translate3d(0,0,-45px) rotateZ(-16deg) rotateY(7deg)}50%{transform:translate3d(0,-9px,-24px) rotateZ(-11deg) rotateY(-7deg)}}
@keyframes bw-logo-float{0%,100%{transform:translate3d(0,0,40px) rotateZ(9deg) rotateX(-4deg)}50%{transform:translate3d(0,-7px,60px) rotateZ(4deg) rotateX(5deg)}}
@keyframes bw-palette-float{0%,100%{transform:translate3d(0,0,82px) rotateZ(-10deg) rotateX(7deg)}50%{transform:translate3d(5px,7px,95px) rotateZ(-6deg) rotateX(-6deg)}}
@media(min-width:1181px){.bw-wire-hero .bw-hero-layout{gap:24px}.bw-wire-hero .bw-hero-copy{padding-right:4px}}
@media(min-width:781px) and (max-width:1050px){.bw-hero-layout{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.bw-page .bw-wire-hero h1{font-size:43px}.bw-wire-hero .cta-row{flex-direction:column;align-items:flex-start}.bw-wire-hero .btn{font-size:14px;padding:12px 20px}}
@media(max-width:780px){
 .bw-page .bw-wire-hero{padding:24px 0 42px}
 .bw-wire-hero .bw-breadcrumb{margin-bottom:26px}
 .bw-hero-layout{grid-template-columns:1fr;gap:12px;min-height:0}
 .bw-hero-copy{padding:10px 0 0;max-width:650px}
 .bw-page .bw-wire-hero h1{font-size:clamp(38px,6.9vw,52px);line-height:1.1;margin-bottom:24px;max-width:630px}
 .bw-page .bw-wire-hero .bw-lead{font-size:18px;max-width:600px;margin-bottom:28px}
 .bw-brand-visual{width:78%;max-width:440px;justify-self:center;margin-top:20px;aspect-ratio:1/1}
 .bw-wire-hero .btn{padding:13px 22px}
 .bw-motion-toggle{right:-14px;bottom:5px}
}
@media(max-width:480px){
 .bw-page .bw-wire-hero h1{font-size:37px;letter-spacing:-.04em}
 .bw-page .bw-wire-hero .bw-lead{font-size:17px}
 .bw-brand-visual{width:94%;max-width:360px;margin-top:28px;margin-bottom:8px}
 .bw-wire-hero .cta-row{gap:12px}
 .bw-wire-hero .btn{width:100%;font-size:14px}
 .bw-motion-toggle{right:-6px;bottom:-6px}
}
@media(max-width:360px){.bw-page .bw-wire-hero h1{font-size:33px}}
@media(prefers-reduced-motion:reduce){
 .bw-brand-scene,.bw-wire-card{animation:none}
 .bw-motion-toggle{display:none}
}
@media print{.bw-brand-scene,.bw-wire-card{animation:none}.bw-motion-toggle{display:none}}