/* Page-specific rules only. Shared styles: tn-base.css + tn-components.css */

/* thenet.ie — Services (page-specific). Shared base: tn-base.css */

.tn-btn--lg{padding:17px 34px; font-size:16.5px;}
.tn-btn--lg .tn-i{width:19px; height:19px;}
.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%;}

/* --- icons --- */
.tn-i{width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}

/* hero visual — "everything under one roof" stack */
.tn-roof{position:relative;}
.tn-roof__card{position:relative; background:linear-gradient(180deg,var(--navy-850),var(--navy-870)); border-radius:28px;
  box-shadow:var(--shadow-deep); border:1px solid var(--hairline-2); padding:22px;}
.tn-roof__bar{display:flex; align-items:center; gap:10px; padding-bottom:16px; margin-bottom:14px; border-bottom:1px solid var(--hairline);}
.tn-roof__bar .live{width:9px; height:9px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(54,211,153,.18);}
.tn-roof__bar b{font-family:var(--font-display); font-weight:700; font-size:14px; color:#fff;}
.tn-roof__bar .tag{margin-left:auto; font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--blue-soft);}
.tn-roof__list{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.tn-roof__row{display:flex; align-items:center; gap:11px; padding:11px 13px; border-radius:13px; background:var(--surface-1); border:1px solid var(--hairline);}
.tn-roof__row .ic{width:32px; height:32px; flex-shrink:0; border-radius:9px; background:rgba(39,148,252,.12); border:1px solid var(--hairline);
  display:flex; align-items:center; justify-content:center;}
.tn-roof__row .ic .tn-i{width:17px; height:17px; color:var(--blue-bright);}
.tn-roof__row span{font-family:var(--font-display); font-weight:600; font-size:13px; color:#fff;}
.tn-roof__metric{position:absolute; bottom:-20px; right:-18px; background:var(--grad-gold); color:var(--navy-900);
  border-radius:14px; padding:12px 16px; box-shadow:var(--shadow-gold); display:flex; align-items:center; gap:10px; white-space:nowrap;}
.tn-roof__metric .tn-i{width:19px; height:19px;}
.tn-roof__metric span{font-family:var(--font-display); font-weight:800; font-size:14px;}

/* ============================================================ INTRO / WHAT WE DO */
.tn-intro{background:var(--navy-900);}
.tn-intro__inner{max-width:880px;}
.tn-intro__inner p{font-size:20px; line-height:1.6; color:var(--t-mid); margin-top:18px;}
.tn-intro__inner strong{color:#fff; font-weight:600;}

/* ============================================================ SERVICES GRID (mirrors homepage tn-svc cards) */
.tn-services{background:var(--navy-950);}
.tn-grid-services{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px;}
.tn-svc{position:relative; display:block; overflow:hidden; padding:26px 24px 24px;
  background:var(--surface-1); border:1px solid var(--hairline); border-radius:20px;
  transition:transform .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease),box-shadow .22s var(--ease);}
.tn-svc::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--accent,var(--blue-bright)); opacity:0; transition:opacity .22s var(--ease);}
.tn-svc:hover{transform:translateY(-4px); background:var(--surface-2); border-color:var(--hairline-2); box-shadow:var(--shadow-deep);}
.tn-svc:hover::before{opacity:1;}
.tn-svc__top{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:18px;}
.tn-svc__icon{width:50px; height:50px; border-radius:14px; background:rgba(39,148,252,.12); border:1px solid var(--hairline);
  display:flex; align-items:center; justify-content:center;}
.tn-svc__icon .tn-i{width:24px; height:24px; color:var(--accent,var(--blue-bright));}
.tn-svc__tag{font-family:var(--font-mono); font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--t-low);}
.tn-svc h3{font-weight:700; font-size:20px; letter-spacing:-.02em; color:#fff; margin-bottom:9px;}
.tn-svc p{font-size:15px; line-height:1.58; color:var(--t-mid);}
.tn-svc__more{display:inline-flex; align-items:center; gap:7px; margin-top:18px;
  font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--t-low); transition:color .2s var(--ease);}
.tn-svc__more .tn-i{width:15px; height:15px; transition:transform .2s var(--ease);}
.tn-svc:hover .tn-svc__more{color:var(--gold);}
.tn-svc:hover .tn-svc__more .tn-i{transform:translateX(3px);}
/* accent variants */
.tn-svc.is-design,.tn-svc.is-build,.tn-svc.is-innovate{--accent:var(--blue-bright);}
.tn-svc.is-grow,.tn-svc.is-manage{--accent:var(--gold);}
.tn-svc.is-grow .tn-svc__icon .tn-i,.tn-svc.is-manage .tn-svc__icon .tn-i{color:var(--gold);}

.tn-services__note{display:flex; align-items:flex-start; gap:13px; margin-top:24px; padding:18px 22px;
  background:var(--surface-1); border:1px solid var(--hairline); border-radius:16px; max-width:880px;}
.tn-services__note .tn-i{width:20px; height:20px; color:var(--gold); flex-shrink:0; margin-top:1px;}
.tn-services__note p{font-size:15px; line-height:1.55; color:var(--t-mid);}
.tn-services__note strong{color:#fff; font-weight:600;}

/* ============================================================ WHY ONE TEAM */
.tn-why{position:relative; background:var(--navy-900); overflow:hidden;}
.tn-why__glow{position:absolute; right:-140px; top:-120px; width:460px; height:460px; filter:blur(12px);
  background:radial-gradient(circle,rgba(255,201,33,.10),transparent 64%); pointer-events:none;}
.tn-why__inner{position:relative; display:grid; grid-template-columns:.82fr 1.18fr; gap:64px; align-items:start;}
.tn-why h2{font-weight:800; font-size:clamp(2rem,3.2vw,2.9rem); line-height:1.08; letter-spacing:-.03em; margin-top:18px;}
.tn-why h2 .tn-hl{color:var(--gold);}
.tn-why__sub{font-size:17.5px; line-height:1.6; color:var(--t-mid); margin-top:18px; margin-bottom:28px;}
.tn-proofs{display:flex; flex-direction:column; gap:14px;}
.tn-proof{display:flex; gap:18px; padding:24px 26px; background:var(--surface-1); border:1px solid var(--hairline); border-radius:20px;
  transition:transform .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease);}
.tn-proof:hover{transform:translateY(-3px); background:var(--surface-2); border-color:var(--hairline-2);}
.tn-proof__n{font-family:var(--font-mono); font-weight:700; font-size:13px; letter-spacing:.08em; color:var(--gold); flex-shrink:0; padding-top:3px;}
.tn-proof__b h3{font-weight:700; font-size:19px; letter-spacing:-.02em; color:#fff; margin-bottom:7px;}
.tn-proof__b p{font-size:15.5px; line-height:1.58; color:var(--t-mid);}
.tn-proof__b a{color:var(--gold-bright); text-decoration:underline; text-underline-offset:2px;}

/* ============================================================ RESPONSIVE */
@media (max-width:940px){  .tn-roof{max-width:480px;} }
@media (max-width:900px){
  .tn-why__inner{grid-template-columns:1fr; gap:36px;}
}
@media (max-width:560px){
  .tn-intro__inner p{font-size:18px;}
  .tn-roof__list{grid-template-columns:1fr;}
}