/* Official Tervixa family branding alongside the Wave Muzix app identity. */
.official-mark { position:relative; display:inline-block; width:34px; height:38px; overflow:hidden; background:#fff; border-radius:8px; flex:0 0 auto; }
.official-mark>img { position:absolute; max-width:none; width:250%; height:auto; left:-75%; top:-22.7%; }
.official-mark-parent>img { width:150%; left:-31%; top:-22%; }
.product-maker { display:inline-flex; align-items:center; gap:12px; margin-top:25px; font-size:11px; color:var(--muted); transition:color .25s; }
.product-maker strong { display:block; font-size:12px; font-weight:600; color:var(--ink); }
.product-maker .maker-arrow { margin-left:8px; font-size:18px; color:var(--lime); transition:transform .3s var(--ease); }
.product-maker:hover { color:var(--ink); }
.product-maker:hover .maker-arrow { transform:translate(3px,-3px); }
.official-brand-intro { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:8%; align-items:center; padding-block:65px 50px; }
.official-brand-visual { width:100%; max-width:400px; margin:0; overflow:hidden; border-radius:22px; background:#fff; box-shadow:0 22px 70px #0002; transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .4s var(--ease); }
.official-brand-visual>img { width:100%; height:auto; }
.official-brand-copy h2 { font-size:clamp(34px,4vw,56px); }
.official-brand-copy>p:not(.eyebrow) { color:var(--muted); margin-top:22px; max-width:500px; }
.official-brand-copy .actions { margin-top:28px; }
.official-family { padding-block:65px 85px; }
.official-family-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:28px; }
.official-family-heading .eyebrow { margin-bottom:12px; }
.official-family-heading h2 { font-size:clamp(30px,3.6vw,48px); }
.official-family figure { margin:0; }
.official-banner-link { display:block; overflow:hidden; border-radius:20px; border:1px solid #ffffff1a; background:#fff; }
.official-banner-link>img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; transition:transform .6s var(--ease); }
.official-banner-link:hover>img { transform:scale(1.008); }
.official-family figcaption { color:var(--muted); font:10px/1.8 var(--mono); margin-top:15px; }
.family-credits { display:flex; flex-wrap:wrap; align-items:center; gap:18px 45px; padding-block:28px; border-top:1px solid var(--line); margin-top:45px; }
.family-credits>a { display:flex; align-items:center; gap:12px; font-size:11px; color:var(--muted); }
.family-credits strong { display:block; color:var(--ink); font-size:12px; font-weight:600; }
.family-credits>a>b { font-weight:400; color:var(--lime); transition:transform .3s; }
.family-credits>a:hover>b { transform:translate(3px,-3px); }
@media(max-width:700px) {
  .product-maker { font-size:10px; margin-top:23px; }
  .official-brand-intro { grid-template-columns:1fr; gap:32px; padding-block:35px 40px; }
  .official-brand-visual { max-width:360px; margin-inline:auto; }
  .official-brand-copy h2 { font-size:38px; }
  .official-brand-copy>p:not(.eyebrow) { font-size:13px; }
  .official-family { padding-block:40px 55px; }
  .official-family-heading { display:block; }
  .official-family-heading .text-link { margin-top:18px; }
  .official-banner-link { border-radius:10px; }
  .official-family figcaption { font-size:9px; }
  .family-credits { gap:25px; margin-top:30px; }
  .family-credits>a { width:100%; }
}
@media(prefers-reduced-motion:reduce) { .official-brand-visual,.official-banner-link>img,.product-maker .maker-arrow,.family-credits>a>b { transform:none!important; transition:none!important; } }
[data-motion=off] .official-brand-visual,[data-motion=off] .official-banner-link>img,[data-motion=off] .product-maker .maker-arrow,[data-motion=off] .family-credits>a>b { transform:none!important; transition:none!important; }
