/* links.foxyaudit.tech — one page, no script.
   Every colour below is a foxyaudit.tech token (foxy-sale-page/site.css), except
   --edge, which is new here and is measured against the ground (see README). */

@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/poppins-800.woff2) format('woff2');}

:root{
  --ground:#0b0a12;
  --ink:#f7f1e8;
  --ink-soft:rgba(226,230,240,.62);
  --fox:#ff7a2e;
  --fill-a:rgba(255,255,255,.055);
  --fill-b:rgba(255,255,255,.012);
  /* The row's border is its only edge (the fill is near-invisible by design), so it
     has to clear 3:1 against the ground outside AND the fill inside, at every point
     of the gradient. .40 measures >= 3.72:1 as painted (the fill runs under the
     border) and >= 3.34:1 even if the border sat on bare ground. */
  --edge:rgba(255,255,255,.40);
  --disp:'Poppins',system-ui,sans-serif;
  --body:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box;}
html{background:var(--ground);color-scheme:dark;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;
  font-family:var(--body);color:var(--ink);line-height:1.5;
  background:linear-gradient(160deg,#171225 0%,#0b0a12 55%,#120b08 100%);}
::selection{background:var(--fox);color:var(--ground);}

.page{flex:1;width:100%;max-width:440px;margin:0 auto;padding:56px 16px 16px;}

/* ---- brand ---- */
.brand{text-align:center;margin:0 0 40px;}
.brand-mark{display:inline-block;border-radius:22px;}
.brand-mark img{display:block;}
h1{font-family:var(--disp);font-weight:800;font-size:2rem;line-height:1.1;letter-spacing:-.01em;margin:14px 0 8px;}
.brand p{margin:0 auto;max-width:32ch;font-size:1rem;color:var(--ink-soft);text-wrap:balance;}

/* ---- link groups ---- */
section+section{margin-top:36px;}
/* a group label, one clear step below the row titles: smaller and in the soft ink */
h2{font-family:var(--disp);font-weight:700;font-size:.875rem;line-height:1.3;margin:0 0 12px 4px;color:var(--ink-soft);}
.links{list-style:none;margin:0;padding:0;display:grid;gap:10px;}

.link{display:flex;align-items:center;gap:14px;min-height:64px;padding:12px 16px 12px 18px;
  border-radius:16px;color:var(--ink);text-decoration:none;
  background:linear-gradient(158deg,var(--fill-a),var(--fill-b) 48%,rgba(255,255,255,.03));
  border:1.5px solid var(--edge);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:border-color .16s ease-out,transform .16s ease-out;}
.glyph{flex:none;width:22px;height:22px;fill:var(--fox);}
/* the envelope is drawn, not a brand mark, so it takes the arrow's line weight */
.glyph-line{fill:none;stroke:var(--fox);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.text{flex:1;min-width:0;display:flex;flex-direction:column;}
.title{font-family:var(--disp);font-weight:700;font-size:1rem;line-height:1.3;}
.detail{font-size:.875rem;line-height:1.4;color:var(--ink-soft);overflow-wrap:anywhere;}
.go{flex:none;width:18px;height:18px;fill:none;stroke:var(--ink-soft);stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .16s ease-out,transform .16s ease-out;}

/* hover only where a pointer can hover: a tap must not leave a row stuck lit */
@media (hover:hover){
  .link:hover{border-color:var(--fox);transform:translateY(-2px);}
  .link:hover .go{stroke:var(--fox);transform:translate(2px,-2px);}
}
.link:active{border-color:var(--fox);transform:translateY(0);}

a:focus-visible{outline:2px solid var(--fox);outline-offset:3px;}

/* ---- footer ---- */
.foot{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;
  padding:24px 16px 32px;font-size:.8125rem;color:var(--ink-soft);}
.foot a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ink-soft);text-underline-offset:3px;border-radius:4px;}
@media (hover:hover){ .foot a:hover{text-decoration-color:var(--fox);} }

@media (prefers-reduced-motion:reduce){
  .link,.go{transition:none;}
  .link:hover,.link:active,.link:hover .go{transform:none;}
}

/* Windows High Contrast drops the glass fill and the shadow; the border and the
   marks switch to system colours so every row keeps its edge and its icon. */
@media (forced-colors:active){
  .link{border-color:CanvasText;}
  .glyph{fill:CanvasText;}
  .glyph-line{fill:none;stroke:CanvasText;}
  .go{stroke:CanvasText;}
  .link:hover,.link:focus-visible{border-color:Highlight;}
  .link:hover .go{stroke:Highlight;}
}
