/* Accessibility and mobile polish: readable source alias. */
/* Navigation and reading improvements shared by the four information portals. */
.nav .icon-link svg{stroke-width:1.8}
.nav .icon-link:focus-visible,.footer-directory summary:focus-visible{outline:3px solid #1d1d1f;outline-offset:3px;border-radius:4px}
.hero.apple-hero .device.banner picture{display:block;width:100%;height:100%}
.hero.apple-hero .hero-copy .hero-guide{display:inline-flex;align-items:center;gap:8px;margin:0 0 10px;color:#fff;font-size:12px;font-weight:650;line-height:1.4;text-decoration:underline;text-underline-offset:4px}
.hero.apple-hero .hero-copy h1{color:var(--accent-soft,#fff)}
.hero.apple-hero .hero-copy .gradient{background:none;-webkit-text-fill-color:currentColor;color:var(--accent-soft,#fff)}
.theme-koko .hero.apple-hero .hero-copy h1,.theme-koko .hero.apple-hero .hero-copy .gradient{color:#fff0c2}
.hero.apple-hero .hero-copy .lead{color:#f3f3f5}
.hero.apple-hero .hero-copy .access-note{max-width:36rem;margin:12px auto 0;color:#e1e1e5;font-size:12px;line-height:1.5;text-wrap:balance}
.hero.apple-hero .hero-copy .actions .pill{white-space:normal;text-align:center}
.theme-koko .hero.apple-hero .hero-copy .pill.primary{background:#ffca65;color:#271700}
.theme-sigacor .category-icon{color:#495464;background:#e8ebf1}
.theme-sigacor .category-card{border-color:#c9ced8}
.feature-grid .feature-card:before{content:none}
.feature-grid .feature-card>.feature-art{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;border-radius:inherit}
.footer-directory .footer-group{min-width:0}
.footer-directory .footer-group summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;color:#1d1d1f;font-size:13px;font-weight:650;cursor:pointer;list-style:none}
.footer-directory .footer-group summary::-webkit-details-marker{display:none}
.footer-directory .footer-group summary:after{content:"+";font-size:20px;line-height:1;font-weight:400}
.footer-directory .footer-group[open] summary:after{content:"\2212"}
.footer-directory .footer-group:not([open])>ul{display:none}
.footer-directory .footer-group[open]>ul{display:block}
.footer-directory .footer-group ul{margin:0;padding:0 0 12px;list-style:none}
.footer-directory .footer-group a{min-height:44px;display:flex;align-items:center;padding-block:6px;font-size:13px}
@media(min-width:1200px){
  .hero.apple-hero .hero-copy h1{font-size:clamp(2rem,3.1vw,3rem);line-height:1.02}
  .hero.apple-hero .hero-copy .lead{margin-top:12px;font-size:clamp(14px,1.05vw,17px);line-height:1.5}
  .hero.apple-hero .hero-copy .actions{margin-top:18px}
  .product-section{padding-top:64px}
  .product-section .section-head h2{font-size:clamp(2.5rem,3.6vw,3.5rem)}
}
@media(max-width:699px){
  .hero.apple-hero .hero-stage{display:block;background:#000}
  .hero.apple-hero .device.banner{position:relative;inset:auto;width:100%;height:clamp(140px,38vw,210px);overflow:hidden}
  .hero.apple-hero .device.banner img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:22% center}
  .hero.apple-hero .device.banner:after{background:linear-gradient(0deg,#000,transparent 55%)}
  .hero.apple-hero .hero-copy{position:relative;inset:auto;width:100%;height:auto;margin:0;padding:8px 20px 32px;transform:none;background:#000;align-items:center;text-align:center}
  .hero.apple-hero .hero-copy h1{max-width:100%;font-size:clamp(30px,8.5vw,38px);line-height:1.05}
  .hero.apple-hero .hero-copy .lead{max-width:32rem;margin:14px auto 0;padding:0;font-size:15px;line-height:1.55}
  .hero.apple-hero .hero-copy .actions{display:grid;grid-template-columns:1fr;width:100%;gap:10px;margin-top:20px}
  .hero.apple-hero .hero-copy .actions .pill{min-height:46px;width:100%;max-width:none;padding:10px 16px;font-size:14px}
  .hero.apple-hero .hero-copy .access-note{margin-top:12px;font-size:12px}
  .product-section{padding-top:40px}
  .product-section .section-head h2{font-size:32px;line-height:1.08}
  .product-section .section-description{font-size:15px;line-height:1.6}
  .feature-grid .feature-card{min-height:280px;aspect-ratio:auto;padding:20px 16px}
  .feature-grid .feature-card h3,.feature-grid .feature-card p{width:61%;max-width:61%}
  .feature-grid .feature-card h3{font-size:23px;line-height:1.08}
  .feature-grid .feature-card p{margin-top:10px;font-size:13px;line-height:1.45}
  .feature-grid .feature-card .tile-kicker{font-size:12px;line-height:1.4}
  .feature-grid .feature-card .tile-action{min-height:44px;font-size:13px;line-height:1.4}
  .footer-directory{display:block;padding:8px 0}
  .footer-directory .footer-group{padding:0;border-bottom:1px solid #d2d2d7}
  .footer-directory .footer-group summary{min-height:50px;font-size:14px}
  .footer-directory .footer-group ul{padding-bottom:12px}
  .site-footer .footer-note,.site-footer .footer-help{font-size:13px;line-height:1.65}
}
/*
  v1 landing pages: mobile polish patch
  Apply after the existing usability.css on:
  v1.bm88.care, v1.jpdewa.care, v1.koko88.care, v1.sigacor88.care
*/

@media (max-width: 734px) {
  /* Keep the hero artwork inside the viewport instead of rendering an
     660–800px canvas and clipping it on 320–412px screens. */
  .apple-panel .apple-product-art {
    display: block;
    width: min(100%, 560px) !important;
    max-width: 100% !important;
    height: auto;
    margin-inline: auto;
  }

  .apple-panel.apple-brand-panel .apple-product-art {
    width: min(100%, 430px) !important;
  }

  .apple-tile .apple-tile-art,
  .apple-gallery-card img,
  .apple-resource-card img {
    max-width: 100%;
    height: auto;
  }

  /* Preserve comfortable tap targets for compact inline support links. */
  .apple-callout a,
  footer a {
    display: inline-block;
    min-height: 32px;
    padding-block: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .apple-gallery-track,
  .apple-resource-track,
  .apple-product-art,
  .apple-tile-art {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}