/* Local variant B only. Portrait artwork is independent from the rotating halo. */
.hero--portrait{background:#faf8f4}
.hero--portrait .hero-art{opacity:.6}
.hero--portrait .hero-art>img{animation:none;object-position:50% 50%}
.hero--portrait .hero-art::after{background:linear-gradient(90deg,#faf8f4f5 0%,#faf8f4dd 26%,#faf8f499 45%,#faf8f426 63%,#faf8f408 82%),linear-gradient(0deg,#faf8f4b3 0%,transparent 24%)}
.hero--portrait .hero-inner{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:30px;min-height:0;padding-block:20px 18px}
.hero--portrait .hero-copy{width:100%;max-width:620px;position:relative;z-index:2;min-width:0}
.hero--portrait h1{font-size:clamp(38px,4.15vw,60px);line-height:1.15;letter-spacing:-1.9px;margin:13px 0 22px}
.hero-brush{position:relative;display:table;isolation:isolate;white-space:nowrap;color:#fff;font-style:normal;font-weight:500;padding:.1em .32em .19em .22em;margin:9px 0 0 -.22em;letter-spacing:-1.4px}
.hero-brush::before{content:"";position:absolute;inset:0;z-index:-1;background:url("brush-violet.svg") center/100% 100% no-repeat;transform:rotate(-1.1deg)}
.hero--portrait .hero-lead{max-width:510px;font-size:14px;line-height:1.65}
.hero--portrait .hero-note{max-width:500px;font-size:12px}
.hero--portrait .hero-actions{gap:12px;margin-top:22px}
.hero--portrait .hero-actions .button{min-height:49px;font-size:13px}
.hero--portrait .hero-locations{margin-top:19px}
.hero-portrait{position:relative;isolation:isolate;width:100%;max-width:410px;aspect-ratio:1;margin:0;justify-self:center}
.hero-portrait::before{content:"";position:absolute;inset:13%;border-radius:50%;background:radial-gradient(ellipse,#f8f1e8 32%,#e6d8e6 71%,transparent 72%);box-shadow:0 0 65px #bfa3c535;z-index:-1}
.portrait-orbit{position:absolute;inset:2%;border:1px solid #bd965854;border-radius:50%;transform:rotate(-18deg) scaleX(.95);pointer-events:none}
.portrait-orbit::before,.portrait-orbit::after{content:"✧";position:absolute;color:#ac8444;background:transparent;font:24px/1 var(--serif);top:9%;left:12%;padding:2px}
.portrait-orbit::after{inset:auto 9% 10% auto;font-size:18px}
.portrait-halo{position:absolute;width:100%;height:100%;inset:0;object-fit:contain;animation:portrait-halo-turn 80s linear infinite;pointer-events:none}
.portrait-image{position:absolute;inset:-3% 3% auto;width:94%;height:104%;object-fit:contain;object-position:center bottom;z-index:2;filter:drop-shadow(0 8px 12px #402b481c);mask-image:linear-gradient(#000 86%,transparent 100%)}
.hero-portrait figcaption{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:max-content;max-width:90%;z-index:3;background:#faf8f4ed;backdrop-filter:blur(8px);border:1px solid #d8c5dd;border-radius:5px;padding:10px 18px;text-align:center;color:#6b5274;font-size:10px;letter-spacing:.2px;line-height:1.5;box-shadow:0 8px 24px #6551750b}
.hero-portrait figcaption a{color:#613976;font-size:11px;font-weight:600;display:block;padding:3px 0}
.hero-portrait figcaption a:hover{text-decoration:underline;text-underline-offset:3px}
.hero--portrait .hero-bottom{position:relative;z-index:2;padding-block:7px 8px}
@keyframes portrait-halo-turn{to{transform:rotate(360deg)}}
.motion-off .portrait-halo,.hero-art-paused .portrait-halo{animation-play-state:paused!important}
@media(min-width:1500px){.hero--portrait .hero-inner{gap:65px;padding-block:24px}.hero-portrait{max-width:455px}}
@media(max-width:1100px){.hero--portrait .hero-inner{gap:15px;grid-template-columns:1.16fr 1fr}.hero--portrait h1{font-size:42px}.hero--portrait .hero-lead{font-size:13px}.hero--portrait .hero-actions .button{min-width:160px;padding-inline:15px;font-size:12px}.hero-portrait{max-width:385px}}
@media(max-width:800px) and (min-width:621px){.hero--portrait .hero-inner{gap:12px;grid-template-columns:1.2fr 1fr}.hero--portrait h1{font-size:36px;letter-spacing:-1.3px}.hero--portrait .eyebrow{font-size:8px;letter-spacing:1px}.hero--portrait .hero-actions .button{min-width:0;padding-inline:11px;font-size:11px;gap:12px}.hero-portrait figcaption{padding:7px 10px;font-size:9px}}
@media(max-width:620px){
  .hero--portrait .hero-inner,.embedded-preview .hero--portrait .hero-inner{grid-template-columns:1fr;gap:17px;padding-block:22px 15px}
  .hero--portrait h1{font-size:clamp(31px,9.1vw,44px);margin:13px 0 19px;letter-spacing:-1.3px}
  .hero-brush{margin-top:8px;letter-spacing:-1px}
  .hero--portrait .hero-lead{font-size:13px;max-width:100%;line-height:1.65}
  .hero--portrait .hero-note{font-size:11px}
  .hero--portrait .hero-actions{margin-top:18px;gap:10px}
  .hero--portrait .hero-actions .button{min-width:0;padding-inline:10px;font-size:12px;gap:10px}
  .hero--portrait .hero-locations{margin-top:13px}
  .hero-portrait{width:260px;max-width:88%;margin:0 auto;justify-self:center}
  .hero-portrait figcaption{padding:7px 14px;font-size:9px;bottom:-2px}
  .hero--portrait .hero-art{opacity:.58}
  .hero--portrait .hero-art::after{background:linear-gradient(180deg,#faf8f4e8 0%,#faf8f4bf 36%,#faf8f440 62%,#faf8f41a 85%),linear-gradient(0deg,#faf8f4a6,transparent 26%)}
  .hero--portrait .hero-bottom{padding-block:11px;font-size:7px;gap:10px}
}
@media(max-width:350px){.hero--portrait h1{font-size:31px}.hero--portrait .hero-actions .button{font-size:11px;gap:7px}.hero--portrait .hero-locations{gap:10px;font-size:9px}.hero--portrait .hero-locations span+span::before{margin-right:10px}}
@media(prefers-reduced-motion:reduce){.portrait-halo{animation:none!important}}
