/* Tablet/mobile presentation layer and touch-specific behavior. */
/* =========================================================
   MOBILE RESPONSIVE ARCHITECTURE
   Shared data / shared components, dedicated tablet & mobile presentation.
   Desktop fan composition remains the source of truth at >=1024px.
   ========================================================= */

:root{
  --safe-top:env(safe-area-inset-top,0px);
  --safe-right:env(safe-area-inset-right,0px);
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --safe-left:env(safe-area-inset-left,0px);
}

/* Shared overlay brand header: hidden on desktop, promoted to the same mobile brand language as News Center. */
.overlay-mobile-header{display:none;}
.overlay-site-header .overlay-main-nav{display:none;}
.overlay-site-header .overlay-menu-btn{display:none;}
.overlay-site-brand{color:#f6f6f6;}
.pet-id-head__wordmark{color:#f6f6f6;}
.pet-id-head__wordmark .wordmark__mark{width:42px;}
.pet-id-head__wordmark .wordmark__copy{gap:5px;}
.pet-id-head__wordmark strong{font-size:15px;letter-spacing:.34em;}
.pet-id-head__wordmark small{font-size:8px;color:rgba(255,255,255,.58);}

.hero-deck__pagination{display:none;}

@media (max-width:1080px){
  :root{--shell:calc(100vw - 40px);}

  /* Header / tablet: remove the transformed containing block so the off-canvas menu cannot widen the document. */
  .site-header:not(.is-fixed){left:0!important;width:100%!important;transform:none!important;padding-left:20px;padding-right:20px;}
  .site-header{padding-top:max(24px,calc(var(--safe-top) + 14px));}
  .site-header.is-fixed{left:14px!important;width:calc(100% - 28px)!important;transform:none!important;top:max(10px,var(--safe-top));}
  .main-nav{right:0!important;}

  /* Hero switches from desktop fan to a focused horizontal story rail. */
  .hero{
    height:100svh!important;
    min-height:720px!important;
    max-height:920px;
  }
  .hero__background{
    background-image:url("../images/hero/hero-space.png")!important;
    background-position:center 49%!important;
    transform:none!important;
    animation:none!important;
  }
  .hero__background-layer{background-size:cover!important;}
  .hero__vignette{
    background:
      linear-gradient(to bottom,rgba(11,11,13,.78) 0%,rgba(11,11,13,.40) 25%,rgba(10,10,12,.18) 47%,rgba(10,10,12,.53) 75%,rgba(8,8,9,.92) 100%),
      radial-gradient(ellipse at 50% 42%,rgba(0,0,0,.02),rgba(0,0,0,.48) 78%)!important;
  }
  .hero.has-ecosystem-background .hero__vignette{
    background:
      linear-gradient(to bottom,rgba(11,11,13,.76) 0%,rgba(11,11,13,.32) 26%,rgba(10,10,12,.16) 48%,rgba(10,10,12,.53) 76%,rgba(8,8,9,.92) 100%),
      radial-gradient(ellipse at 50% 42%,rgba(0,0,0,.01),rgba(0,0,0,.48) 80%)!important;
  }

  .hero-deck{
    left:0!important;
    right:auto!important;
    top:auto!important;
    bottom:88px!important;
    width:100%!important;
    height:460px!important;
    display:flex!important;
    align-items:flex-end!important;
    gap:18px!important;
    padding:28px max(20px,calc((100vw - min(68vw,520px))/2)) 8px!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-inline:calc((100vw - min(68vw,520px))/2)!important;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    perspective:none!important;
    transform:none!important;
    transform-style:flat!important;
    pointer-events:auto!important;
  }
  .hero-deck::-webkit-scrollbar{display:none;}

  .hero-deck .eco-card,
  .hero-deck .eco-card--academy,
  .hero-deck .eco-card--wash,
  .hero-deck .eco-card--xiaota,
  .hero-deck .eco-card--social,
  .hero-deck .eco-card--territory{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    flex:0 0 min(68vw,520px)!important;
    width:min(68vw,520px)!important;
    height:390px!important;
    min-height:390px!important;
    border-radius:34px!important;
    opacity:.64!important;
    transform:scale(.93)!important;
    transform-origin:center bottom!important;
    scroll-snap-align:center!important;
    scroll-snap-stop:always;
    transition:opacity .32s var(--ease),transform .38s var(--ease),border-color .28s ease!important;
  }
  .hero-deck .eco-card.is-mobile-active{
    opacity:1!important;
    transform:scale(1)!important;
    border-color:rgba(255,255,255,.54)!important;
  }
  .hero-deck .eco-card::after{height:32%!important;opacity:.34!important;}
  .hero-deck .eco-card__body,
  .hero-deck .eco-card__body--feature{
    position:absolute!important;
    left:30px!important;
    right:30px!important;
    top:34px!important;
    display:block!important;
  }
  .hero-deck .eco-card__copy,
  .hero-deck .eco-card--social .eco-card__copy,
  .hero-deck .eco-card--territory .eco-card__copy{
    text-align:left!important;
  }
  .hero-deck .eco-card h2,
  .hero-deck .eco-card--xiaota h2{font-size:30px!important;margin-bottom:10px!important;}
  .hero-deck .eco-card__tag{font-size:12px!important;margin:0 0 22px!important;}
  .hero-deck .eco-card p{
    display:-webkit-box!important;
    max-width:420px!important;
    margin:0!important;
    color:rgba(240,242,243,.74)!important;
    font-size:12px!important;
    line-height:1.8!important;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .hero-deck .eco-card__aside{display:none!important;}
  .hero-deck .eco-card__down{display:none!important;}
  .hero-deck .eco-card__detail,
  .hero-deck .eco-card--social .eco-card__detail,
  .hero-deck .eco-card--territory .eco-card__detail{
    display:inline-flex!important;
    left:30px!important;
    right:auto!important;
    bottom:30px!important;
    opacity:1!important;
    transform:none!important;
    pointer-events:none!important;
    font-size:11px!important;
    gap:18px!important;
    color:rgba(255,255,255,.95)!important;
    border-bottom-color:rgba(255,255,255,.46)!important;
  }
  .hero-deck.is-fanned.fan-complete .eco-card,
  .hero-deck.is-fanned.fan-complete .eco-card:hover,
  .hero-deck.is-fanned.fan-complete .eco-card:focus-visible{
    transform:scale(.93)!important;
    filter:none!important;
  }
  .hero-deck.is-fanned.fan-complete .eco-card.is-mobile-active,
  .hero-deck.is-fanned.fan-complete .eco-card.is-mobile-active:hover,
  .hero-deck.is-fanned.fan-complete .eco-card.is-mobile-active:focus-visible{
    transform:scale(1)!important;
  }

  .hero-deck__pagination{
    position:absolute;
    z-index:10;
    left:50%;
    bottom:62px;
    display:flex;
    align-items:center;
    gap:0;
    transform:translateX(-50%);
  }
  .hero-deck__pagination button{
    position:relative;
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    padding:0;
    border:0;
    background:transparent;
  }
  .hero-deck__pagination button::before{
    content:"";
    width:7px;
    height:7px;
    border-radius:999px;
    background:rgba(255,255,255,.30);
    transition:width .28s var(--ease),background .28s ease;
  }
  .hero-deck__pagination button.is-active::before{width:24px;background:rgba(255,255,255,.92);}
  .hero-ticker{height:42px!important;}

  /* Tablet content rhythm */
  .about{min-height:720px;padding:100px 0 130px;}
  .about__headline{margin-left:10%;}
  .about__beliefs{margin-top:100px;}
  .news{padding:100px 0;}
  .partners{padding-top:90px;}
}

@media (max-width:768px){
  :root{--shell:calc(100vw - 32px);}
  html{scroll-padding-top:82px;}
  body{padding-left:var(--safe-left);padding-right:var(--safe-right);}

  /* Full-screen mobile navigation with safe-area awareness. */
  .site-header,
  .site-header:not(.is-fixed),
  .site-header.is-fixed{
    left:0!important;
    width:100%!important;
    height:78px!important;
    transform:none!important;
    padding:max(16px,calc(var(--safe-top) + 10px)) max(18px,calc(var(--safe-right) + 18px)) 0 max(18px,calc(var(--safe-left) + 18px))!important;
    align-items:flex-start!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
  }
  .site-header.is-fixed{
    position:fixed!important;
    top:0!important;
  }
  .site-header.is-fixed::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(180deg,rgba(15,15,16,.88),rgba(15,15,16,.56) 72%,transparent);
    backdrop-filter:blur(12px);
  }
  .wordmark--with-mark{gap:10px!important;}
  .wordmark__mark,.site-header.is-fixed .wordmark__mark{width:42px!important;}
  .wordmark__copy,.site-header.is-fixed .wordmark__copy{gap:5px!important;}
  .wordmark strong,.site-header.is-fixed .wordmark strong{font-size:16px!important;letter-spacing:.34em!important;}
  .wordmark small{display:block!important;max-width:190px;overflow:hidden;text-overflow:ellipsis;font-size:8px!important;color:rgba(255,255,255,.58)!important;}
  .site-header.is-fixed .wordmark small{display:block!important;}
  .page-loader__mark{width:104px;}
  .page-loader p{font-size:9px;letter-spacing:.20em;}
  .page-loader>span{width:140px;}
  .menu-btn{
    display:block!important;
    position:relative!important;
    z-index:5;
    width:44px!important;
    height:44px!important;
    margin-top:-2px;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:50%;
    background:rgba(18,18,19,.22)!important;
    backdrop-filter:blur(10px);
  }
  .menu-btn span{left:11px!important;width:20px!important;}

  .main-nav{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    min-height:100svh;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:center!important;
    gap:0!important;
    padding:max(104px,calc(var(--safe-top) + 92px)) max(28px,calc(var(--safe-right) + 28px)) max(42px,calc(var(--safe-bottom) + 28px)) max(28px,calc(var(--safe-left) + 28px))!important;
    background:
      radial-gradient(circle at 16% 12%,rgba(234,218,175,.09),transparent 26%),
      linear-gradient(160deg,rgba(16,16,17,.985),rgba(8,9,10,.985))!important;
    box-shadow:none!important;
    transform:translateX(105%)!important;
    overflow-y:auto;
  }
  .main-nav::before{
    content:"CHONGPAR  ·  PET × AI × LIFE";
    position:absolute;
    left:max(28px,calc(var(--safe-left) + 28px));
    top:max(100px,calc(var(--safe-top) + 88px));
    color:rgba(234,218,175,.55);
    font-size:8px;
    letter-spacing:.22em;
  }
  .site-header.menu-visible .main-nav{transform:none!important;}
  .main-nav a{
    width:100%!important;
    min-height:60px;
    display:flex;
    align-items:center;
    padding:18px 0!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
    color:rgba(255,255,255,.64)!important;
    font-size:24px!important;
    line-height:1.1;
  }
  .main-nav a:hover,.main-nav a.is-active,.main-nav a.is-overlay-active{color:#fff!important;}
  .main-nav a::after{display:none!important;}

  /* Hero mobile */
  .hero__background{background-image:url("../images/mobile/hero-space-mobile.webp")!important;background-position:center 46%!important;}
  .hero{
    height:100svh!important;
    min-height:700px!important;
    max-height:880px!important;
  }
  .hero-deck{
    bottom:78px!important;
    height:440px!important;
    gap:14px!important;
    padding:22px 9vw 10px!important;
    scroll-padding-inline:9vw!important;
  }
  .hero-deck .eco-card,
  .hero-deck .eco-card--academy,
  .hero-deck .eco-card--wash,
  .hero-deck .eco-card--xiaota,
  .hero-deck .eco-card--social,
  .hero-deck .eco-card--territory{
    order:0!important;
    flex-basis:82vw!important;
    width:82vw!important;
    height:366px!important;
    min-height:366px!important;
    border-radius:30px!important;
    -webkit-backdrop-filter:blur(8px) saturate(.92) brightness(.84)!important;
    backdrop-filter:blur(8px) saturate(.92) brightness(.84)!important;
    box-shadow:0 18px 38px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,255,255,.07)!important;
  }
  .hero-deck .eco-card__body,
  .hero-deck .eco-card__body--feature{left:26px!important;right:26px!important;top:30px!important;}
  .hero-deck .eco-card h2,.hero-deck .eco-card--xiaota h2{font-size:28px!important;}
  .hero-deck .eco-card p{-webkit-line-clamp:4;font-size:11.5px!important;}
  .hero-deck .eco-card__detail{left:26px!important;bottom:28px!important;}
  .hero-deck__pagination{bottom:54px;}
  .hero-ticker{height:38px!important;padding-bottom:var(--safe-bottom);}
  .hero-ticker__track{font-size:9px!important;}

  /* ABOUT: keep identity but reduce animation/render cost and vertical dead space. */
  .about{min-height:0!important;padding:82px 0 104px!important;}
  .about__top{gap:54px!important;}
  .about__headline{margin-left:0!important;}
  .about__headline h2,.about__headline h2 strong{font-size:clamp(34px,10vw,44px)!important;line-height:1.15;}
  .about__beliefs{grid-template-columns:1fr!important;gap:44px!important;margin-top:72px!important;}
  .about__beliefs article{padding-top:26px;}
  .about__beliefs article:last-child{padding-right:0!important;}
  .about__beliefs p{max-width:34em;}
  .about__waves{opacity:.72;}

  /* Home/news center: one hero story + compact list on phones. */
  .news{padding:82px 0 96px!important;min-height:0!important;}
  .news__heading{align-items:flex-end!important;}
  .news__heading h2,.partners h2{font-size:clamp(36px,10vw,44px)!important;margin-top:20px!important;}
  .news-grid,.news-center-grid{
    grid-template-columns:1fr!important;
    gap:18px!important;
    margin-top:28px!important;
  }
  .news-card--feature{
    --feature-h:430px!important;
    --feature-media-h:236px!important;
    border-radius:18px!important;
  }
  .news-card__feature-summary{padding:20px 20px 24px!important;}
  .news-card__feature-summary h3{font-size:20px!important;line-height:1.35;}
  .news-card__feature-summary p{font-size:11px!important;line-height:1.65;}
  .news-card__overlay{display:none!important;}
  .news-list{grid-column:auto!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important;}
  .news-list__item{
    min-height:104px!important;
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr)!important;
    border-radius:14px!important;
    overflow:hidden;
    background:#fff;
  }
  .news-list__item img{width:112px!important;height:104px!important;object-fit:cover;}
  .news-list__item span{min-height:104px!important;padding:14px 14px 12px!important;}
  .news-list__item strong{font-size:13px!important;line-height:1.42!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .news-list__item small{display:block!important;margin-top:8px;font-size:8px!important;line-height:1.4;color:#989898;}
  .news-list__item b{right:13px!important;bottom:12px!important;}
  .news-more-grid,.news-page-extra{grid-template-columns:1fr!important;gap:10px!important;margin-top:10px!important;}
  .news-more-card{grid-template-columns:112px minmax(0,1fr)!important;min-height:104px;border-radius:14px!important;overflow:hidden;}
  .news-more-card__media{height:104px!important;}
  .news-more-card__body{padding:13px 14px!important;}
  .news-more-card__body h3{font-size:13px!important;line-height:1.4!important;margin-top:6px!important;}
  .news-more-card__body span{font-size:8px!important;}

  .news-center-main{padding-top:76px;}
  .news-center-hero{padding:72px 0 46px!important;}
  .news-center-hero__inner{grid-template-columns:1fr!important;gap:28px!important;}
  .news-center-hero h1{font-size:clamp(44px,13vw,60px)!important;}
  .news-center-hero__inner>p{max-width:28em!important;text-align:left!important;}
  .news-center-content{padding-bottom:92px!important;}
  .news-center-toolbar{display:block!important;overflow:visible;}
  .news-categories{
    width:calc(100vw - 16px);
    margin-left:-8px;
    padding:0 8px 8px;
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  .news-categories::-webkit-scrollbar{display:none;}
  .news-category{flex:none;min-height:44px;scroll-snap-align:start;}
  .news-status{margin:10px 0 0!important;font-size:9px!important;}
  .news-pagination{gap:10px!important;margin-top:36px!important;}
  .news-pagination button{min-width:0!important;min-height:44px;padding:0 14px!important;}
  .news-pagination__current{min-width:86px;font-size:10px!important;}

  /* News detail is now a reading page instead of a shrunken desktop poster. */
  .news-detail-hero{min-height:520px!important;}
  .news-detail-hero__content{width:var(--shell)!important;padding:132px 0 48px!important;}
  .news-detail-hero__content h1{font-size:clamp(34px,10vw,48px)!important;line-height:1.2!important;}
  .news-detail-body{width:var(--shell)!important;padding:54px 0 92px!important;}
  .news-detail-body__lead{font-size:18px!important;line-height:1.75!important;padding-bottom:30px!important;margin-bottom:34px!important;}
  .news-rich-content,.news-rich-content p{font-size:15px!important;line-height:1.9!important;}
  .news-rich-content h1{font-size:28px!important;}.news-rich-content h2{font-size:24px!important;}.news-rich-content h3{font-size:20px!important;}
  .news-rich-content img{width:calc(100% + 12px)!important;max-width:calc(100% + 12px)!important;margin:24px -6px!important;border-radius:10px!important;}
  .news-detail-back{min-height:44px;align-items:center;margin-top:48px!important;}

  /* Ecosystem overlay becomes a real mobile full-screen story. */
  .eco-dialog{
    width:100vw!important;
    height:100dvh!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:auto!important;
    overscroll-behavior:contain;
  }
  .eco-dialog::backdrop{background:#08090a!important;backdrop-filter:none!important;}
  .overlay-mobile-header{
    position:fixed!important;
    z-index:72!important;
    left:0;right:0;top:0;
    height:calc(78px + var(--safe-top));
    display:flex!important;
    align-items:flex-start;
    justify-content:space-between;
    padding:max(16px,calc(var(--safe-top) + 10px)) max(18px,calc(var(--safe-right) + 18px)) 0 max(18px,calc(var(--safe-left) + 18px));
    background:linear-gradient(180deg,rgba(15,15,16,.93),rgba(15,15,16,.68) 72%,rgba(15,15,16,0));
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    pointer-events:auto;
  }
  .overlay-mobile-brand{
    position:relative;
    z-index:1;
    width:max-content;
    pointer-events:auto;
    color:#fff;
  }
  .overlay-mobile-brand .wordmark__mark{width:42px!important;}
  .overlay-mobile-brand .wordmark__copy{gap:5px!important;}
  .overlay-mobile-brand strong{font-size:16px!important;letter-spacing:.34em!important;}
  .overlay-mobile-brand small{display:block!important;max-width:190px;overflow:hidden;text-overflow:ellipsis;font-size:8px!important;color:rgba(255,255,255,.58)!important;}
  .overlay-site-brand{
    position:relative;
    z-index:76;
    width:max-content;
    color:#fff;
  }
  .overlay-site-brand .wordmark__mark{width:42px!important;}
  .overlay-site-brand .wordmark__copy{gap:5px!important;}
  .overlay-site-brand strong{font-size:16px!important;letter-spacing:.34em!important;}
  .overlay-site-brand small{display:block!important;max-width:190px;overflow:hidden;text-overflow:ellipsis;font-size:8px!important;color:rgba(255,255,255,.58)!important;}
  .overlay-site-header .overlay-menu-btn{
    display:block!important;
    position:relative!important;
    z-index:80!important;
    flex:none;
  }
  .overlay-site-header .overlay-main-nav{
    display:flex!important;
    z-index:74!important;
  }
  .overlay-site-header.menu-visible .overlay-main-nav{transform:none!important;}
  .overlay-site-header.menu-visible .overlay-menu-btn span:first-child{transform:translateY(4.5px) rotate(45deg)!important;}
  .overlay-site-header.menu-visible .overlay-menu-btn span+span{transform:translateY(-4.5px) rotate(-45deg)!important;}
  .eco-dialog__close{display:none!important;}
  .eco-detail{
    width:100%!important;
    min-height:100%!important;
    height:auto!important;
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    padding:max(84px,calc(var(--safe-top) + 78px)) 18px max(38px,calc(var(--safe-bottom) + 28px))!important;
    overflow:visible!important;
  }
  .eco-detail__switcher{
    order:0!important;
    position:sticky!important;
    top:calc(78px + var(--safe-top))!important;
    z-index:50!important;
    width:calc(100% + 36px)!important;
    margin:0 -18px 0!important;
    padding:10px 18px 12px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    overflow-x:auto!important;
    border:0!important;
    background:linear-gradient(180deg,rgba(16,18,20,.97),rgba(16,18,20,.82));
    backdrop-filter:blur(14px);
    scrollbar-width:none;
  }
  .eco-detail__switcher::-webkit-scrollbar{display:none;}
  .eco-detail__switcher::before{display:none!important;}
  .eco-detail__switcher button,
  .eco-detail__switcher img{
    flex:none!important;
    width:auto!important;
    height:auto!important;
  }
  .eco-detail__switcher button{
    min-width:max-content!important;
    display:flex!important;
    grid-template:none!important;
    gap:8px!important;
    padding:7px 11px!important;
    border-radius:999px!important;
  }
  .eco-detail__switcher img{width:28px!important;height:28px!important;border-radius:8px!important;}
  .eco-detail__switcher span{display:block!important;font-size:9px!important;}

  .eco-detail__copy{
    order:1!important;
    width:100%!important;
    max-width:none!important;
    padding:34px 4px 24px!important;
    border:0!important;
  }
  .eco-detail__eyebrow{font-size:7px!important;margin-bottom:14px!important;}
  .eco-detail__title-row{padding-right:54px!important;}
  .eco-detail__mark{width:38px!important;height:38px!important;}
  .eco-detail__title-row h2{font-size:34px!important;}
  .eco-detail__lead{max-width:none!important;margin:20px 0 0!important;font-size:13px!important;line-height:1.8!important;}
  .eco-detail__meta{max-width:none!important;margin-top:20px!important;padding-top:16px!important;}
  .eco-detail__qr-stack{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:18px!important;
    margin:24px 0 8px!important;
    padding:18px 16px!important;
    border-radius:14px!important;
    border-top:1px solid rgba(255,255,255,.08)!important;
    background:rgba(255,255,255,.02)!important;
  }
  .eco-detail__qr-stack figure{
    width:96px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    margin:0!important;
    flex:none!important;
  }
  .eco-detail__qr-stack img{
    width:96px!important;
    height:96px!important;
    border-radius:12px!important;
    box-shadow:0 12px 28px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.08)!important;
  }
  .eco-detail__qr-stack figcaption{
    display:block!important;
    margin-top:8px!important;
    font-size:9px!important;
    color:rgba(255,255,255,.6)!important;
    letter-spacing:.05em!important;
    text-align:center!important;
  }
  .eco-detail__qr-stack::after{
    content:"扫码体验\A长按或截图识别小程序码"!important;
    white-space:pre!important;
    display:block!important;
    flex:1 1 auto!important;
    margin:0 0 0 4px!important;
    font-size:13px!important;
    line-height:1.55!important;
    letter-spacing:.04em!important;
    color:rgba(255,255,255,.78)!important;
  }

  .eco-detail__visual{
    order:2!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:1.12/1!important;
    min-height:0!important;
    margin:6px 0 0!important;
    border-radius:18px!important;
    touch-action:pan-y;
  }
  .eco-detail__visual::before{border-radius:18px!important;}
  .eco-ui-reference{object-fit:cover!important;object-position:center!important;}
  .eco-detail__waves{opacity:.32!important;inset:8% -60% -8% -12%!important;animation:none!important;}
  .eco-detail__waves::before,.eco-detail__waves::after{animation:none!important;}

  /* Pet identity: keyboard-safe single-column flow. */
  .pet-id-dialog{width:100vw!important;height:100dvh!important;max-height:none!important;margin:0!important;}
  .pet-id-panel{min-height:100dvh!important;}
  .pet-id-head{
    position:sticky!important;
    top:0!important;
    z-index:72!important;
    height:calc(78px + var(--safe-top))!important;
    padding:max(16px,calc(var(--safe-top) + 10px)) max(18px,calc(var(--safe-right) + 18px)) 0 max(18px,calc(var(--safe-left) + 18px))!important;
    align-items:flex-start!important;
    background:linear-gradient(180deg,rgba(15,15,16,.94),rgba(15,15,16,.72) 72%,rgba(15,15,16,.18))!important;
    border-bottom:0!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }
  .pet-id-head__wordmark{gap:10px!important;}
  .pet-id-head__wordmark .wordmark__mark{width:42px!important;}
  .pet-id-head__wordmark .wordmark__copy{gap:5px!important;}
  .pet-id-head__wordmark strong{font-size:16px!important;letter-spacing:.34em!important;}
  .pet-id-head__wordmark small{display:block!important;max-width:190px;overflow:hidden;text-overflow:ellipsis;font-size:8px!important;color:rgba(255,255,255,.58)!important;}
  .pet-id-head__signal{display:none!important;}
  .pet-id-close{display:none!important;}
  .pet-id-layout{min-height:calc(100dvh - 78px - var(--safe-top))!important;}
  .pet-id-query{padding-bottom:calc(38px + var(--safe-bottom))!important;}
  .pet-id-input-wrap input{font-size:16px!important;}
  .pet-id-input-wrap button{min-height:48px!important;}
  .pet-id-stage{padding-bottom:calc(70px + var(--safe-bottom))!important;}

  /* Partners / contact / footer */
  .partners{padding:72px 0 82px!important;}
  .partners-marquee{margin-top:44px!important;}
  .partners-track{gap:24px!important;}
  .partners-track img{width:128px!important;height:50px!important;}
  .contact{padding:76px 0 calc(88px + var(--safe-bottom))!important;}
  .contact-grid{gap:44px!important;}
  .contact-info h2{font-size:clamp(28px,8vw,38px)!important;margin:30px 0 0!important;}
  .contact-info dl{margin-top:38px!important;}
  .contact-info dl div{grid-template-columns:1fr!important;gap:8px!important;padding:20px 0!important;}
  .contact-info a{min-height:36px;display:inline-flex;align-items:center;}
  .site-footer{padding-bottom:var(--safe-bottom);}
  .footer-top{flex-direction:column!important;align-items:flex-start!important;gap:24px!important;}
  .footer-top nav{width:100%;display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px 24px!important;}
  .footer-top nav a{min-height:36px;display:flex;align-items:center;}
  .footer-bottom{flex-direction:column!important;align-items:flex-start!important;gap:22px!important;}
  .footer-bottom figure{display:none!important;}
  .footer-legal{gap:6px!important;margin-top:18px!important;}
}


@media (max-width:480px){
  :root{--shell:calc(100vw - 28px);}
  /* Tech (landscape) card keeps the squarish mobile fit. */
  .pet-card-stack{--pet-card-width:calc(100vw - 44px)!important;height:290px!important;}
  /* Passport (portrait) card must keep its vertical ratio so the
     120.png avatar (38% width, horizontally centered) renders like the PC version. */
  .pet-card-stack--passport{--pet-card-width:min(calc(100vw - 44px),340px)!important;height:auto!important;aspect-ratio:426.85 / 595.26!important;}
  .pet-id-stage{padding-left:10px!important;padding-right:10px!important;}
  .pet-identity-card{padding:12px 13px!important;}
  .pet-identity-card-back__brand span,.pet-identity-card-back>p{display:none;}
  .pet-identity-card__top span{font-size:7px!important}.pet-identity-card__top b{font-size:7px!important;}
  .pet-identity-card__hero{padding:6px 0 5px!important}.pet-identity-card__avatar{flex-basis:40px!important;width:40px!important;height:40px!important;border-radius:11px!important}.pet-identity-card__hero small{font-size:7px!important}.pet-identity-card__hero h3{font-size:17px!important}.pet-identity-card__hero p{font-size:8.5px!important;}
  .pet-identity-card__data div{padding:3px 5px!important}.pet-identity-card__data dt{font-size:7px!important}.pet-identity-card__data dd{min-height:9px!important;font-size:8.8px!important}.pet-identity-card__data--wide dd{font-size:9.4px!important}.pet-identity-card__foot{display:none!important;}
  .wordmark__mark,.site-header.is-fixed .wordmark__mark,.overlay-mobile-brand .wordmark__mark,.overlay-site-brand .wordmark__mark,.pet-id-head__wordmark .wordmark__mark{width:38px!important;}
  .wordmark strong,.site-header.is-fixed .wordmark strong,.overlay-mobile-brand strong,.overlay-site-brand strong,.pet-id-head__wordmark strong{font-size:15px!important;}
  .wordmark small{max-width:165px;font-size:7px!important;}
  .hero{min-height:680px!important;}
  .hero-deck{height:414px!important;padding-inline:8vw!important;scroll-padding-inline:8vw!important;}
  .hero-deck .eco-card,
  .hero-deck .eco-card--academy,
  .hero-deck .eco-card--wash,
  .hero-deck .eco-card--xiaota,
  .hero-deck .eco-card--social,
  .hero-deck .eco-card--territory{
    flex-basis:84vw!important;
    width:84vw!important;
    height:348px!important;
    min-height:348px!important;
    border-radius:27px!important;
  }
  .hero-deck .eco-card__body,.hero-deck .eco-card__body--feature{left:22px!important;right:22px!important;top:26px!important;}
  .hero-deck .eco-card h2,.hero-deck .eco-card--xiaota h2{font-size:26px!important;}
  .hero-deck .eco-card__tag{font-size:10.5px!important;margin-bottom:18px!important;}
  .hero-deck .eco-card p{font-size:10.8px!important;line-height:1.72!important;}
  .hero-deck .eco-card__detail{left:22px!important;bottom:24px!important;}
  .news-list__item,.news-more-card{grid-template-columns:96px minmax(0,1fr)!important;}
  .news-list__item img,.news-more-card__media{width:96px!important;height:100px!important;}
  .news-list__item span{min-height:100px!important;padding:12px!important;}
  .eco-detail{padding-left:14px!important;padding-right:14px!important;}
  .eco-detail__switcher{width:calc(100% + 28px)!important;margin-left:-14px!important;margin-right:-14px!important;padding-left:14px!important;padding-right:14px!important;}
  .eco-detail__title-row h2{font-size:31px!important;}
  .eco-detail__visual{aspect-ratio:1/1!important;}
}

@media (orientation:landscape) and (max-height:560px) and (max-width:1080px){
  .site-header,.site-header:not(.is-fixed),.site-header.is-fixed{left:0!important;right:0!important;width:100%!important;transform:none!important;padding-left:max(18px,var(--safe-left))!important;padding-right:max(18px,var(--safe-right))!important;}
  .main-nav{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;padding:70px 34px max(22px,var(--safe-bottom))!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:0!important;background:rgba(12,13,14,.985)!important;transform:translateX(105%)!important;}
  .site-header.menu-visible .main-nav{transform:none!important;}
  .main-nav a{width:100%!important;padding:11px 0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;font-size:18px!important;}
  .hero{min-height:560px!important;height:100svh!important;}
  .site-header,.site-header:not(.is-fixed),.site-header.is-fixed{height:64px!important;padding-top:max(10px,calc(var(--safe-top) + 6px))!important;}
  .wordmark__mark,.site-header.is-fixed .wordmark__mark{width:34px!important;}
  .wordmark strong,.site-header.is-fixed .wordmark strong{font-size:14px!important;}
  .wordmark small{display:none!important;}
  .hero-deck{height:330px!important;bottom:54px!important;padding-top:8px!important;}
  .hero-deck .eco-card,
  .hero-deck .eco-card--academy,
  .hero-deck .eco-card--wash,
  .hero-deck .eco-card--xiaota,
  .hero-deck .eco-card--social,
  .hero-deck .eco-card--territory{height:270px!important;min-height:270px!important;max-width:420px!important;}
  .hero-deck .eco-card__body,.hero-deck .eco-card__body--feature{top:22px!important;}
  .hero-deck .eco-card p{-webkit-line-clamp:2!important;}
  .hero-deck__pagination{bottom:42px!important;}
  .hero-ticker{height:32px!important;}
}

@media (hover:none),(pointer:coarse){
  .eco-card:hover,
  .news-card--feature:hover,
  .news-list__item:hover,
  .news-more-card:hover,
  .partners-track:hover{filter:none!important;}
  .news-card--feature:hover .news-card__feature-media img,
  .news-list__item:hover img,
  .news-more-card:hover img{transform:none!important;}
}

@media (max-width:360px){
  .pet-card-stack{--pet-card-width:calc(100vw - 36px)!important;height:260px!important;}
  .pet-card-stack--passport{--pet-card-width:min(calc(100vw - 36px),300px)!important;aspect-ratio:426.85 / 595.26!important;}
  .pet-identity-card{padding:8px 10px!important;}
  .pet-identity-card__top{padding-bottom:4px!important;}
  .pet-identity-card__top span{font-size:6.5px!important}.pet-identity-card__top b{font-size:7px!important;}
  .pet-identity-card__hero{gap:8px!important;padding:3px 0 3px!important;}
  .pet-identity-card__avatar{flex-basis:34px!important;width:34px!important;height:34px!important;border-radius:9px!important;}
  .pet-identity-card__hero small{font-size:6.3px!important}.pet-identity-card__hero h3{margin:2px 0 1px!important;font-size:15px!important}.pet-identity-card__hero p{font-size:7.5px!important;}
  .pet-identity-card__data div{padding:2.5px 4px!important}.pet-identity-card__data dt{margin-bottom:1px!important;font-size:6.8px!important;line-height:1.15!important}.pet-identity-card__data dd{min-height:9px!important;font-size:8.5px!important;line-height:1.18!important}.pet-identity-card__data--wide dd{font-size:9.2px!important;}
  .pet-identity-card{transform:translate3d(calc(-50% - 4px),calc(-50% + 7px),22px) rotateZ(-1.5deg)!important;}
  .pet-identity-card-back{transform:translate3d(calc(-50% + 7px),calc(-50% - 6px),0) rotateZ(2.3deg)!important;}
  .pet-id-stage[data-state="focused"] .pet-identity-card{transform:translate3d(calc(-50% - 3px),calc(-50% + 5px),25px) rotateZ(-1deg)!important;}
  .pet-id-stage[data-state="focused"] .pet-identity-card-back{transform:translate3d(calc(-50% + 8px),calc(-50% - 7px),0) rotateZ(2.5deg)!important;}
  .pet-id-stage[data-state="querying"] .pet-identity-card{transform:translate3d(-50%,-50%,26px) rotateZ(0deg)!important;}
  .pet-id-stage[data-state="querying"] .pet-identity-card-back{transform:translate3d(calc(-50% + 4px),calc(-50% - 2px),0) rotateZ(.8deg)!important;}
  .pet-id-stage[data-state="success"] .pet-identity-card{transform:translate(calc(-50% - 2px),calc(-50% + 5px))!important;}
  .pet-id-stage[data-state="success"] .pet-identity-card-back{transform:translate(calc(-50% + 7px),calc(-50% - 6px)) rotate(2.2deg)!important;}
}

/* =========================================================
   生态链页（ecosystem.html）响应式覆盖
   仅断点表现层；组件定义见 ecosystem.css。
   ========================================================= */
@media (max-width:1080px){
  .eco-advantages__grid{grid-template-columns:1fr!important;gap:22px!important;}
  .eco-cooperation__grid{grid-template-columns:1fr!important;gap:34px!important;}
  .eco-adv-card__overlay{padding:24px 26px 26px!important;}
  .eco-adv-card__title{font-size:28px!important;}
  .eco-adv-card__desc{font-size:16px!important;}
}

@media (max-width:768px){
  .eco-hero{height:clamp(200px,26vw,300px)!important;}
  .eco-hero__mask{background:linear-gradient(90deg,#2c2c2c 24%,rgba(44,44,44,.15) 100%)!important;}
  .eco-hero__contact{margin-top:26px!important;font-size:15px!important;}
  .eco-advantages__title{font-size:40px!important;}
  .eco-advantages__lead{font-size:16px!important;}
  .eco-cooperation__title{font-size:40px!important;}
  .eco-cooperation__subtitle{font-size:16px!important;}
  .eco-cooperation__desc{font-size:15px!important;}
  .eco-media{aspect-ratio:16/10!important;}
}

@media (max-width:480px){
  .eco-hero__title{font-size:30px!important;}
  .eco-hero__subtitle{font-size:15px!important;}
  .eco-advantages{padding:48px 0!important;}
  .eco-advantages__title{font-size:32px!important;}
  .eco-adv-card__no{font-size:60px!important;}
  .eco-adv-card__title{font-size:24px!important;}
  .eco-adv-card__desc{font-size:14px!important;line-height:1.72!important;}
  .eco-adv-card__overlay{padding:20px 18px 22px!important;}
  .eco-cooperation{padding:54px 0!important;}
  .eco-cooperation__title{font-size:32px!important;}
  .eco-cooperation__desc{font-size:14px!important;line-height:1.8!important;}
  .eco-media__label{font-size:38px!important;}
}

@media (max-width:768px) and (orientation:landscape){
  .eco-hero{height:clamp(200px,46vh,320px)!important;}
}