.bird-shop{
  position:relative;
  isolation:isolate;
  height:max(760px,100svh);
  min-height:760px;
  overflow:hidden;
  padding:clamp(86px,10vh,104px) 0 28px;
  color:#173a84;
  background:linear-gradient(180deg,#f7fbff 0%,#f1f7fd 58%,#f7fbff 100%);
}
.bird-shop::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 35%,rgba(255,255,255,.92),transparent 28%),
    radial-gradient(circle at 82% 38%,rgba(255,255,255,.72),transparent 25%);
}
.bird-shop-heading{
  position:relative;
  z-index:30;
  width:min(900px,92vw);
  margin:0 auto;
  text-align:center;
  transform-origin:center top;
  will-change:transform,opacity;
}
.bird-shop-heading>span{
  display:block;
  margin-bottom:10px;
  color:#71809a;
  font-size:11px;
  font-weight:750;
  letter-spacing:.34em;
}
.bird-shop-heading h2{
  margin:0;
  color:#214ed9;
  font-size:clamp(46px,5vw,76px);
  line-height:.96;
  letter-spacing:-.055em;
}
.bird-shop-heading p{
  margin:15px 0 0;
  color:#687791;
  font-size:15px;
  line-height:1.5;
}
.bird-carousel{
  --bird-base-width:clamp(190px,12vw,230px);
  --bird-width:calc(var(--bird-base-width) + 10px);
  --bird-height:calc(var(--bird-base-width)*1.34);
  --carousel-scale:1;
  position:absolute;
  inset:clamp(210px,24vh,220px) 0 0;
  z-index:2;
  outline:none;
  transform-style:flat;
}
.bird-carousel:focus-visible::after{
  content:"";
  position:absolute;
  inset:4px;
  z-index:80;
  border:2px solid rgba(33,78,217,.72);
  border-radius:20px;
  pointer-events:none;
}
.bird-carousel-orbit{
  position:relative;
  z-index:2;
  transform-style:preserve-3d;
  will-change:transform;
}
.bird-carousel-stage{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  perspective:3000px;
  transform-style:preserve-3d;
  touch-action:pan-y;
  cursor:default;
  user-select:none;
}
.bird-shop.is-interactive .bird-carousel-stage{cursor:grab}
.bird-carousel.is-dragging .bird-carousel-stage{cursor:grabbing}
.bird-carousel-orbit,.bird-carousel-ring,.bird-orbit-card{pointer-events:none}
.bird-card-front{pointer-events:auto;cursor:pointer}
.bird-carousel.is-detail-open .bird-card-face{pointer-events:none}
.bird-carousel-ring{
  position:relative;
  width:var(--bird-width);
  height:var(--bird-height);
  transform-style:preserve-3d;
  will-change:transform;
  transition:opacity .24s ease,filter .24s ease;
}
.bird-orbit-card{
  position:absolute;
  inset:0;
  transform-style:preserve-3d;
  transform-origin:center;
  will-change:transform;
}
.bird-card-explore{
  appearance:none;
  border:0;
  font:inherit;
  color:inherit;
}
.bird-card-face{
  position:absolute;
  inset:0;
  overflow:hidden;
  display:block;
  border:1px solid rgba(255,255,255,.82);
  border-radius:24px;
  background:
    radial-gradient(circle at 22% 12%,rgba(255,255,255,.98),rgba(255,255,255,.58) 34%,transparent 62%),
    linear-gradient(145deg,rgba(247,252,255,.91),rgba(226,239,251,.82));
  box-shadow:
    0 5px 0 rgba(157,181,210,.42),
    0 22px 48px rgba(49,79,116,.14),
    0 7px 18px rgba(49,79,116,.09),
    inset 2px 2px 2px rgba(255,255,255,.96),
    inset -2px -3px 8px rgba(128,164,202,.24),
    inset 0 0 26px rgba(188,216,240,.16);
  backface-visibility:hidden;
  transform:translateZ(0);
  transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s ease,border-color .26s ease;
}
.bird-card-face::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  border-radius:inherit;
  border:1px solid rgba(255,255,255,.62);
  background:
    radial-gradient(circle at 78% 16%,rgba(148,204,241,.24),transparent 34%),
    radial-gradient(ellipse at 18% 5%,rgba(255,255,255,.68),transparent 40%),
    linear-gradient(118deg,rgba(255,255,255,.34),rgba(255,255,255,.08) 34%,rgba(132,184,226,.18) 66%,rgba(255,255,255,.32));
  box-shadow:inset 0 1px 12px rgba(255,255,255,.42),inset 0 -10px 24px rgba(140,177,213,.1);
  pointer-events:none;
}
.bird-card-face::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:auto 0 0;
  height:92px;
  background:linear-gradient(transparent,rgba(255,255,255,.98) 66%);
  pointer-events:none;
}
.bird-card-title{
  position:absolute;
  z-index:3;
  top:23px;
  left:24px;
  right:20px;
  display:flex;
  flex-direction:column;
  gap:3px;
  text-align:left;
}
.bird-card-title strong{
  overflow:hidden;
  color:#15346f;
  font-size:clamp(16px,1.25vw,21px);
  line-height:1.08;
  letter-spacing:-.035em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.bird-card-face img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  mix-blend-mode:normal;
  opacity:.965;
  pointer-events:none;
}
.bird-card-back{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:hidden;
  display:block;
  border:1px solid rgba(206,218,233,.88);
  border-radius:24px;
  background:linear-gradient(145deg,#fff 0%,#f8fbff 58%,#eef4fb 100%);
  box-shadow:0 12px 34px rgba(49,79,116,.1),inset 0 1px 0 #fff;
  backface-visibility:hidden;
  transform:rotateY(180deg);
  pointer-events:auto;
  cursor:pointer;
}
.bird-card-back::before{background:linear-gradient(145deg,rgba(35,42,52,.64),rgba(31,39,50,.7));box-shadow:inset 1px 1px 0 rgba(255,255,255,.22),inset -2px -3px 8px rgba(7,16,28,.2)}
.bird-card-back img{
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}
.bird-card-explore{
  position:absolute;
  z-index:5;
  left:19px;
  bottom:15px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:24px;
  padding:2px 3px 2px 8px;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(255,255,255,.92);
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#214ed9;
  box-shadow:0 5px 14px rgba(31,73,137,.12);
  cursor:pointer;
  opacity:.82;
  transform:translateZ(4px);
  backface-visibility:hidden;
  transition:opacity .18s ease,color .24s ease,box-shadow .24s ease;
}
.bird-card-explore::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-110%;
  width:100%;
  aspect-ratio:1;
  border-radius:50%;
  background:#214ed9;
  transform:scale(.82);
  transition:left .42s cubic-bezier(.2,.78,.2,1),transform .42s cubic-bezier(.2,.78,.2,1);
}
.bird-card-explore morph-icon[data-icon]{
  order:2;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  padding:4px;
  border:1px solid #214ed9;
  border-radius:50%;
  background:#214ed9;
  color:#fff;
  box-shadow:none;
  transform:rotate(-45deg);
  transition:background .24s ease,color .24s ease,transform .42s cubic-bezier(.2,.78,.2,1),border-color .24s ease;
}
.bird-card-explore small{
  color:#214ed9;
  font-size:6px;
  font-weight:750;
  letter-spacing:.14em;
  transition:color .24s ease;
}
.bird-orbit-card:hover .bird-card-explore{opacity:1}
@media(hover:hover){
  .bird-orbit-card:hover{z-index:20}
  .bird-orbit-card:hover .bird-card-front{
    transform:translate3d(0,-24px,0) scale(1.08);
    box-shadow:0 28px 54px rgba(40,70,108,.16),inset 0 1px 0 rgba(255,255,255,.95);
  }
  .bird-orbit-card:hover .bird-card-explore{
    opacity:1;
    transform:none;
  }
  .bird-card-explore:is(:hover,.is-hovered){color:#fff;box-shadow:0 8px 18px rgba(22,70,168,.22)}
  .bird-card-explore:is(:hover,.is-hovered)::before{left:0;transform:scale(1.75)}
  .bird-card-explore:is(:hover,.is-hovered) small{color:#fff}
  .bird-card-explore:is(:hover,.is-hovered) morph-icon[data-icon]{transform:rotate(45deg);border-color:#fff;background:#fff;color:#214ed9}
}
.bird-detail{
  position:absolute;
  inset:40px 0 34px;
  z-index:70;
  display:grid;
  place-items:start center;
  visibility:hidden;
  pointer-events:none;
}
.bird-detail[aria-hidden="false"]{visibility:visible;pointer-events:auto}
.bird-detail-backdrop{
  position:absolute;
  inset:0;
  border:0;
  background:transparent;
  cursor:pointer;
}
.bird-detail-panel{
  position:relative;
  width:min(1510px,92vw);
  height:min(650px,100%);
  min-height:560px;
  display:grid;
  grid-template-columns:minmax(430px,.46fr) minmax(600px,.54fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.9);
  border-radius:40px;
  background:
    radial-gradient(circle at 16% 8%,rgba(255,255,255,.92),transparent 36%),
    linear-gradient(145deg,rgba(241,249,255,.78),rgba(218,235,249,.62));
  box-shadow:
    0 5px 0 rgba(159,185,212,.32),
    0 34px 90px rgba(39,72,112,.18),
    inset 1px 1px 1px rgba(255,255,255,.98),
    inset -1px -2px 8px rgba(135,170,205,.18);
  backdrop-filter:blur(30px) saturate(1.16);
  -webkit-backdrop-filter:blur(30px) saturate(1.16);
  opacity:0;
  transform:scale(.16);
  transform-origin:var(--detail-origin-x,50%) var(--detail-origin-y,50%);
  transform-style:preserve-3d;
  transition:opacity .28s ease,transform .54s cubic-bezier(.16,1,.3,1);
  will-change:transform,opacity;
}
.bird-detail.is-expanded .bird-detail-panel{opacity:1;transform:scale(.8)}
.bird-detail.is-closing .bird-detail-panel{opacity:0;transform:scale(.16);transition-duration:.36s,.5s;transition-timing-function:ease,cubic-bezier(.55,0,.8,.2)}
.bird-detail.is-closing .bird-detail-media,.bird-detail.is-closing .bird-detail-copy,.bird-detail.is-closing .bird-detail-back{opacity:0;transition:opacity .14s ease}
.bird-detail-flight{
  position:fixed;
  z-index:120;
  overflow:hidden;
  pointer-events:none;
  contain:layout paint;
  transform-origin:top left;
  border:1px solid rgba(255,255,255,.92);
  background:linear-gradient(145deg,rgba(247,252,255,.98),rgba(220,237,250,.94));
  box-shadow:0 26px 70px rgba(39,72,112,.2),inset 1px 1px 1px #fff;
  will-change:transform,opacity;
}
.bird-detail-flight strong{position:absolute;z-index:2;top:6%;left:6%;right:6%;color:#173a84;font-size:18px;line-height:1.2}
.bird-detail-flight img{width:100%;height:100%;padding:7% 9% 1%;box-sizing:border-box;object-fit:contain;mix-blend-mode:multiply}
.bird-detail-back{
  position:absolute;
  z-index:4;
  top:28px;
  left:30px;
  display:flex;
  align-items:center;
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.95);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:#173a84;
  font:inherit;
  justify-content:center;
  cursor:pointer;
}
.bird-detail-back morph-icon{width:19px;height:19px}
.bird-detail-media{
  position:relative;
  min-height:0;
  overflow:hidden;
  background:
    radial-gradient(circle at 68% 24%,rgba(255,255,255,.76),transparent 34%),
    linear-gradient(145deg,rgba(247,251,255,.56),rgba(222,239,252,.28));
}
.bird-detail-media::after{
  content:"";
  position:absolute;
  inset:auto 13% 5%;
  height:34px;
  border-radius:50%;
  background:rgba(67,92,126,.17);
  filter:blur(16px);
}
.bird-detail-main-image{
  position:absolute;
  z-index:2;
  inset:9% 2% 0 11%;
  width:87%;
  height:91%;
  object-fit:contain;
  mix-blend-mode:multiply;
  transform-origin:center bottom;
  transition:transform .35s cubic-bezier(.22,1,.36,1);
}
.bird-detail-media[data-view="close"] .bird-detail-main-image{transform:scale(1.48) translate(7%,11%)}
.bird-detail-media[data-view="profile"] .bird-detail-main-image{transform:scale(1.12) translate(8%,1%)}
.bird-detail-thumbs{position:absolute;z-index:5;left:34px;top:50%;display:grid;gap:12px;transform:translateY(-42%)}
.bird-detail-thumb{width:92px;height:92px;padding:7px;overflow:hidden;border:1px solid rgba(255,255,255,.96);border-radius:20px;background:rgba(255,255,255,.62);box-shadow:0 12px 26px rgba(45,83,130,.08),inset 0 1px 0 #fff;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.bird-detail-thumb.is-active{border-color:#3373f4;box-shadow:0 0 0 2px rgba(51,115,244,.1),0 12px 26px rgba(45,83,130,.1)}
.bird-detail-thumb img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;pointer-events:none}
.bird-detail-thumb[data-view="close"] img{transform:scale(1.65) translate(4%,13%)}
.bird-detail-thumb[data-view="profile"] img{transform:scale(1.14) translate(8%,0)}
.bird-detail-halo{display:none}
.bird-detail-copy{
  overflow-y:auto;
  overscroll-behavior:contain;
  position:relative;
  z-index:1;
  min-width:0;
  min-height:0;
  align-self:stretch;
  margin:28px 28px 28px 0;
  padding:41px 34px 27px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:32px;
  background:
    radial-gradient(circle at 88% 8%,rgba(214,235,253,.44),transparent 34%),
    linear-gradient(145deg,rgba(255,255,255,.78),rgba(244,249,253,.62));
  box-shadow:
    0 18px 42px rgba(48,78,113,.11),
    inset 1px 1px 1px rgba(255,255,255,.98),
    inset -1px -2px 7px rgba(147,178,208,.14);
  backdrop-filter:blur(20px) saturate(1.12);
  -webkit-backdrop-filter:blur(20px) saturate(1.12);
  box-sizing:border-box;
}
.bird-detail-copy h3{
  margin:0;
  color:#173a84;
  font-size:clamp(48px,4.5vw,68px);
  line-height:.96;
  letter-spacing:-.055em;
}
.bird-detail-categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:30px}
@media(min-width:1101px) { .bird-detail-copy .bird-detail-categories a { min-height:210px; } }
.bird-detail-categories a{
  position:relative;
  min-width:0;
  min-height:310px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.96);
  border-radius:22px;
  background:#f9fbfe;
  color:#173a84;
  text-decoration:none;
  box-shadow:0 5px 0 rgba(168,190,213,.25),0 18px 36px rgba(45,83,130,.1),inset 0 1px 0 #fff;
  transition:transform .25s ease,box-shadow .25s ease;
}
.bird-detail-categories a::after{content:"";position:absolute;inset:auto 0 0;height:38%;background:linear-gradient(transparent,rgba(255,255,255,.98) 72%);pointer-events:none}
.bird-detail-categories a:hover{transform:translateY(-7px);box-shadow:0 25px 44px rgba(45,83,130,.16),inset 0 1px 0 #fff}
.bird-detail-categories a>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bird-detail-categories a span{position:absolute;z-index:2;left:16px;right:44px;bottom:24px;overflow:hidden;font-size:clamp(12px,.78vw,15px);font-weight:800;line-height:1.05;text-overflow:ellipsis;white-space:nowrap}
.bird-detail-categories a morph-icon{position:absolute;z-index:2;right:13px;bottom:18px;width:23px;height:23px;display:grid;place-items:center;background:transparent;color:#214ed9;box-shadow:none}
.bird-detail-category-cages{background:#f7ece8!important}
.bird-detail-category-toys{background:#e9f5ff!important}
.bird-detail-category-feeding{background:#fbf0df!important}
.bird-detail-category-accessories{background:#eaf7ec!important}
.bird-carousel-ring{transition:opacity .38s ease,filter .38s ease}
.bird-carousel.is-detail-open .bird-carousel-ring{opacity:0;filter:blur(3px);pointer-events:none}

@media(max-width:900px){
  .bird-carousel{--bird-base-width:clamp(190px,24vw,230px);--bird-width:calc(var(--bird-base-width) + 10px);--carousel-scale:1.05}
  .bird-detail.is-expanded .bird-detail-panel{grid-template-columns:.9fr 1.1fr;transform:scale(.8)}
  .bird-detail-copy{margin:20px 20px 20px 0;padding:34px 26px}
  .bird-detail-categories{grid-template-columns:1fr 1fr;gap:11px;margin-top:24px}
  .bird-detail-categories a{min-height:150px}
}
@media(max-width:700px){
  .bird-shop{height:max(690px,100svh);min-height:690px;padding-top:42px}
  .bird-shop-heading>span{font-size:9px;margin-bottom:8px}
  .bird-shop-heading h2{font-size:38px}
  .bird-shop-heading p{margin-top:10px;font-size:12px}
  .bird-carousel{--bird-base-width:158px;--bird-width:168px;--bird-height:220px;--carousel-scale:1;inset:145px 0 0;perspective:1300px}
  .bird-card-face{border-radius:17px}
  .bird-card-title{top:15px;left:14px;right:10px;gap:1px}
  .bird-card-title strong{font-size:14px}
  .bird-card-face::after{height:65px}
  .bird-card-explore{left:10px;bottom:9px;gap:4px}
  .bird-card-explore morph-icon{width:18px;height:18px}
  .bird-card-explore small{font-size:6px}
  .bird-detail{inset:92px 0 10px}
  .bird-detail-panel{width:92vw;height:auto;max-height:100%;min-height:0;grid-template-columns:1fr;overflow:auto;border-radius:22px;transform:none}
  .bird-detail-media{min-height:300px}
  .bird-detail-main-image{inset:8% 3% 0 7%;width:90%;height:88%}
  .bird-detail-thumbs{left:14px;top:auto;bottom:12px;display:flex;gap:7px;transform:none}
  .bird-detail-thumb{width:56px;height:56px;padding:4px;border-radius:13px}
  .bird-detail-back{top:13px;left:13px;padding:8px 11px}
  .bird-detail-copy{margin:0 12px 14px;padding:24px 22px 26px;border-radius:20px}
  .bird-detail-copy h3{font-size:38px}
  .bird-detail-categories{grid-template-columns:1fr 1fr;gap:9px;margin-top:20px}
  .bird-detail-categories a{min-height:180px;border-radius:16px}
  .bird-detail-categories a span{left:11px;bottom:16px;font-size:12px}
  .bird-detail-categories a morph-icon{right:8px;bottom:12px;width:17px;height:17px}
}
@media(prefers-reduced-motion:reduce){
  .bird-card-face,.bird-card-explore,.bird-carousel-ring,.bird-detail-categories a{transition:none!important}
}

/* Keep the surface's rounded border outside its inset scrolling content. */
.bird-detail-panel .bird-detail-copy { padding:12px; overflow:hidden; }
.bird-detail-scroll { height:100%; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:29px 22px 24px; scroll-padding-block:24px; mask-image:linear-gradient(transparent,#000 18px,#000 calc(100% - 18px),transparent); }
@media(max-width:1100px) { .bird-detail-scroll { padding:22px 14px 22px; } }
@media(max-width:760px) { .bird-detail-scroll { height:auto; overflow:visible; padding:12px 10px 14px; mask-image:none; } }
@media(forced-colors:active) { .bird-detail-scroll { mask-image:none; } }

/* Reuse the shared arrow fill while preserving the absolute corner placement. */
.bird-detail-back.arrow-motion-target { position:absolute; }
.bird-detail-back:active { background:#214ed9; color:#fff; }
@media(hover:hover) { .bird-detail-back.arrow-motion-target:is(:hover,:focus-visible) { color:#fff; } }
@media(prefers-reduced-motion:reduce) { .bird-detail-back.arrow-motion-target:is(:hover,:focus-visible) { background:#214ed9; color:#fff; } }

/* Reference composition: introduction first, complete product cards, 5% upward growth. */
@media(min-width:701px) {
 .bird-detail { scale:1.05; transform-origin:center bottom; }
 .bird-detail.is-expanded .bird-detail-panel { transform:translate(calc(10% - var(--detail-origin-x,50%) * .2),calc(10% - var(--detail-origin-y,50%) * .2)) scale(.8); }
}
.bird-detail-copy #bird-detail-title { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.bird-detail-scroll { padding:24px 22px; }
.bird-detail-copy .bird-science { margin-top:0; }
.bird-detail-copy .bird-science h4 { margin-bottom:16px; font-size:clamp(26px,2.3vw,34px); line-height:1.15; color:var(--pf-blue); font-weight:650; }
.bird-detail-copy .bird-science p { max-width:none; margin-top:18px; }
.bird-detail-copy .bird-detail-categories { margin-top:22px; gap:14px; }
.bird-detail-categories a { box-shadow:0 7px 18px #244b8510,inset 0 1px #fff; }
.bird-detail-categories a span { left:12px; right:32px; bottom:18px; font-weight:650; }
.bird-detail-categories a morph-icon { right:10px; bottom:14px; width:18px; height:18px; }
@media(min-width:1101px) {
 .bird-detail-scroll { display:flex; flex-direction:column; }
 .bird-detail-scroll>[data-bird-introduction] { flex:none; }
 .bird-detail-copy .bird-detail-categories { margin-top:auto; padding-top:22px; }
 .bird-detail-copy .bird-detail-categories a { min-height:230px; }
}
@media(max-width:760px) { .bird-detail-scroll { padding:18px 14px; } }
