:root{
  --section-x:clamp(24px,5vw,76px);
  --content-max:1440px;
}
body{overflow-x:hidden;background:linear-gradient(180deg,#fbfbfe 0%,#f7f7fc 68%,#fafafe 100%)}
main{position:relative;overflow:hidden}
main::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 84% 12%,rgba(149,148,210,.07),transparent 23%),radial-gradient(circle at 9% 42%,rgba(149,148,210,.05),transparent 19%),radial-gradient(circle at 77% 74%,rgba(149,148,210,.045),transparent 22%);z-index:0}
main>section{position:relative;z-index:1}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .72s cubic-bezier(.2,.7,.2,1),transform .72s cubic-bezier(.2,.7,.2,1)}
.reveal.is-visible{opacity:1;transform:none}
.delay-1{transition-delay:.08s}.delay-2{transition-delay:.15s}.delay-3{transition-delay:.22s}

/* HERO */
.hero{
  min-height:690px;
  display:flex;align-items:center;
  padding:62px var(--section-x) 66px;
  background:linear-gradient(180deg,#fbfbfe 0%,#f8f8fd 100%);
}
.hero-shell{
  width:min(100%,var(--content-max));margin:0 auto;
  display:grid;grid-template-columns:minmax(420px,.92fr) minmax(620px,1.08fr);
  gap:clamp(18px,2.1vw,34px);align-items:center;
}
.hero-copy{position:relative;z-index:5;max-width:560px}
.hero-copy .eyebrow{margin-bottom:15px}
.hero-copy h1{margin:0;max-width:560px;font-size:clamp(62px,5.15vw,84px);line-height:.92;letter-spacing:-.063em;font-weight:790;color:var(--vq-ink)}
.hero-copy h1 span{display:block}.hero-focus{color:var(--vq-purple);margin:.07em 0 .08em}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}

.hero-stage{position:relative;min-height:510px;isolation:isolate;margin-left:-12px}
.hero-glow{position:absolute;z-index:0;width:76%;height:78%;right:3%;top:8%;border-radius:50%;background:radial-gradient(circle at 48% 46%,rgba(255,255,255,.96) 0 27%,rgba(224,222,251,.58) 52%,rgba(149,148,210,.12) 68%,transparent 72%);filter:blur(.2px)}
.hero-arc{position:absolute;z-index:0;border:1px solid rgba(149,148,210,.23);border-radius:50%;pointer-events:none}
.arc-1{width:69%;height:71%;right:0;top:2%;transform:rotate(-10deg)}
.arc-2{width:58%;height:57%;right:4%;top:12%;transform:rotate(-12deg);border-color:rgba(149,148,210,.15)}
.arc-3{width:42%;height:43%;right:10%;top:23%;transform:rotate(-14deg);border-color:rgba(149,148,210,.11)}
.hero-line{position:absolute;z-index:0;width:52%;height:1px;right:-2%;bottom:11%;background:linear-gradient(90deg,transparent,rgba(149,148,210,.34),transparent);transform:rotate(-3deg);transform-origin:right center}
.hero-device,.hero-pets,.hero-strips{position:absolute;display:block;height:auto;pointer-events:none;user-select:none}
.hero-device{z-index:2;width:28%;max-width:230px;right:18%;top:9%;filter:drop-shadow(0 18px 30px rgba(54,56,92,.11))}
.hero-pets{z-index:3;width:72%;max-width:585px;left:2%;bottom:3%;filter:drop-shadow(0 14px 24px rgba(54,56,92,.09))}
.hero-strips{z-index:4;width:13%;max-width:96px;right:4%;bottom:15%;filter:drop-shadow(0 10px 18px rgba(54,56,92,.08))}

/* PRODUCTS */
.products-section{padding:88px var(--section-x) 96px;background:linear-gradient(180deg,rgba(248,248,253,.72),rgba(247,247,252,.96))}
.products-wrap{width:min(100%,var(--content-max));margin:0 auto}
.section-heading{max-width:860px;margin-bottom:52px}.section-heading h2{margin:0;font-size:clamp(44px,4vw,64px);line-height:.98;letter-spacing:-.05em;font-weight:780;color:var(--vq-ink)}
.product-category{scroll-margin-top:96px}.product-category+.product-category{margin-top:68px}
.category-heading{display:flex;align-items:center;gap:14px;padding-bottom:17px;margin-bottom:24px;border-bottom:1px solid var(--vq-line)}
.category-index{font-size:10px;font-weight:850;letter-spacing:.12em;color:var(--vq-purple)}
.category-heading h3{margin:0;font-size:30px;line-height:1;letter-spacing:-.035em}
.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 22px}
.product-grid-livestock{grid-template-columns:repeat(4,minmax(0,1fr))}
.product-tile{min-width:0;display:flex;flex-direction:column;color:inherit;position:relative}
.product-visual{position:relative;aspect-ratio:1.15/1;display:grid;place-items:center;padding:18px;overflow:hidden;border-radius:23px;background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(250,250,253,.75));border:1px solid rgba(74,76,122,.08);box-shadow:0 9px 28px rgba(49,51,88,.025);transition:transform .28s cubic-bezier(.2,.7,.2,1),border-color .28s ease,box-shadow .28s ease,background .28s ease}
.product-visual::before{content:"";position:absolute;inset:auto 14% 6px 14%;height:18px;background:radial-gradient(ellipse at center,rgba(54,56,92,.08),transparent 72%);filter:blur(11px);opacity:.3;transition:opacity .25s ease}
.product-visual img{position:relative;z-index:1;width:auto;height:auto;max-width:88%;max-height:88%;object-fit:contain;object-position:center;transition:transform .28s cubic-bezier(.2,.7,.2,1),filter .28s ease;filter:drop-shadow(0 9px 14px rgba(45,47,80,.045))}
.product-tile:hover .product-visual{transform:translateY(-3px);border-color:rgba(149,148,210,.28);box-shadow:0 17px 34px rgba(49,51,88,.07);background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,246,252,.9))}
.product-tile:hover .product-visual::before{opacity:.52}.product-tile:hover .product-visual img{transform:translateY(-4px);filter:drop-shadow(0 14px 18px rgba(45,47,80,.08))}
.product-kicker{margin-top:15px;margin-bottom:7px;font-size:8px;font-weight:850;letter-spacing:.18em;text-transform:uppercase;color:var(--vq-purple-deep)}
.product-tile h4{margin:0;font-size:15px;line-height:1.34;letter-spacing:-.018em;font-weight:760;color:#34365f;min-height:40px}
.product-link{margin-top:16px;padding-top:12px;border-top:1px solid var(--vq-line);display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:740;color:#6d6f92}
.product-link b{font-size:13px;font-weight:500;transition:transform .2s ease}.product-tile:hover .product-link b{transform:translate(2px,-2px)}
.product-tile[data-product="vqpet-h"] .product-visual img{max-width:76%;max-height:82%}
.product-tile[data-product="translator"] .product-visual img{max-width:79%;max-height:78%}
.product-tile[data-product="rapid"] .product-visual img{max-width:72%;max-height:83%}
.product-tile[data-product="fia"] .product-visual img{max-width:84%;max-height:79%}
.product-tile[data-product="biochem"] .product-visual img{max-width:72%;max-height:82%}
.product-tile[data-product="coag"] .product-visual img{max-width:76%;max-height:82%}
.product-tile[data-product="stetho"] .product-visual img{max-width:80%;max-height:76%}
.product-tile[data-product="sound"] .product-visual img{max-width:68%;max-height:74%}
.product-tile[data-product="cow"] .product-visual img{max-width:78%;max-height:82%}
.product-tile[data-product="farm"] .product-visual img{max-width:84%;max-height:80%}

.materials-inline{margin-top:62px;padding:23px 0 0;border-top:1px solid var(--vq-line);display:flex;align-items:center;justify-content:space-between;gap:26px}
.materials-inline .eyebrow{margin-bottom:6px}.materials-inline strong{font-size:15px;line-height:1.45}.materials-inline-button{border:0;background:none;color:#4d507a;font-weight:760;font-size:13px;cursor:pointer;padding:10px 0;white-space:nowrap}.materials-inline-button span{display:inline-block;margin-left:6px;transition:transform .2s ease}.materials-inline-button:hover span{transform:translate(2px,-2px)}

/* ABOUT */
.about-section{padding:102px var(--section-x) 106px;background:linear-gradient(180deg,#f6f6fb 0%,#f7f7fc 100%);overflow:hidden}
.about-section::before{content:"";position:absolute;right:-15%;top:6%;width:44vw;height:44vw;max-width:700px;max-height:700px;border:1px solid rgba(149,148,210,.11);border-radius:50%;pointer-events:none}
.about-section::after{content:"";position:absolute;left:-18%;bottom:-32%;width:42vw;height:42vw;border:1px solid rgba(149,148,210,.08);border-radius:50%;pointer-events:none}
.about-wrap{width:min(100%,var(--content-max));margin:0 auto;position:relative;z-index:1}
.about-heading{max-width:900px;margin-bottom:56px}.about-heading .eyebrow{margin-bottom:14px}.about-heading h2{margin:0;font-size:clamp(44px,4.3vw,66px);line-height:.98;letter-spacing:-.05em;font-weight:780;max-width:850px}
.about-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:72px;align-items:start}.about-copy{max-width:780px}.about-copy p,.about-heritage p{margin:0 0 18px;color:#646781;font-size:16px;line-height:1.75}.about-copy p:last-child,.about-heritage p:last-child{margin-bottom:0}
.about-heritage{position:relative;padding-left:28px}.heritage-line{position:absolute;left:0;top:2px;bottom:2px;width:1px;background:linear-gradient(180deg,var(--vq-purple),rgba(149,148,210,.08));transform-origin:top;transform:scaleY(.2);transition:transform .9s cubic-bezier(.2,.7,.2,1)}.about-heritage.is-visible .heritage-line{transform:scaleY(1)}
.about-heritage-title{font-weight:800!important;color:var(--vq-ink)!important}.about-heritage a{color:var(--vq-purple-deep);font-weight:760;border-bottom:1px solid rgba(119,118,195,.28)}
.brand-principles{margin-top:62px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(149,148,210,.42);border-bottom:1px solid var(--vq-line)}
.brand-principle{position:relative;min-height:178px;padding:30px 34px 32px;overflow:hidden}.brand-principle+.brand-principle{border-left:1px solid var(--vq-line)}
.brand-principle::after{content:"";position:absolute;left:34px;right:34px;top:-1px;height:2px;background:var(--vq-purple);transform:scaleX(0);transform-origin:left;transition:transform .72s cubic-bezier(.2,.7,.2,1)}.brand-principles.is-visible .brand-principle::after{transform:scaleX(1)}.brand-principles.is-visible .brand-principle:nth-child(2)::after{transition-delay:.12s}.brand-principles.is-visible .brand-principle:nth-child(3)::after{transition-delay:.24s}
.principle-no{display:block;font-size:10px;font-weight:850;letter-spacing:.14em;color:var(--vq-purple);margin-bottom:22px}.principle-label{display:block;font-size:9px;font-weight:850;letter-spacing:.16em;text-transform:uppercase;color:#8b8da5;margin-bottom:9px}.brand-principle strong{display:block;max-width:360px;font-size:15px;line-height:1.5;color:#373963}.brand-principle .principle-no::after{content:"";position:absolute;right:24px;bottom:-24px;font-size:88px;line-height:1;font-weight:850;color:rgba(149,148,210,.055)}
.brand-principle:nth-child(1) .principle-no::after{content:"01"}.brand-principle:nth-child(2) .principle-no::after{content:"02"}.brand-principle:nth-child(3) .principle-no::after{content:"03"}

/* NEWS */
.news-section{padding:96px var(--section-x) 100px;background:linear-gradient(180deg,#f7f7fc 0%,#fafafe 100%)}
.news-wrap{width:min(100%,var(--content-max));margin:0 auto}.news-section .section-heading{margin-bottom:34px}.news-grid,.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.news-card,.event-card{overflow:hidden;border:1px solid rgba(74,76,122,.09);border-radius:24px;background:rgba(255,255,255,.76);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.news-card:hover,.event-card:hover{transform:translateY(-3px);border-color:rgba(149,148,210,.26);box-shadow:0 16px 34px rgba(50,51,89,.06)}
.news-card img{width:100%;aspect-ratio:1.72/1;object-fit:cover}.news-card>div{padding:20px 22px 22px}.news-card time,.event-card time{display:block;font-size:9px;font-weight:830;letter-spacing:.13em;text-transform:uppercase;color:var(--vq-purple-deep)}.news-card h3,.event-card h3{margin:8px 0 13px;font-size:18px;line-height:1.35;letter-spacing:-.022em}.news-card span{font-size:11px;font-weight:740;color:#707297}
.event-grid{margin-top:18px}.event-card{display:grid;grid-template-columns:170px 1fr;align-items:center;min-height:170px}.event-media{display:grid;place-items:center;padding:24px;min-height:170px;background:rgba(255,255,255,.78);border-right:1px solid rgba(74,76,122,.08)}.event-media img{max-width:126px;max-height:92px;object-fit:contain}.event-copy{padding:22px}.event-copy h3{margin-bottom:7px}.event-copy p{margin:0;color:#72748d;font-size:12px;line-height:1.55}

/* CONTACT */
.contact-section{width:min(calc(100% - (var(--section-x) * 2)),var(--content-max));margin:0 auto 100px;padding:48px 52px;display:grid;grid-template-columns:1fr 1.08fr .76fr;gap:52px;align-items:start;border:1px solid rgba(74,76,122,.10);border-radius:28px;background:rgba(255,255,255,.76);box-shadow:0 16px 48px rgba(49,51,88,.04)}
.contact-copy h2{margin:0 0 16px;font-size:clamp(36px,3vw,50px);line-height:1;letter-spacing:-.045em}.contact-copy>p:not(.eyebrow){margin:0 0 22px;color:#72748d;line-height:1.65;font-size:13px}
.contact-details{display:grid;gap:13px}.contact-details>div{padding-bottom:12px;border-bottom:1px solid var(--vq-line)}.contact-details span{display:block;margin-bottom:5px;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:#8b8da5;font-weight:840}.contact-details a,.contact-details strong{font-size:12px;line-height:1.55;color:#40436c}.contact-materials{display:grid;grid-template-columns:112px 1fr;gap:17px;align-items:center}.contact-materials img{width:112px;height:112px;border-radius:12px}.contact-materials strong{display:block;font-size:14px}.contact-materials p{margin:6px 0 9px;color:#767890;font-size:11px;line-height:1.5}.contact-materials button{border:0;padding:0;background:none;color:var(--vq-purple-deep);font-size:11px;font-weight:760;cursor:pointer}

/* RESPONSIVE */
@media(max-width:1180px){
  .hero-shell{grid-template-columns:minmax(360px,.9fr) minmax(500px,1.1fr)}
  .hero-copy h1{font-size:clamp(58px,6vw,76px)}
  .hero-stage{min-height:460px}
  .product-grid{gap:28px 18px}.product-visual{padding:14px}
  .contact-section{grid-template-columns:1fr 1fr;gap:36px}.contact-materials{grid-column:1/-1;max-width:430px}
}
@media(max-width:920px){
  .hero{min-height:auto;padding-top:52px}.hero-shell{grid-template-columns:1fr;gap:26px}.hero-copy{max-width:650px}.hero-copy h1{max-width:620px;font-size:clamp(54px,8vw,72px)}
  .hero-stage{min-height:420px;width:min(100%,700px);margin:0 auto}.hero-device{width:26%;right:19%;top:8%}.hero-pets{width:68%;left:6%;bottom:3%}.hero-strips{width:12%;right:7%;bottom:16%}.hero-glow{width:72%;right:3%}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 18px}.product-grid-livestock{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-heading{margin-bottom:38px}.about-heading .eyebrow{margin-bottom:12px}.about-layout{grid-template-columns:1fr;gap:32px}.about-heritage{max-width:720px}.brand-principles{grid-template-columns:1fr}.brand-principle+.brand-principle{border-left:0;border-top:1px solid var(--vq-line)}
  .news-grid,.event-grid{grid-template-columns:1fr}.event-card{grid-template-columns:150px 1fr}
}
@media(max-width:620px){
  .hero{padding:38px 18px 48px}.hero-copy .eyebrow{font-size:8px;margin-bottom:10px}.hero-copy h1{font-size:clamp(44px,12.4vw,56px);line-height:.94;letter-spacing:-.055em}.hero-actions{margin-top:20px;gap:9px}.hero-actions .button{min-height:42px;padding:0 16px;font-size:12px}
  .hero-stage{min-height:300px;margin-top:4px}.hero-glow{width:81%;height:80%;right:-3%;top:5%}.arc-1{width:78%;height:75%;right:-6%}.arc-2{width:63%;height:59%;right:0}.arc-3{display:none}.hero-device{width:28%;right:17%;top:11%;max-width:none}.hero-pets{width:74%;left:3%;bottom:5%;max-width:none}.hero-strips{width:13%;right:3%;bottom:18%;max-width:none}.hero-line{width:58%;right:-10%;bottom:12%}
  .products-section,.about-section,.news-section{padding-left:18px;padding-right:18px}.products-section{padding-top:64px;padding-bottom:72px}.section-heading{margin-bottom:36px}.section-heading h2{font-size:clamp(38px,10.5vw,48px)}.product-category+.product-category{margin-top:50px}.category-heading{margin-bottom:18px}.category-heading h3{font-size:25px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}.product-visual{aspect-ratio:1/1;padding:10px;border-radius:18px}.product-kicker{margin-top:11px;font-size:7px}.product-tile h4{font-size:12px;line-height:1.35;min-height:0}.product-link{font-size:10px;padding-top:10px;margin-top:12px}.product-tile[data-product] .product-visual img{max-width:86%;max-height:84%}
  .materials-inline{margin-top:46px;align-items:flex-start;flex-direction:column;gap:4px}.materials-inline strong{font-size:13px}.materials-inline-button{font-size:12px}
  .about-section{padding-top:76px;padding-bottom:78px}.about-heading h2{font-size:clamp(38px,10vw,48px)}.about-copy p,.about-heritage p{font-size:14px;line-height:1.72}.about-heritage{padding-left:20px}.brand-principles{margin-top:44px}.brand-principle{padding:24px 22px;min-height:146px}.brand-principle::after{left:22px;right:22px}.brand-principle strong{font-size:14px}
  .news-section{padding-top:74px;padding-bottom:76px}.news-card>div{padding:18px}.event-card{grid-template-columns:112px 1fr;min-height:140px}.event-media{min-height:140px;padding:14px}.event-media img{max-width:92px;max-height:72px}.event-copy{padding:16px}.event-card h3{font-size:16px}
  .contact-section{width:calc(100% - 36px);margin-bottom:70px;padding:30px 22px;grid-template-columns:1fr;gap:28px;border-radius:22px}.contact-materials{grid-column:auto;grid-template-columns:96px 1fr}.contact-materials img{width:96px;height:96px}
}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.product-visual,.product-visual img,.product-link b,.brand-principle::after{transition:none!important}}

/* v81 refresh — preserve approved layout, rebuild hero and product showcase */
body{
  background:#f7f6fb;
}
main{
  background:linear-gradient(180deg,#fbfbfe 0%,#f7f6fb 34%,#fafafe 100%);
}
main::before{
  background:
    radial-gradient(circle at 88% 10%,rgba(149,148,210,.075),transparent 18%),
    radial-gradient(circle at 6% 38%,rgba(149,148,210,.04),transparent 15%),
    radial-gradient(circle at 91% 70%,rgba(149,148,210,.055),transparent 17%);
}

.hero{
  min-height:700px;
  padding:70px var(--section-x) 80px;
  background:transparent;
}
.hero-shell{
  grid-template-columns:minmax(420px,.9fr) minmax(620px,1.1fr);
  gap:clamp(24px,2.8vw,48px);
}
.hero-copy{
  max-width:570px;
}
.hero-copy h1{
  max-width:580px;
}
.hero-stage{
  min-height:560px;
  margin-left:0;
}
.hero-stage::before{
  content:"";
  position:absolute;
  right:1%;
  top:6%;
  width:84%;
  height:84%;
  border-radius:44px;
  background:
    radial-gradient(circle at 44% 38%,rgba(255,255,255,.94) 0 22%,rgba(233,231,248,.78) 42%,rgba(149,148,210,.16) 63%,rgba(149,148,210,0) 72%),
    linear-gradient(180deg,rgba(255,255,255,.36),rgba(255,255,255,.08));
  pointer-events:none;
  z-index:0;
}
.hero-stage::after{
  content:"";
  position:absolute;
  right:-2%;
  top:3%;
  width:90%;
  height:88%;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 78% 42%,transparent 0 44%,rgba(149,148,210,.14) 44.5% 45%,transparent 45.6%),
    radial-gradient(ellipse at 81% 45%,transparent 0 33%,rgba(149,148,210,.1) 33.5% 34%,transparent 34.6%),
    radial-gradient(ellipse at 85% 47%,transparent 0 23%,rgba(149,148,210,.075) 23.5% 24%,transparent 24.6%);
  pointer-events:none;
  z-index:0;
  opacity:.9;
}
.hero-glow{
  width:62%;
  height:68%;
  right:12%;
  top:16%;
  background:radial-gradient(circle at 48% 44%,rgba(255,255,255,.98) 0 30%,rgba(228,225,248,.6) 54%,rgba(149,148,210,.08) 70%,transparent 74%);
}
.hero-arc{
  right:-1%;
  border-color:rgba(149,148,210,.14);
}
.arc-1{width:65%;height:73%;top:1%;transform:rotate(-8deg)}
.arc-2{width:52%;height:58%;top:12%;right:4%;transform:rotate(-9deg);border-color:rgba(149,148,210,.11)}
.arc-3{width:39%;height:43%;top:22%;right:10%;transform:rotate(-10deg);border-color:rgba(149,148,210,.08)}
.hero-line,
.hero-strips{
  display:none !important;
}
.hero-device,
.hero-pets{
  filter:drop-shadow(0 20px 34px rgba(49,51,88,.11));
}
.hero-device{
  z-index:2;
  width:26%;
  max-width:250px;
  right:12%;
  top:14%;
}
.hero-pets{
  z-index:3;
  width:76%;
  max-width:680px;
  left:-1%;
  bottom:0;
}

.products-section{
  position:relative;
  padding-top:92px;
  padding-bottom:102px;
  background:transparent;
}
.products-section::before{
  content:"";
  position:absolute;
  top:38px;
  right:-12%;
  width:36vw;
  height:36vw;
  max-width:560px;
  max-height:560px;
  border-radius:50%;
  border:1px solid rgba(149,148,210,.08);
  pointer-events:none;
}
.products-section::after{
  content:"";
  position:absolute;
  left:-10%;
  bottom:3%;
  width:24vw;
  height:24vw;
  max-width:360px;
  max-height:360px;
  border-radius:50%;
  background:radial-gradient(circle at center,rgba(149,148,210,.05),transparent 68%);
  pointer-events:none;
}
.section-heading{
  margin-bottom:58px;
}
.product-grid{
  gap:38px 22px;
}
.product-tile{
  position:relative;
}
.product-visual{
  aspect-ratio:1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border-radius:28px;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(251,251,254,.88));
  border:1px solid rgba(74,76,122,.08);
  box-shadow:0 12px 32px rgba(49,51,88,.035);
}
.product-visual::before{
  display:none;
}
.product-visual::after{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:22px;
  border:1px solid rgba(149,148,210,.07);
  opacity:0;
  transition:opacity .28s ease;
  pointer-events:none;
}
.product-visual img{
  width:84%;
  height:84%;
  max-width:none;
  max-height:none;
  object-fit:contain;
  object-position:center;
  filter:none;
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.product-tile:hover .product-visual{
  transform:translateY(-4px);
  border-color:rgba(149,148,210,.24);
  box-shadow:0 18px 38px rgba(49,51,88,.065);
  background:linear-gradient(180deg,#fff,rgba(248,247,252,.96));
}
.product-tile:hover .product-visual::after{
  opacity:1;
}
.product-tile:hover .product-visual img{
  transform:scale(1.02);
  filter:none;
}
.product-kicker{
  margin-top:16px;
}
.product-tile h4{
  min-height:46px;
  font-size:16px;
  line-height:1.35;
}
.product-link{
  margin-top:18px;
}
.product-tile[data-product="vqpet-h"] .product-visual img{width:88%;height:88%}
.product-tile[data-product="translator"] .product-visual img{width:82%;height:82%}
.product-tile[data-product="rapid"] .product-visual img{width:82%;height:82%}
.product-tile[data-product="fia"] .product-visual img{width:88%;height:88%}
.product-tile[data-product="biochem"] .product-visual img{width:78%;height:78%}
.product-tile[data-product="coag"] .product-visual img{width:80%;height:80%}
.product-tile[data-product="stetho"] .product-visual img{width:86%;height:86%}
.product-tile[data-product="sound"] .product-visual img{width:78%;height:78%}
.product-tile[data-product="cow"] .product-visual img{width:90%;height:90%}
.product-tile[data-product="farm"] .product-visual img{width:88%;height:88%}

@media(max-width:1180px){
  .hero-stage{min-height:500px}
  .hero-device{width:25%;right:12%;top:16%}
  .hero-pets{width:74%;left:1%}
  .product-grid{gap:30px 18px}
  .product-tile h4{font-size:15px;min-height:44px}
}
@media(max-width:920px){
  .hero{padding-top:56px;padding-bottom:62px}
  .hero-shell{grid-template-columns:1fr;gap:28px}
  .hero-copy{max-width:660px}
  .hero-copy h1{font-size:clamp(54px,8vw,72px)}
  .hero-stage{width:min(100%,720px);min-height:430px;margin:0 auto}
  .hero-stage::before{right:6%;width:74%;height:80%;top:8%}
  .hero-stage::after{right:1%;width:82%;height:84%}
  .hero-glow{width:60%;height:65%;right:16%;top:20%}
  .hero-device{width:24%;right:14%;top:16%}
  .hero-pets{width:70%;left:4%;bottom:2%}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}
}
@media(max-width:620px){
  .hero{padding:40px 18px 46px}
  .hero-copy h1{font-size:clamp(44px,12vw,56px);line-height:.94}
  .hero-stage{min-height:318px;margin-top:4px}
  .hero-stage::before{right:2%;top:10%;width:82%;height:76%;border-radius:30px}
  .hero-stage::after{right:-2%;top:10%;width:92%;height:78%}
  .hero-glow{width:68%;height:60%;right:12%;top:20%}
  .hero-arc{border-color:rgba(149,148,210,.1)}
  .arc-1{width:74%;height:72%;right:-8%;top:8%}
  .arc-2{width:58%;height:56%;right:0;top:18%}
  .arc-3{display:none}
  .hero-device{width:27%;right:9%;top:18%;max-width:none}
  .hero-pets{width:78%;left:0;bottom:0;max-width:none}
  .products-section{padding-top:66px;padding-bottom:76px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
  .product-visual{border-radius:20px}
  .product-visual::after{inset:8px;border-radius:16px}
  .product-visual img{width:86%;height:86%}
  .product-tile h4{font-size:12px;min-height:0}
}

.product-grid-livestock{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}

/* ========================================================================== */
/* V82 — hero + homepage product image refresh                                */
/* Keeps the approved V81 page structure. Only the homepage hero and homepage */
/* product presentation are visually rebuilt. Product-detail pages unchanged. */
/* ========================================================================== */

/* HERO: calm 50/50 editorial composition, centered within laptop viewport */
.hero{
  min-height:720px;
  padding:58px var(--section-x) 72px;
  background:
    linear-gradient(180deg,#fbfbfe 0%,#f8f8fc 100%);
}
.hero-shell{
  width:min(100%,1320px);
  grid-template-columns:minmax(430px,.94fr) minmax(560px,1.06fr);
  gap:clamp(22px,3vw,54px);
  align-items:center;
}
.hero-copy{
  max-width:585px;
  justify-self:end;
  padding-left:clamp(0px,1vw,12px);
}
.hero-copy .eyebrow{
  margin-bottom:17px;
}
.hero-copy h1{
  max-width:590px;
  font-size:clamp(66px,5.35vw,88px);
  line-height:.94;
  letter-spacing:-.061em;
}
.hero-actions{
  margin-top:30px;
}

.hero-stage{
  position:relative;
  isolation:isolate;
  min-height:555px;
  width:100%;
  max-width:700px;
  justify-self:start;
  margin:0;
  overflow:visible;
}

/* The atmosphere is intentionally very pale: white first, brand purple second. */
.hero-stage::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:7% -1% 4% 0;
  border-radius:48% 52% 46% 54% / 53% 44% 56% 47%;
  background:
    radial-gradient(ellipse at 58% 46%,
      rgba(255,255,255,.98) 0 26%,
      rgba(247,246,252,.96) 45%,
      rgba(149,148,210,.075) 67%,
      rgba(149,148,210,0) 80%);
  filter:blur(.2px);
  pointer-events:none;
}
.hero-stage::after{
  content:"";
  position:absolute;
  z-index:0;
  width:76%;
  height:68%;
  right:2%;
  top:13%;
  border-radius:50%;
  border:1px solid rgba(149,148,210,.085);
  opacity:.55;
  pointer-events:none;
}
.hero-atmosphere{
  position:absolute;
  z-index:0;
  width:54%;
  height:42%;
  right:9%;
  top:20%;
  border-radius:50%;
  background:radial-gradient(circle at center,rgba(149,148,210,.055),transparent 68%);
  pointer-events:none;
}

/* Previous swirl/arc system is retired in V82. */
.hero-glow,.hero-arc,.hero-line,.hero-strips{display:none!important}

.hero-pets{
  z-index:3;
  width:86%;
  max-width:650px;
  left:3%;
  bottom:0;
  filter:drop-shadow(0 18px 30px rgba(48,49,80,.07));
}
.hero-device{
  z-index:2;
  width:21%;
  max-width:164px;
  right:auto;
  left:58%;
  top:20%;
  transform:translateX(-50%);
  filter:drop-shadow(0 13px 23px rgba(69,62,105,.10));
}

/* HOME PRODUCT GRID: use clean 1:1 white-background homepage assets edge-to-edge. */
.product-grid{
  gap:40px 22px;
}
.product-visual{
  aspect-ratio:1 / 1;
  padding:0;
  overflow:hidden;
  border-radius:26px;
  background:#fff;
  border:1px solid rgba(69,72,115,.085);
  box-shadow:0 10px 28px rgba(49,51,88,.025);
  transition:transform .28s cubic-bezier(.2,.7,.2,1),border-color .28s ease,box-shadow .28s ease;
}
.product-visual::before,
.product-visual::after{
  display:none!important;
}
.product-visual img,
.product-tile[data-product] .product-visual img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  background:#fff;
  filter:none!important;
  transform:none;
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
}
.product-tile:hover .product-visual{
  transform:translateY(-3px);
  border-color:rgba(149,148,210,.23);
  box-shadow:0 16px 34px rgba(49,51,88,.055);
  background:#fff;
}
.product-tile:hover .product-visual img{
  transform:scale(1.012);
  filter:none!important;
}

/* Laptop: make both columns move inward rather than simply shrinking. */
@media(max-width:1280px){
  .hero{
    min-height:650px;
    padding-top:48px;
    padding-bottom:58px;
  }
  .hero-shell{
    width:min(100%,1140px);
    grid-template-columns:minmax(390px,.95fr) minmax(500px,1.05fr);
    gap:22px;
  }
  .hero-copy{
    max-width:515px;
    justify-self:center;
    padding-left:0;
  }
  .hero-copy h1{
    font-size:clamp(58px,5.5vw,72px);
  }
  .hero-stage{
    min-height:490px;
    max-width:610px;
    justify-self:center;
  }
  .hero-pets{width:88%;left:2%}
  .hero-device{width:20%;left:58%;top:20%}
}

/* Tablet */
@media(max-width:920px){
  .hero{
    min-height:auto;
    padding-top:48px;
    padding-bottom:58px;
  }
  .hero-shell{
    width:min(100%,740px);
    grid-template-columns:1fr;
    gap:22px;
  }
  .hero-copy{
    max-width:650px;
    justify-self:start;
  }
  .hero-copy h1{
    max-width:620px;
    font-size:clamp(54px,8vw,72px);
  }
  .hero-stage{
    width:min(100%,690px);
    max-width:690px;
    min-height:410px;
    margin:0 auto;
  }
  .hero-stage::before{inset:4% 0 1% 1%}
  .hero-stage::after{width:70%;height:68%;right:2%;top:10%}
  .hero-pets{width:82%;left:6%;bottom:0}
  .hero-device{width:19%;left:59%;top:17%}
}

/* Mobile: copy first, visual second, with the visual using almost the full width. */
@media(max-width:620px){
  .hero{
    padding:38px 18px 44px;
    background:linear-gradient(180deg,#fbfbfe 0%,#f8f8fc 100%);
  }
  .hero-shell{
    width:100%;
    gap:24px;
  }
  .hero-copy{
    max-width:none;
  }
  .hero-copy h1{
    max-width:100%;
    font-size:clamp(46px,12.4vw,58px);
    line-height:.95;
  }
  .hero-actions{
    margin-top:22px;
  }
  .hero-stage{
    width:100%;
    min-height:305px;
    margin:0;
  }
  .hero-stage::before{
    inset:1% -5% 0 -2%;
    border-radius:46% 54% 48% 52% / 52% 45% 55% 48%;
  }
  .hero-stage::after{
    width:78%;
    height:70%;
    right:-5%;
    top:8%;
    opacity:.35;
  }
  .hero-atmosphere{
    width:62%;
    height:48%;
    right:1%;
    top:17%;
  }
  .hero-pets{
    width:94%;
    max-width:none;
    left:-1%;
    bottom:0;
  }
  .hero-device{
    width:19%;
    max-width:none;
    left:59%;
    top:15%;
  }
  .product-grid{
    gap:24px 12px;
  }
  .product-visual{
    border-radius:19px;
  }
}

/* V82.1 placement refinement: meter reads as a small product element between
   the dog and cat rather than a floating background object. */
.hero-device{
  z-index:4;
  width:18%;
  max-width:142px;
  left:42%;
  right:auto;
  top:53%;
  transform:translateX(-50%);
}
@media(max-width:1280px){
  .hero-device{width:17%;left:42%;top:53%}
}
@media(max-width:920px){
  .hero-device{width:17%;left:43%;top:51%}
}
@media(max-width:620px){
  .hero-device{width:18%;left:43%;top:50%}
}

/* ========================================================================== */
/* V83 — HERO ONLY                                                            */
/* User-approved direction: one calm pale-lavender canvas, no decorative      */
/* circles / swirls / line art. The animal group is large and immersive,       */
/* while the glucose meter sits naturally between the companion animals.       */
/* Everything below the hero remains exactly as in V82.                        */
/* ========================================================================== */

.hero{
  min-height:700px;
  padding:64px var(--section-x) 72px;
  background:linear-gradient(180deg,#F8F7FC 0%,#F6F5FB 100%);
}
.hero-shell{
  width:min(100%,1320px);
  margin:0 auto;
  grid-template-columns:minmax(430px,.88fr) minmax(610px,1.12fr);
  gap:clamp(20px,2.3vw,40px);
  align-items:center;
}
.hero-copy{
  max-width:570px;
  justify-self:end;
  padding-left:0;
  transform:translateX(8px);
}
.hero-copy .eyebrow{
  margin-bottom:18px;
}
.hero-copy h1{
  max-width:570px;
  font-size:clamp(70px,5.5vw,90px);
  line-height:.93;
  letter-spacing:-.062em;
}
.hero-actions{
  margin-top:30px;
}

.hero-stage{
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:760px;
  min-height:570px;
  justify-self:start;
  margin:0;
  overflow:visible;
}

/* Remove every legacy decorative treatment from the previous hero versions. */
.hero-stage::before,
.hero-stage::after,
.hero-atmosphere,
.hero-glow,
.hero-arc,
.hero-line,
.hero-strips{
  display:none!important;
  content:none!important;
}

/* A single quiet tonal wash behind the subjects. It is intentionally soft and
   has no visible boundary, shape, ring, line or graphic motif. */
.hero-stage{
  background:radial-gradient(
    ellipse at 55% 56%,
    rgba(149,148,210,.095) 0%,
    rgba(149,148,210,.045) 36%,
    rgba(149,148,210,0) 72%
  );
}

.hero-pets{
  position:absolute;
  z-index:3;
  width:101%;
  max-width:760px;
  height:auto;
  left:-1%;
  bottom:2%;
  filter:drop-shadow(0 22px 34px rgba(47,47,76,.055));
}

/* Meter is deliberately larger than V82 and integrated into the animal group.
   It sits in front of the dog/cat area rather than floating in the background. */
.hero-device{
  position:absolute;
  z-index:5;
  width:22%;
  max-width:170px;
  height:auto;
  left:47.5%;
  right:auto;
  top:49%;
  transform:translate(-50%,-50%);
  filter:drop-shadow(0 14px 22px rgba(64,58,104,.10));
}

/* Large laptop / compact desktop: keep both columns pulled toward the center. */
@media(max-width:1280px){
  .hero{
    min-height:650px;
    padding-top:54px;
    padding-bottom:64px;
  }
  .hero-shell{
    width:min(100%,1160px);
    grid-template-columns:minmax(390px,.9fr) minmax(540px,1.1fr);
    gap:18px;
  }
  .hero-copy{
    max-width:500px;
    justify-self:center;
    transform:none;
  }
  .hero-copy h1{
    max-width:520px;
    font-size:clamp(60px,5.6vw,74px);
  }
  .hero-stage{
    max-width:650px;
    min-height:510px;
    justify-self:center;
  }
  .hero-pets{
    width:100%;
    max-width:650px;
    left:0;
  }
  .hero-device{
    width:22%;
    max-width:145px;
    left:47.5%;
    top:49%;
  }
}

/* Tablet: preserve the editorial hierarchy but stack cleanly before the
   composition becomes cramped. */
@media(max-width:920px){
  .hero{
    min-height:auto;
    padding-top:48px;
    padding-bottom:56px;
  }
  .hero-shell{
    width:min(100%,740px);
    grid-template-columns:1fr;
    gap:24px;
  }
  .hero-copy{
    max-width:650px;
    justify-self:start;
  }
  .hero-copy h1{
    max-width:620px;
    font-size:clamp(54px,8vw,72px);
  }
  .hero-stage{
    width:min(100%,700px);
    max-width:700px;
    min-height:440px;
    margin:0 auto;
  }
  .hero-pets{
    width:94%;
    max-width:680px;
    left:3%;
    bottom:0;
  }
  .hero-device{
    width:20%;
    max-width:140px;
    left:48%;
    top:51%;
  }
}

/* Mobile: copy first, scene second. No desktop artwork is squeezed into a tiny
   viewport. The scene stays wide enough to read as one coherent composition. */
@media(max-width:620px){
  .hero{
    min-height:auto;
    padding:38px 18px 44px;
    background:linear-gradient(180deg,#F8F7FC 0%,#F6F5FB 100%);
  }
  .hero-shell{
    width:100%;
    grid-template-columns:1fr;
    gap:24px;
  }
  .hero-copy{
    width:100%;
    max-width:none;
    transform:none;
  }
  .hero-copy h1{
    max-width:100%;
    font-size:clamp(46px,12.4vw,58px);
    line-height:.95;
  }
  .hero-actions{
    margin-top:22px;
  }
  .hero-stage{
    width:100%;
    max-width:none;
    min-height:320px;
    margin:0;
    background:radial-gradient(
      ellipse at 52% 58%,
      rgba(149,148,210,.085) 0%,
      rgba(149,148,210,.035) 38%,
      rgba(149,148,210,0) 72%
    );
  }
  .hero-pets{
    width:98%;
    max-width:none;
    left:1%;
    bottom:0;
  }
  .hero-device{
    width:21%;
    max-width:none;
    left:48%;
    top:52%;
  }
}

/* ========================================================================== */
/* V84 — HERO ONLY                                                            */
/* Full editorial scene: copy on the left, one integrated lifestyle image on  */
/* the right. All product, About, News, inquiry, floating-materials and footer */
/* styles remain untouched from V83.                                          */
/* ========================================================================== */
.hero.hero-v84{
  position:relative;
  min-height:700px;
  padding:0 var(--section-x);
  overflow:hidden;
  isolation:isolate;
  background:#f8f7fc;
}
.hero-v84::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(90deg,
    #f8f7fc 0%,
    #f8f7fc 35%,
    rgba(248,247,252,.96) 43%,
    rgba(248,247,252,.62) 51%,
    rgba(248,247,252,.08) 64%,
    rgba(248,247,252,0) 76%);
}
.hero-v84-media{
  position:absolute;
  z-index:-1;
  top:0;
  right:0;
  width:69%;
  height:100%;
  overflow:hidden;
  pointer-events:none;
}
.hero-v84-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:64% 50%;
}
.hero-v84-shell{
  position:relative;
  z-index:2;
  width:min(100%,1280px);
  min-height:700px;
  margin:0 auto;
  display:flex;
  align-items:center;
}
.hero-v84 .hero-copy{
  width:min(46%,570px);
  max-width:570px;
  justify-self:auto;
  padding:0;
  margin:0;
  transform:translateX(8px);
}
.hero-v84 .hero-copy .eyebrow{
  margin-bottom:18px;
  color:#7776c8;
}
.hero-v84 .hero-copy h1{
  max-width:570px;
  margin:0;
  font-size:clamp(68px,5.25vw,88px);
  line-height:.94;
  letter-spacing:-.061em;
}
.hero-v84 .hero-focus{
  color:#9594D2;
}
.hero-v84 .hero-actions{
  margin-top:31px;
}

/* Laptop: keep the copy and photography close to center, without cropping the
   pet group or pushing the content out of the first viewport. */
@media(max-width:1380px){
  .hero.hero-v84{
    min-height:640px;
    padding-left:clamp(28px,4vw,56px);
    padding-right:clamp(28px,4vw,56px);
  }
  .hero-v84-shell{
    width:min(100%,1140px);
    min-height:640px;
  }
  .hero-v84 .hero-copy{
    width:45%;
    max-width:500px;
    transform:none;
  }
  .hero-v84 .hero-copy h1{
    font-size:clamp(58px,5.35vw,74px);
  }
  .hero-v84-media{
    width:67%;
  }
  .hero-v84-media img{
    object-position:66% 50%;
  }
  .hero-v84::before{
    background:linear-gradient(90deg,
      #f8f7fc 0%,
      #f8f7fc 33%,
      rgba(248,247,252,.95) 42%,
      rgba(248,247,252,.52) 52%,
      rgba(248,247,252,0) 70%);
  }
}

@media(max-width:1040px) and (min-width:751px){
  .hero.hero-v84{
    min-height:590px;
  }
  .hero-v84-shell{
    min-height:590px;
    width:min(100%,930px);
  }
  .hero-v84 .hero-copy{
    width:44%;
    max-width:410px;
  }
  .hero-v84 .hero-copy h1{
    font-size:clamp(50px,5.7vw,62px);
  }
  .hero-v84-media{
    width:68%;
  }
  .hero-v84-media img{
    object-position:68% 50%;
  }
}

/* Mobile: copy first, then the same scene as a full-width visual. The desktop
   image is not squeezed into two columns, so faces and the meter stay readable. */
@media(max-width:750px){
  .hero.hero-v84{
    min-height:auto;
    padding:0;
    display:flex;
    flex-direction:column;
    background:#f8f7fc;
  }
  .hero-v84::before{
    display:none;
  }
  .hero-v84-shell{
    order:1;
    width:100%;
    min-height:0;
    padding:48px 20px 26px;
    display:block;
  }
  .hero-v84 .hero-copy{
    width:100%;
    max-width:560px;
    margin:0 auto;
    transform:none;
  }
  .hero-v84 .hero-copy .eyebrow{
    margin-bottom:13px;
  }
  .hero-v84 .hero-copy h1{
    max-width:100%;
    font-size:clamp(46px,12.4vw,60px);
    line-height:.95;
  }
  .hero-v84 .hero-actions{
    margin-top:23px;
  }
  .hero-v84-media{
    order:2;
    position:relative;
    z-index:1;
    top:auto;
    right:auto;
    width:100%;
    height:clamp(300px,72vw,430px);
    margin:0;
  }
  .hero-v84-media::before{
    content:"";
    position:absolute;
    z-index:2;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,#f8f7fc 0%,rgba(248,247,252,.18) 16%,rgba(248,247,252,0) 38%);
  }
  .hero-v84-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:70% 50%;
  }
}

@media(max-width:420px){
  .hero-v84-shell{
    padding:40px 16px 22px;
  }
  .hero-v84 .hero-copy h1{
    font-size:clamp(43px,12vw,52px);
  }
  .hero-v84-media{
    height:305px;
  }
  .hero-v84-media img{
    object-position:72% 50%;
  }
}

/* ========================================================================== */
/* V87 — HERO ONLY                                                            */
/* One approved 2:1 lifestyle photograph with the meter physically embedded  */
/* in the blanket. All sections below the hero inherit V84 unchanged.         */
/* ========================================================================== */
.hero.hero-v87{
  position:relative;
  min-height:clamp(680px,39vw,840px);
  padding:0 var(--section-x);
  overflow:hidden;
  isolation:isolate;
  background:#f3f0fa;
}
.hero-v87::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,
    #f3f0fa 0%,
    rgba(243,240,250,.99) 23%,
    rgba(243,240,250,.88) 32%,
    rgba(243,240,250,.42) 42%,
    rgba(243,240,250,0) 55%);
}
.hero-v87::after{
  content:"";
  position:absolute;
  z-index:1;
  left:0;
  right:0;
  bottom:0;
  height:86px;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(248,248,253,0),#f8f8fd 100%);
}
.hero-v87-media{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  background:#f3f0fa;
}
.hero-v87-media picture,
.hero-v87-media img{
  display:block;
  width:100%;
  height:100%;
}
.hero-v87-media img{
  object-fit:cover;
  object-position:50% 44%;
}
.hero-v87-shell{
  position:relative;
  z-index:2;
  width:min(100%,1760px);
  min-height:inherit;
  margin:0 auto;
  display:flex;
  align-items:center;
}
.hero-v87 .hero-copy{
  width:min(36%,570px);
  max-width:570px;
  padding:0;
  margin:0;
  transform:none;
}
.hero-v87 .hero-copy .eyebrow{
  margin-bottom:18px;
  color:#7776c8;
}
.hero-v87 .hero-copy h1{
  max-width:570px;
  margin:0;
  font-size:clamp(68px,5vw,88px);
  line-height:.94;
  letter-spacing:-.061em;
}
.hero-v87 .hero-focus{color:#9594d2}
.hero-v87 .hero-actions{margin-top:31px}

@media(max-width:1380px) and (min-width:901px){
  .hero.hero-v87{
    min-height:640px;
    padding-left:clamp(28px,4vw,56px);
    padding-right:clamp(28px,4vw,56px);
  }
  .hero-v87-shell{width:min(100%,1220px)}
  .hero-v87 .hero-copy{
    width:39%;
    max-width:500px;
  }
  .hero-v87 .hero-copy h1{
    font-size:clamp(58px,5.35vw,74px);
  }
  .hero-v87-media img{object-position:52% 45%}
  .hero-v87::before{
    background:linear-gradient(90deg,
      #f3f0fa 0%,
      rgba(243,240,250,.99) 24%,
      rgba(243,240,250,.91) 34%,
      rgba(243,240,250,.48) 44%,
      rgba(243,240,250,0) 58%);
  }
}

/* Tablet and mobile: copy first, approved scene second. The alternate file is
   a crop of the same photograph, not a different generated composition. */
@media(max-width:900px){
  .hero.hero-v87{
    min-height:auto;
    padding:0;
    display:flex;
    flex-direction:column;
    background:#f3f0fa;
  }
  .hero-v87::before{display:none}
  .hero-v87::after{height:58px}
  .hero-v87-shell{
    order:1;
    width:100%;
    min-height:0;
    padding:48px clamp(20px,6vw,54px) 28px;
    display:block;
  }
  .hero-v87 .hero-copy{
    width:100%;
    max-width:620px;
    margin:0 auto;
  }
  .hero-v87 .hero-copy .eyebrow{margin-bottom:13px}
  .hero-v87 .hero-copy h1{
    max-width:620px;
    font-size:clamp(48px,8.4vw,68px);
    line-height:.95;
  }
  .hero-v87 .hero-actions{margin-top:23px}
  .hero-v87-media{
    order:2;
    position:relative;
    inset:auto;
    z-index:0;
    width:100%;
    height:min(66.6667vw,520px);
    min-height:300px;
    margin:-1px 0 0;
  }
  .hero-v87-media::before{
    content:"";
    position:absolute;
    z-index:1;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,#f3f0fa 0%,rgba(243,240,250,.14) 12%,rgba(243,240,250,0) 29%);
  }
  .hero-v87-media img{
    object-fit:cover;
    object-position:50% 50%;
  }
}

@media(max-width:520px){
  .hero-v87-shell{padding:40px 18px 24px}
  .hero-v87 .hero-copy h1{
    max-width:100%;
    font-size:clamp(42px,11.2vw,48px);
  }
  .hero-v87-media{
    height:78vw;
    min-height:270px;
    max-height:360px;
  }
  .hero-v87-media img{object-position:50% 50%}
}

@media(max-width:370px){
  .hero-v87-shell{padding-left:16px;padding-right:16px}
  .hero-v87 .hero-copy h1{font-size:42px}
  .hero-v87 .hero-actions{gap:8px}
  .hero-v87 .hero-actions .button{padding-left:14px;padding-right:14px}
}