/*
 * Apple design layer: shared tokens and components (homepage port, 2026-11).
 * Hand-ported from outputs/apple-store-2026-11-04/build2/partials/css-tokens.html.
 *
 * Nothing here targets :root, html or body. The tokens live on .neo-apple, and every
 * component rule is written X:where(.neo-apple, .neo-apple *), so a rule applies when
 * the element itself carries the class (a chrome root: header.gn, footer.ft,
 * dialog.ss, a.pp-skip, a.pp-wa) or sits inside an element that does (the home body).
 * var(--font) and the other tokens are invalid outside .neo-apple: a body font
 * override elsewhere must use the literal Geist stack.
 *
 * The chrome fallbacks (.gn-bar, .mb, .gn-lang__menu, .gn-curtain, .pp-wa,
 * .ss::backdrop) live in apple-nav.css and apple-search.css.
 */
@font-face{font-family:"Geist";src:url("../fonts/geist/Geist-Variable-latin.f4634c3bc1fa.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}

.neo-apple{
  --font:"Geist",-apple-system,blinkmacsystemfont,"segoe ui",roboto,"helvetica neue",arial,sans-serif;
  /* Geist tracking calibrated against SF Pro (owner decision 4) */
  --tr-xl:-.025em;--tr-l:-.02em;--tr-m:-.01em;--tr-s:.005em;
  --fg:#1d1d1f;
  --fg-2:#6e6e73;
  --fg-3:#86868b;
  --gn-fg:rgba(0,0,0,.8);
  --gn-item:#333336;
  --note:rgba(0,0,0,.56);
  --note-link:rgba(0,0,0,.72);
  --bg:#fff;--bg-alt:#f5f5f7;--bg-nav:#fafafc;--bg-tint:#eef6f8;--bg-dark:#0a1820;
  --fg-on-dark:#f5f5f7;
  --fg-on-dark-2:#a1a1a6;
  --cyan:#00d6e1;
  --brand:#0098ae;
  --action:#007a8c;
  --action-hover:#006b7b;
  --action-pressed:#005f6d;
  --chip-tint:rgba(0,152,174,.10);
  --sep:#d2d2d7;--sep-soft:#e8e8ed;--keyline:rgba(0,0,0,.16);
  --grad-ink:linear-gradient(100deg,#0a2a3f 0%,#0b4a5e 45%,#007a8c 100%);
  --glass:rgba(250,250,252,.8);--glass-solid:rgba(250,250,252,.92);
  --platter:rgba(232,232,237,.72);
  --curtain:rgba(232,232,237,.4);
  --scrim-chip:rgba(29,29,31,.64);
  --wa:#0b8f3a;
  --r-sheet:6px;--r-card:28px;--r-tile:18px;--r-option:12px;--r-chip:8px;--r-capsule:980px;
  --sh-sheet:0 1px 1px rgba(7,25,40,.04),0 12px 24px -12px rgba(7,25,40,.14),0 40px 80px -24px rgba(7,25,40,.22);
  --sh-sheet-sm:0 1px 2px rgba(7,25,40,.06),0 8px 20px -10px rgba(7,25,40,.18);
  --sh-float:0 0 0 1px rgba(0,0,0,.06),0 18px 40px -12px rgba(7,25,40,.22);
  --ease-ui:cubic-bezier(.4,0,.6,1);--ease-reveal:cubic-bezier(.28,.11,.32,1);
  --w-wide:min(87.5vw,1260px);--w-text:min(87.5vw,980px);--w-narrow:min(87.5vw,692px);
  --pad-chapter:144px;--pad-sub:120px;--pad-dark:160px;
  --ln-h:52px;
  /* The mock's html{} and body{} rules, folded into the scope */
  -webkit-text-size-adjust:100%;text-size-adjust:100%;
  scroll-padding-top:calc(var(--ln-h) + 16px);scroll-padding-bottom:96px;
  background:var(--bg);color:var(--fg);
  font:400 17px/1.4706 var(--font);letter-spacing:0;font-synthesis:none;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
@media (max-width:1068px){.neo-apple{--pad-chapter:120px;--pad-sub:96px;--pad-dark:120px}}
@media (max-width:734px){.neo-apple{--pad-chapter:96px;--pad-sub:80px;--pad-dark:112px;--ln-h:48px}}

/* Focus rings */
:where(.neo-apple, .neo-apple *):focus-visible{outline:2px solid var(--action);outline-offset:3px;border-radius:4px}

/* Skip link (first focusable element of every page; targets #site-content) */
.pp-skip:where(.neo-apple, .neo-apple *){position:absolute;left:12px;top:-60px;z-index:10002;padding:8px 14px;border-radius:var(--r-capsule);background:var(--fg);color:#fff;font-size:12px;line-height:1.3334;letter-spacing:var(--tr-s);text-decoration:none}
.pp-skip:where(.neo-apple, .neo-apple *):focus{top:8px}
.pp-skip:where(.neo-apple, .neo-apple *):hover{text-decoration:none}

/* Gradient text */
.pp-grad:where(.neo-apple, .neo-apple *){background:var(--grad-ink);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

/* Buttons */
.pp-btn:where(.neo-apple, .neo-apple *){display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 21px;border-radius:var(--r-capsule);font-size:17px;line-height:1.1765;font-weight:400;letter-spacing:0;border:1px solid transparent;text-decoration:none;transition:background-color .2s var(--ease-ui),color .2s var(--ease-ui)}
.pp-btn:where(.neo-apple, .neo-apple *):hover{text-decoration:none}
.pp-btn--primary:where(.neo-apple, .neo-apple *){background:var(--action);color:#fff}
.pp-btn--primary:where(.neo-apple, .neo-apple *):hover{background:var(--action-hover)}
.pp-btn--primary:where(.neo-apple, .neo-apple *):active{background:var(--action-pressed)}
.pp-btn--secondary:where(.neo-apple, .neo-apple *){border-color:var(--action);color:var(--action);background:transparent}
.pp-btn--secondary:where(.neo-apple, .neo-apple *):hover{background:var(--action-hover);border-color:var(--action-hover);color:#fff}
.pp-btn--light:where(.neo-apple, .neo-apple *){background:var(--fg-on-dark);color:var(--fg)}
.pp-btn--light:where(.neo-apple, .neo-apple *):hover{background:#fff}
.pp-btn--block:where(.neo-apple, .neo-apple *){display:flex;width:100%}
.pp-btn--sm:where(.neo-apple, .neo-apple *){min-height:32px;padding:6px 15px;font-size:14px;letter-spacing:var(--tr-s)}

/* Image chip ("Exemplo demonstrativo") */
.pp-chip:where(.neo-apple, .neo-apple *){position:absolute;left:20px;bottom:20px;z-index:2;padding:4px 10px;border-radius:var(--r-chip);font-size:12px;line-height:1.3334;font-weight:600;letter-spacing:var(--tr-s);color:#fff;background:var(--scrim-chip);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pp-chip--right:where(.neo-apple, .neo-apple *){left:auto;right:20px}
@media (max-width:734px){
  .pp-chip:where(.neo-apple, .neo-apple *){left:12px;bottom:12px}
  .pp-chip--right:where(.neo-apple, .neo-apple *){left:auto;right:12px}
}

/* User preferences: these components only */
@media (prefers-reduced-motion:reduce){
  .pp-btn:where(.neo-apple, .neo-apple *){transition:none}
}
@supports not (backdrop-filter:blur(1px)){
  .pp-chip:where(.neo-apple, .neo-apple *){background:rgba(29,29,31,.86)}
}
@media (prefers-reduced-transparency:reduce){
  .pp-chip:where(.neo-apple, .neo-apple *){background:#1d1d1f;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-contrast:more){
  .neo-apple{--fg-2:#424245;--note:rgba(0,0,0,.8);--keyline:rgba(0,0,0,.4);--sep:#86868b;--fg-on-dark-2:#d2d2d7}
  .pp-grad:where(.neo-apple, .neo-apple *){background:none;color:var(--fg);-webkit-text-fill-color:currentColor}
  .pp-btn--secondary:where(.neo-apple, .neo-apple *){border:1px solid #1d1d1f}
  .pp-chip:where(.neo-apple, .neo-apple *){background:#1d1d1f;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (forced-colors:active){
  .pp-grad:where(.neo-apple, .neo-apple *){background:none;color:CanvasText;-webkit-text-fill-color:CanvasText;forced-color-adjust:none}
  .pp-btn:where(.neo-apple, .neo-apple *){border:1px solid ButtonText}
  .pp-chip:where(.neo-apple, .neo-apple *){border:1px solid CanvasText}
}
@media print{
  .pp-skip:where(.neo-apple, .neo-apple *){display:none!important}
  .pp-grad:where(.neo-apple, .neo-apple *){background:none!important;color:#000!important;-webkit-text-fill-color:#000!important}
}
