/* ============================================================
   thenet.ie — shared design foundation for inner pages.
   Enqueued site-wide on the Inner page template (see functions.php).
   Page-specific CSS belongs in assets/css/pages/{slug}.css OR,
   during migration, only the unique rules stay in the HTML block.
   Fonts load from assets/css/fonts.css (site-wide).
   ============================================================ */

.tn-page{
  --navy-950:#020c1f; --navy-900:#031530; --navy-870:#051a3a; --navy-850:#07203f;
  --navy-800:#0a2649; --navy-700:#12386a;
  --blue:#2794fc; --blue-bright:#56adff; --blue-soft:#8cc6ff; --blue-deep:#1565c4;
  --gold:#ffc921; --gold-bright:#ffd95c; --gold-deep:#e0a900;
  --green:#36d399; --green-soft:#8ef0cd;
  --coral:#ff6b52;
  --pink:#ff5a8a;
  --grad-green:linear-gradient(135deg,#36d399 0%,#15976a 100%);
  --t-hi:#ffffff; --t-mid:#b9c8e2; --t-low:#7d90b4;
  --surface-1:rgba(255,255,255,.035); --surface-2:rgba(255,255,255,.06); --surface-3:rgba(255,255,255,.09);
  --hairline:rgba(255,255,255,.10); --hairline-2:rgba(255,255,255,.16);
  --grad-blue:linear-gradient(135deg,#2794fc 0%,#1565c4 100%);
  --grad-gold:linear-gradient(135deg,#ffd95c 0%,#ffc921 100%);
  --grad-band:linear-gradient(120deg,#051a3a 0%,#0a2a5e 55%,#14559e 100%);
  --grad-hero:radial-gradient(120% 120% at 70% 12%,rgba(39,148,252,.40) 0%,rgba(39,148,252,.04) 42%,transparent 66%),linear-gradient(168deg,#04193a 0%,#031530 60%);
  --ease:cubic-bezier(.22,1,.36,1);
  --shadow-deep:0 30px 70px rgba(0,0,0,.5);
  --shadow-gold:0 14px 34px rgba(255,201,33,.32);
  --font-display:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-body:'Hanken Grotesk',system-ui,sans-serif;
  --font-mono:'Space Mono',ui-monospace,monospace;
  background:var(--navy-900); color:var(--t-hi); font-family:var(--font-body);
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.tn-page *{box-sizing:border-box;}
.tn-page ::selection{background:var(--gold); color:var(--navy-900);}
.tn-page h1,.tn-page h2,.tn-page h3,.tn-page h4{margin:0; font-family:var(--font-display);}
.tn-page p{margin:0;}
.tn-page a{color:inherit; text-decoration:none;}
.tn-page img{max-width:100%; display:block;}
.tn-page svg{display:block;}

/* --- layout --- */
.tn-container{width:100%; max-width:1200px; margin:0 auto; padding:0 32px;}
.tn-container--narrow{max-width:880px;}
.tn-section{padding:104px 0;}
.tn-head{max-width:720px;}
.tn-head--center{margin:0 auto; text-align:center;}
.tn-eyebrow{display:inline-flex; align-items:center; gap:9px; font-family:var(--font-mono);
  font-weight:700; font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold);}
.tn-eyebrow::before{content:""; width:22px; height:1.5px; background:currentColor;}
.tn-head h2{font-weight:800; font-size:clamp(2rem,3.4vw,3.1rem); line-height:1.08; letter-spacing:-.025em; margin-top:18px;}
.tn-head .tn-sub{font-size:18.5px; line-height:1.6; color:var(--t-mid); margin-top:18px;}
.tn-row-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap; margin-bottom:52px;}

/* --- buttons --- */
.tn-btn{font-family:var(--font-display); font-weight:700; border:none; border-radius:10px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; gap:9px; white-space:nowrap;
  letter-spacing:-.01em; padding:14px 26px; font-size:15px; transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease);}
.tn-btn .tn-i{width:17px; height:17px;}
.tn-btn--lg{padding:17px 34px; font-size:16.5px;}
.tn-btn--lg .tn-i{width:19px; height:19px;}
.tn-btn--sm{padding:10px 18px; font-size:14px;}
.tn-btn--primary{background:var(--grad-gold); color:var(--navy-900); box-shadow:0 2px 10px rgba(255,201,33,.18);}
.tn-btn--primary:hover{transform:translateY(-1px); box-shadow:var(--shadow-gold);}
.tn-btn--ghost{background:transparent; color:#fff; border:1.5px solid var(--hairline);}
.tn-btn--ghost:hover{background:var(--surface-2); border-color:var(--hairline-2); transform:translateY(-1px);}
.tn-btn--block{width:100%;}

/* --- badges / stars / icons --- */
.tn-badge{display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-weight:700;
  font-size:11px; letter-spacing:.06em; text-transform:uppercase; border-radius:999px; padding:5px 11px; white-space:nowrap;}
.tn-badge--blue{background:rgba(39,148,252,.16); color:var(--blue-bright); border:1px solid rgba(39,148,252,.34);}
.tn-badge--gold{background:rgba(255,201,33,.14); color:var(--gold-bright); border:1px solid rgba(255,201,33,.3);}
.tn-badge--solid{background:var(--gold); color:var(--navy-900); border:1px solid transparent;}
.tn-badge .tn-dot{width:7px; height:7px; border-radius:50%; background:currentColor;}
.tn-stars{display:inline-flex; gap:2px;}
.tn-stars svg{width:15px; height:15px; fill:var(--gold);}
.tn-i{width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}

/* --- scroll reveal (used on many inner pages) --- */
.tn-reveal{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease),transform .6s var(--ease);}
.tn-reveal.tn-in{opacity:1; transform:none;}
