/* App panels use the same keyboard and ARIA behavior as the device tabs. */
.apps-section__tabs{gap:0;border-bottom:1px solid rgb(255 255 255 / .3);margin-bottom:32px}
.apps-section__tabs [role="tab"]{position:relative;flex:1;min-width:0;min-height:44px;padding:0 0 18px;border:0;background:none;color:rgb(255 255 255 / .7);font:inherit;text-align:left;cursor:pointer}
.apps-section__tabs [role="tab"][aria-selected="true"]{color:#fff}
.apps-section__tabs [role="tab"][aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:4px;background:var(--color-light-blue)}
.apps-section__tabs [role="tab"]:hover{color:#fff}
.apps-section__tabs [role="tab"]:focus-visible,.apps-section__panel:focus-visible{outline:2px solid var(--color-light-blue);outline-offset:5px}
.apps-section__panel[hidden]{display:none}
.apps-section__panel>p{line-height:24px}
.apps-section__stores .apps-section__download{width:auto;min-height:46px;line-height:22px;background:white;color:var(--color-action-blue);text-decoration:none}
.apps-section__footnote{white-space:normal}

/* Static bands meet the exported crop while the device slides into place. */
.apps-section__devices{overflow:hidden}
.apps-section__stripes{z-index:-2;pointer-events:none}
.apps-section__backdrop{z-index:0}
.apps-section__laptop{z-index:1}

@media(min-width:1200px){
  .apps-section__stripes{z-index:0}
}

/* Reflow the content before scaling the original device composition. */
@media(max-width:1199.98px){
  .apps-section{font-size:14px}
  .apps-section__grid{display:grid;grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);gap:0 32px;align-items:start}
  .apps-section__main{grid-column:1/-1;width:auto;max-width:none;display:block;padding-bottom:36px;border-bottom:1px solid rgb(255 255 255 / .2)}
  .apps-section__main::after{display:none}
  .apps-section__main h2{font-size:32px;line-height:1.2;margin-bottom:28px}
  .apps-section__tabs{max-width:420px;font-size:14px;margin-bottom:24px}
  .apps-section__panel{display:grid;grid-template-columns:minmax(0,1fr) 196px;column-gap:40px;align-items:start}
  .apps-section__panel h3{grid-column:1/-1;font-size:21px;line-height:1.3;margin-bottom:14px}
  .apps-section__panel>p{max-width:56ch;line-height:21px}
  .apps-section__stores{flex-direction:column;align-items:start;gap:18px;margin:0}
  .apps-section__stores a,.apps-section__stores a:first-child,.apps-section__stores a:last-child{width:auto;max-width:100%;min-height:44px;display:flex;align-items:center}
  .apps-section__stores img{max-height:40px;width:auto}
  .apps-section__main>.apps-section__footnote{font-size:var(--font-size-min);line-height:1.4;margin-top:24px;max-width:56ch}
  .apps-section__cloud-art{position:relative;grid-column:1;grid-row:2;left:auto;top:auto;width:150px;height:auto;margin:32px 0 20px}
  .apps-section__cloud{position:relative;grid-column:1;grid-row:3;left:auto;top:auto;width:auto;max-width:none;margin:0;gap:22px}
  .apps-section__cloud h3{font-size:21px;line-height:1.3}
  .apps-section__cloud p{line-height:21px}
  .apps-section__cloud p br{display:none}
  .apps-section__cloud .button{font-size:var(--font-size-min);min-height:44px}
  .apps-section__cloud .text-link{font-size:var(--font-size-min);line-height:1.4;gap:12px;min-height:44px}
  .apps-section__devices{display:block;position:relative;grid-column:2;grid-row:2/4;left:auto;top:auto;align-self:center;width:100%;height:auto;aspect-ratio:683/623;margin-top:32px;z-index:0;pointer-events:none}
  .apps-section__backdrop{width:78.77%;height:auto;left:0;top:0;max-width:none}
  .apps-section__laptop{width:77.45%;height:auto;left:22.25%;top:12.52%;max-width:none}
  .apps-section__stripes{left:auto;right:-70px;top:auto;bottom:0;width:190px;height:auto;opacity:.5}
}
/* Tablet keeps both services together without the large device illustration. */
@media(min-width:768px) and (max-width:1199.98px){
  .apps-section::after{content:"";position:absolute;z-index:-1;pointer-events:none;right:-300px;top:50%;width:760px;aspect-ratio:538/623;transform:translateY(-50%);background:url('../img/apps-phone.png') center/contain no-repeat;opacity:.24}
  .apps-section__stripes{display:none}
  .apps-section__grid{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:48px}
  .apps-section__main{grid-column:1;grid-row:1/3;align-self:stretch;display:flex;flex-direction:column;padding-bottom:0;border-bottom:0}
  .apps-section__panel{display:block;margin-bottom:24px}
  .apps-section__main>.apps-section__footnote{display:flex;align-items:center;min-height:44px;margin-top:auto}
  .apps-section__stores{flex-direction:row;flex-wrap:nowrap;gap:20px;margin-top:24px}
  .apps-section__stores a:first-child{max-width:52%}
  .apps-section__stores a:last-child{max-width:42%}
  .apps-section__stores img{width:100%;max-height:40px;object-fit:contain;object-position:left center}
  .apps-section__cloud-art{grid-column:2;grid-row:1;width:140px;margin:0 0 20px}
  .apps-section__cloud{grid-column:2;grid-row:2;align-self:stretch}
  .apps-section__cloud>.text-link{margin-top:auto}
  .apps-section__devices{display:none}
}

/* Phones pair the cloud artwork with its content, without device mockups. */
@media(max-width:767.98px){
  .apps-section::after{content:"";position:absolute;z-index:-1;pointer-events:none;right:-100px;bottom:-90px;width:360px;aspect-ratio:538/623;background:url('../img/apps-phone.png') center/contain no-repeat;opacity:1}
  .apps-section__tabs{max-width:none}
  .apps-section__grid{grid-template-columns:minmax(0,1fr) 150px;gap:0 28px}
  .apps-section__main h2{font-size:28px}
  .apps-section__panel{display:block}
  .apps-section__stores{flex-direction:row;flex-wrap:wrap;gap:16px 24px;margin-top:24px}
  .apps-section__stores a:first-child{max-width:52%}
  .apps-section__stores a:last-child{max-width:42%}
  .apps-section__stores img{width:100%;max-height:40px;object-fit:contain;object-position:left center}
  .apps-section__cloud-art{grid-column:2;grid-row:2;width:150px;margin:40px 0 0}
  .apps-section__cloud{grid-column:1;grid-row:2;max-width:none;margin-top:40px}
  .apps-section__cloud h3{font-size:22px}
  .apps-section__devices,.apps-section__stripes{display:none}
}

@media(max-width:539.98px){
  .apps-section__grid{grid-template-columns:minmax(0,1fr) minmax(80px, 100px);column-gap:16px}
  .apps-section__cloud-art{width:100%;margin-top:32px}
  .apps-section__cloud{margin-top:32px;gap:16px}
  .apps-section__cloud h3{font-size:19px}
  .apps-section::after{right:-140px;bottom:-70px;width:300px}
}

@media(max-width:359.98px){
  .apps-section__grid{grid-template-columns:minmax(0,1fr) 80px}
}