/* ==========================================================================
   Boosturn — Shared CSS (Phase 1: establish shared css)
   Boosturn Implementation Plan v2

   Scope: verbatim-identical rules only, moved out of page-level <style>
   blocks with no change to their declared values. Do not add page-specific
   styles, typography, breakpoints other than what shipped in Phase 1, or
   component work here — see Design System Proposal v1 for that (Phase 2+).
   ========================================================================== */

/* Phase 2: design tokens (see PRE-CHECK report in chat — --radius-pill
   intentionally omitted, no matching literal exists in this file) */
:root{
  --color-primary:#49BDC7;
  --color-primary-light:#a8e8ee;
  --color-secondary:#07213A;
  --color-on-ghost:#fff;
  --container-max:1530px;
  --container-pad-desktop:60px;
  --container-pad-mobile:22px;
}

/* Global reset — moved from header.php, unchanged */
*{box-sizing:border-box;}
img{max-width:100%;height:auto;}

/* Container — verbatim-identical in page-home.php / page-about.php / page-product.php */
.wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad-desktop);}
@media(max-width:900px){.wrap{padding:0 var(--container-pad-mobile);}}

/* Regression fix: page-home.php / page-about.php / page-product.php each wrap their
   content in <div class="bt"> with an inline reset ".bt *{margin:0;padding:0;}" (their
   own page-local <style>, unchanged by this file). That reset ties .wrap's specificity
   (0,1,0 vs 0,1,0) and now wins on source order, because .wrap moved into this
   earlier-loading shared file while the reset stayed page-local and later in the
   cascade — zeroing .wrap's padding/margin on those three pages only. Restore it with
   a selector scoped to the exact .bt->.wrap combination (0,2,0, no !important needed).
   News/Investors/Contact/Privacy define their own page-local .np-wrap/.bti-wrap/
   .btc-wrap/.btp-wrap and never match plain .wrap, so they are unaffected either way. */
.bt .wrap{margin:0 auto;padding:0 var(--container-pad-desktop);}
@media(max-width:900px){.bt .wrap{padding:0 var(--container-pad-mobile);}}

/* Button color/state modifiers — verbatim-identical in page-home.php / page-about.php /
   page-product.php (page-about.php has no .btn-text usage; harmless if unused there).
   NOTE: the base .btn{} rule is intentionally NOT moved here. PRE-CHECK found
   page-about.php's .btn{} is missing letter-spacing:.02em (present in
   page-home.php / page-product.php), so it is not byte-identical across the
   three files and stays page-local pending a real comparison in a later phase. */
.btn-primary{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light));color:var(--color-secondary)!important;}
.btn-ghost{border:1px solid rgba(255,255,255,.15);color:var(--color-on-ghost);background:transparent;}
.btn-text{color:var(--color-primary);background:transparent;padding:9px 0;font-size:17px;font-weight:600;border:none;cursor:pointer;font-family:'Inter','Noto Sans TC',sans-serif;display:inline-block;}

/* Phase 3A: nav base CSS, moved verbatim from header.php lines 11-32 (unchanged) */
  .bt-nav{position:fixed;top:0;left:0;right:0;z-index:9999;background:rgba(4,14,28,.95);border-bottom:1px solid rgba(73,189,199,.08);}
  .bt-nav::before{content:'';position:absolute;inset:0;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:-1;pointer-events:none;}
  .bt-nav-wrap{max-width:1530px;margin:0 auto;padding:0 60px;height:64px;display:flex;align-items:center;justify-content:space-between;}
  @media(max-width:900px){.bt-nav-wrap{padding:0 24px;}}
  .bt-logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
  .bt-logo-txt{font-family:'Noto Sans TC','Helvetica Neue',sans-serif;font-size:22px;font-weight:900;background:linear-gradient(120deg,#ffffff,var(--color-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em;}
  .bt-nav-links{display:flex;gap:28px;align-items:center;}
  .bt-nav-links a{color:#c8dde8;font-size:15px;font-weight:500;text-decoration:none;font-family:'Inter','Noto Sans TC',sans-serif;transition:color .2s;white-space:nowrap;}
  .bt-nav-links a:hover,.bt-nav-links a.active{color:var(--color-primary);}
  .bt-nav-cta{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light))!important;color:var(--color-secondary)!important;padding:10px 22px!important;border-radius:999px!important;font-weight:600!important;font-family:'Inter','Noto Sans TC',sans-serif;transition:opacity .2s!important;}
  .bt-nav-cta:hover{opacity:.88!important;}
  .bt-nav-links a.bt-nav-cta,.bt-nav-links a.bt-nav-cta:visited{color:var(--color-secondary)!important;}
  .bt-ham{display:none;background:none;border:none;cursor:pointer;padding:6px;flex-direction:column;gap:5px;align-items:flex-end;}
  .bt-ham span{display:block;height:2px;background:#c0d4e4;border-radius:2px;transition:all .3s;}
  .bt-ham span:nth-child(1){width:22px;}.bt-ham span:nth-child(2){width:14px;}.bt-ham span:nth-child(3){width:22px;}
  @media(max-width:900px){
    .bt-ham{display:flex;}
    .bt-nav-links{display:none;position:fixed;top:64px;left:0;right:0;bottom:0;z-index:9990;background:#040e1c;flex-direction:column;padding:32px 24px;gap:24px;border-top:1px solid rgba(73,189,199,.1);overflow-y:auto;}
    .bt-nav-links.open{display:flex;}
    .bt-nav-links a{font-size:17px;}
    .bt-nav-cta{text-align:center!important;}
  }

/* Phase 4A: button hover states, verbatim-identical across page-home/about/product */
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 12px 32px rgba(73,189,199,.3);}
.btn-ghost:hover{border-color:rgba(73,189,199,.5);background:rgba(73,189,199,.05);transform:translateY(-2px);}

/* Phase 6: extended health-tech design tokens. Additive only — --color-primary and the
   container tokens above are unchanged. Page-local CSS still hardcodes hex values in
   many places; these tokens are the source of truth for NEW rules added in this pass
   and for the surface/text colors introduced across the seven templates. */
:root{
  --color-bg:#061321;
  --color-bg-deep:#081827;
  --color-surface:#0B2135;
  --color-surface-raised:#102A40;
  --color-text:#E8F4F8;
  --color-text-muted:#A9BDCC;
  --color-reaction:#E8B85C;
}

/* Keyboard focus — nav links and shared buttons only had :hover before this pass */
.bt-nav-links a:focus-visible,
.btn-primary:focus-visible,
.btn-ghost:focus-visible,
.btn-text:focus-visible,
.bt-nav-cta:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:4px;}

/* Reduced motion: every page's decorative/scan/reveal animation is frozen here in one
   place rather than hunting each page's own @keyframes list. Content stays fully
   readable with motion off — nothing here depends on an animation to reveal content. */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}
}