/* C45: owner-selected Porcelain proportions, blue ground and satin materials. */
.brand .brand-mark{fill:none;background:none;color:var(--ink)}
.brand .brand-mark path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cc .brand-hero{position:relative;isolation:isolate;overflow:hidden;container-type:inline-size;display:flex;align-items:center;justify-content:center;min-height:650px;padding:64px;border-radius:28px;background:radial-gradient(ellipse at 85% 15%,#e4d6e940,transparent 37%),linear-gradient(122deg,#dbe9fb 0%,#b6cff1 60%,#81a9e2 100%)}
.brand-art{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.brand-sphere,.brand-loop{position:absolute;display:block;background-position:center;background-repeat:no-repeat;will-change:translate}
.brand-blue{left:-4%;top:2%;width:340px;height:340px;border-radius:50%;background-image:url('assets/hero-blue.webp');background-size:106% 106%;animation:brand-float 12s ease-in-out infinite alternate}
.brand-pink{right:9%;top:6%;width:110px;height:110px;border-radius:50%;background-image:url('assets/hero-pink.webp');background-size:106% 106%;animation:brand-float 12s ease-in-out -6s infinite alternate}
.brand-loop-blue{left:5%;bottom:-12%;width:700px;height:260px;background-image:url('assets/hero-loop-blue.webp');background-size:contain;transform:rotate(-23deg);animation:brand-drift 16s ease-in-out infinite alternate}
.brand-loop-pearl{right:-10%;bottom:-24%;width:510px;height:510px;background-image:url('assets/hero-loop-pearl.webp');background-size:contain;transform:rotate(-18deg);animation:brand-drift 18s ease-in-out infinite alternate}
.brand-hero .brand-pane{position:relative;width:100%;max-width:1180px;min-height:469px;padding:30px 42px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:20px;background:rgba(250,247,240,.24);backdrop-filter:blur(17px) saturate(1.04);-webkit-backdrop-filter:blur(17px) saturate(1.04);box-shadow:var(--glass-edge);color:var(--ink)}
.brand-eyebrow{font-size:12px;color:var(--ink-2)}
.brand-title{display:flex;align-items:center;justify-content:center;gap:20px;margin:25px 0 16px;max-width:100%}
.brand-title svg{width:54px;height:54px;flex:none;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;color:var(--accent-ink)}
.brand-title h1{margin:0;font:600 clamp(46px,10cqi,96px)/1.12 'Manrope',var(--sans);letter-spacing:-.055em;color:var(--ink);text-wrap:initial}
.brand-purpose{font:400 22px/1.5 'Manrope',var(--sans);color:var(--ink-2);max-width:38ch;text-wrap:balance}
.brand-policy{font-size:14px;line-height:1.8;color:var(--ink-2);margin-top:22px;max-width:56ch;text-wrap:balance}
.brand-motion{position:absolute;right:22px;top:16px;border:0;border-radius:8px;min-height:36px;padding:4px 9px;background:transparent;color:var(--ink-2);font-size:11px;cursor:pointer}
@property --brand-rim-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.brand-pane::after{content:'';position:absolute;inset:-5px;padding:3px;border-radius:25px;pointer-events:none;background:conic-gradient(from var(--brand-rim-angle),transparent 0deg 242deg,#ec489900 249deg,#edc3d799 275deg,#ec4899c9 303deg,#fff4faed 311deg,#ec489900 324deg,transparent 360deg);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;animation:brand-rim 12s linear infinite}
@keyframes brand-float{from{translate:0 -10px}to{translate:8px 13px}}
@keyframes brand-drift{from{translate:0 12px}to{translate:-12px -15px}}
@keyframes brand-rim{to{--brand-rim-angle:360deg}}
.brand-hero[data-paused="true"] .brand-art *,.brand-hero[data-paused="true"] .brand-pane::after{animation-play-state:paused}
.cc-next{display:grid;gap:16px}.cc-next .finding{margin:0}.cc-next .finding:empty{display:none}
:root[data-theme="dark"] .brand-hero{background:radial-gradient(ellipse at 10% 15%,#25478060,transparent 55%),#0f1d33}
:root[data-theme="dark"] .brand-pane{background:rgba(22,30,43,.54)}
@media(max-width:1200px){.cc .brand-hero{padding:50px}.brand-hero .brand-pane{min-height:452px;padding:28px 32px}}
@media(max-width:980px){.cc .brand-hero{padding:38px 32px;min-height:630px}.brand-hero .brand-pane{min-height:407px;padding:24px}.brand-blue{left:-18%}.brand-purpose{font-size:20px}.brand-policy{font-size:13px}}
@container(max-width:650px){.brand-title{flex-direction:column;gap:14px}.brand-title h1{font-size:clamp(36px,15.2cqi,58px)}.brand-title svg{width:36px;height:36px}.brand-purpose{font-size:17px}.brand-policy{font-size:12px;max-width:30ch}}
@media(max-width:650px){.cc .brand-hero{padding:99px 20px;min-height:690px;border-radius:24px}.brand-hero .brand-pane{min-height:360px;padding:26px 20px;border-radius:18px;background:rgba(250,247,240,.29)}.brand-eyebrow{font-size:11px}.brand-title{margin:20px 0 18px}.brand-blue{width:240px;height:240px;left:-25%;top:-8%}.brand-pink{width:80px;height:80px;right:2%;top:7%}.brand-loop-blue{width:460px;height:180px;bottom:-7%;left:-27%}.brand-loop-pearl{width:350px;height:350px;right:-30%;bottom:-7%}.brand-pane::after{border-radius:23px}}
@media(prefers-reduced-motion:reduce){.brand-art *,.brand-pane::after{animation:none!important;will-change:auto}.brand-motion{display:none}}
