/* TimaLink public-photo upgrade — replace abstract marketing graphics with real project photography while preserving the approved purple brand. */
body.tima .radarstage{
  background:linear-gradient(180deg,rgba(7,9,23,.05),rgba(7,9,23,.68)),url('/timalink-landing-hero.webp') center/cover no-repeat;
}
body.tima .radarstage .radar,
body.tima .radarstage .core,
body.tima .radarstage .orbit{display:none}
body.tima .radarstage .feature-strip{z-index:2}
body.tima .radarstage:after{
  content:'Integrated security · smart property · connected control';
  position:absolute;left:22px;top:22px;z-index:2;
  padding:9px 12px;border-radius:9px;
  background:rgba(7,9,23,.78);
  border:1px solid rgba(168,109,255,.45);
  color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.05em;
}
body.tima .white .screen{
  position:relative;overflow:hidden;min-height:360px;padding:0;
  background:linear-gradient(180deg,rgba(7,9,23,.02),rgba(7,9,23,.42)),url('/assets/services/cctv.webp') center/cover no-repeat;
}
body.tima .white .screen .screenbar,
body.tima .white .screen .screenbody{display:none}
body.tima .white .screen:after{
  content:'CCTV monitoring & security integration';
  position:absolute;left:20px;bottom:18px;
  padding:9px 12px;border-radius:9px;
  background:rgba(7,9,23,.78);
  border:1px solid rgba(168,109,255,.30);
  color:#fff;font-size:.78rem;font-weight:800;
}

/* Keep secondary calls-to-action readable on white sections. */
body.tima .white .actions .btn.ghost{
  color:#5f2bd8;
  background:#fff;
  border-color:#6f53a8;
  box-shadow:0 8px 24px rgba(83,44,164,.08);
}
body.tima .white .actions .btn.ghost:hover{
  color:#fff;
  background:linear-gradient(135deg,#6e35e8,#9c62ff);
  border-color:#7c3cff;
}

/* Interoperability cards — real ecosystem marks + TimaLink custom integration icons. */
body.tima #integrations .cap-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
body.tima #integrations .cap{
  position:relative;
  min-height:236px;
  padding:24px 18px 54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  border-color:#293754;
  background:linear-gradient(180deg,#101a2d,#0c1627);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body.tima #integrations .cap:hover{
  transform:translateY(-3px);
  border-color:rgba(168,109,255,.52);
  box-shadow:0 16px 34px rgba(0,0,0,.20);
}
body.tima #integrations .cap .ico{
  width:78px;
  height:78px;
  margin:0 auto 16px;
  font-size:0;
  border-radius:20px;
  border:1px solid rgba(168,109,255,.24);
  background-color:rgba(255,255,255,.035);
  background-repeat:no-repeat;
  background-position:center;
  background-size:54px 54px;
  box-shadow:inset 0 0 30px rgba(124,60,255,.06);
}
body.tima #integrations .cap strong{
  font-size:.95rem;
  margin-bottom:8px;
}
body.tima #integrations .cap span{
  max-width:240px;
  font-size:.75rem;
  line-height:1.55;
}
body.tima #integrations .cap::after{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  white-space:nowrap;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid rgba(168,109,255,.30);
  background:rgba(124,60,255,.10);
  color:#c9adff;
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.035em;
  text-transform:uppercase;
}
body.tima #integrations .cap:nth-child(1) .ico{background-image:url('/assets/integrations/matter.svg')}
body.tima #integrations .cap:nth-child(2) .ico{background-image:url('/assets/integrations/google-home.svg')}
body.tima #integrations .cap:nth-child(3) .ico{background-image:url('/assets/integrations/alexa.svg')}
body.tima #integrations .cap:nth-child(4) .ico{background-image:url('/assets/integrations/apple.svg');background-size:48px 48px}
body.tima #integrations .cap:nth-child(5) .ico{background-image:url('/assets/integrations/home-assistant.svg')}
body.tima #integrations .cap:nth-child(6) .ico{background-image:url('/assets/integrations/onvif-rtsp.svg')}
body.tima #integrations .cap:nth-child(7) .ico{background-image:url('/assets/integrations/vendor-api.svg')}
body.tima #integrations .cap:nth-child(8) .ico{background-image:url('/assets/integrations/securekonnect-gateway.svg')}
body.tima #integrations .cap:nth-child(1)::after{content:'Primary path'}
body.tima #integrations .cap:nth-child(2)::after{content:'Setup required'}
body.tima #integrations .cap:nth-child(3)::after{content:'Planned';border-color:rgba(245,190,82,.36);background:rgba(245,190,82,.10);color:#ffd477}
body.tima #integrations .cap:nth-child(4)::after{content:'Where supported'}
body.tima #integrations .cap:nth-child(5)::after{content:'Optional'}
body.tima #integrations .cap:nth-child(6)::after{content:'Capability-gated'}
body.tima #integrations .cap:nth-child(7)::after{content:'Official APIs / SDKs'}
body.tima #integrations .cap:nth-child(8)::after{content:'Local bridge'}

/* Commercial website ending. */
body.tima .tima-final-cta{
  position:relative;
  min-height:520px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(5,8,18,.94) 0%,rgba(5,8,18,.82) 44%,rgba(9,7,24,.38) 72%,rgba(9,7,24,.20) 100%),
    url('/timalink-landing-hero.webp') center/cover no-repeat;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(168,109,255,.20);
}
body.tima .tima-final-cta:before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 70% 36%,rgba(124,60,255,.22),transparent 30%);
  pointer-events:none;
}
body.tima .final-cta-inner{position:relative;z-index:1;padding:86px 0}
body.tima .final-cta-copy{max-width:690px}
body.tima .final-cta-copy .section-kicker{color:#bd98ff}
body.tima .final-cta-copy h2{
  margin:12px 0 18px;
  max-width:680px;
  font-size:clamp(2.5rem,5vw,4.6rem);
  line-height:1;
  letter-spacing:-.045em;
}
body.tima .final-cta-copy p{max-width:600px;color:#c0c9d8;font-size:1.04rem;line-height:1.75}
body.tima .tima-final-cta .btn.ghost{background:rgba(7,9,23,.70);border-color:#8064b9;color:#fff}
body.tima .tima-final-cta .btn.ghost:hover{background:#fff;color:#4f22b5;border-color:#fff}

body.tima .tima-assurance{background:#090f1b;border-bottom:1px solid #1d2940;padding:28px 0}
body.tima .assurance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#263149;border:1px solid #263149;border-radius:16px;overflow:hidden}
body.tima .assurance-grid>div{background:#0d1626;padding:24px}
body.tima .assurance-grid strong{display:block;color:#fff;font-size:.92rem;margin-bottom:7px}
body.tima .assurance-grid span{display:block;color:#90a1b8;font-size:.73rem;line-height:1.55}

body.tima .tima-onboarding{background:#f7f8fc;color:#111827;padding:82px 0 92px}
body.tima .onboarding-heading{max-width:760px;margin-bottom:34px}
body.tima .onboarding-heading .section-kicker{color:#7137e7}
body.tima .onboarding-heading h2{font-size:clamp(2.2rem,4vw,3.55rem);line-height:1.04;letter-spacing:-.04em;margin:12px 0 15px}
body.tima .onboarding-heading p{color:#667085;line-height:1.7;font-size:1rem}
body.tima .onboarding-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
body.tima .onboard-card{
  min-height:250px;
  display:flex;flex-direction:column;
  padding:23px;
  border-radius:18px;
  background:#fff;
  border:1px solid #e1e5ee;
  box-shadow:0 14px 35px rgba(17,24,39,.06);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body.tima .onboard-card:hover{transform:translateY(-4px);border-color:#b89aff;box-shadow:0 20px 46px rgba(91,52,176,.12)}
body.tima .onboard-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#f0e9ff;color:#6630d7;font-weight:850;font-size:.72rem;margin-bottom:24px}
body.tima .onboard-card strong{font-size:1rem;color:#111827;margin-bottom:9px}
body.tima .onboard-card small{color:#687386;font-size:.78rem;line-height:1.55;flex:1}
body.tima .onboard-card b{margin-top:22px;color:#6d35dd;font-size:.76rem}

/* Purple commercial footer — darker than the brand button color so it remains premium and readable. */
body.tima .tima-footer{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 12%,rgba(189,152,255,.22),transparent 28%),
    linear-gradient(135deg,#140827 0%,#2a1058 48%,#4c1f92 100%);
  color:#d8c9f6;
  padding:58px 0 20px;
  border-top:1px solid rgba(213,188,255,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
body.tima .tima-footer:before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.025),transparent 32%,transparent 68%,rgba(255,255,255,.018));
}
body.tima .tima-footer .wrap{position:relative;z-index:1}
body.tima .footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:44px;padding-bottom:42px}
body.tima .footer-brand .brand{display:inline-flex;color:#fff;margin-bottom:16px}
body.tima .footer-brand p{max-width:340px;line-height:1.65;font-size:.82rem;color:#d8c9f6}
body.tima .footer-grid>div:not(.footer-brand){display:flex;flex-direction:column;gap:11px}
body.tima .footer-grid>div:not(.footer-brand)>strong{color:#fff;font-size:.82rem;margin-bottom:4px}
body.tima .footer-grid a{font-size:.78rem;color:#d5c2f6}
body.tima .footer-grid a:hover{color:#fff;text-shadow:0 0 18px rgba(217,190,255,.45)}
body.tima .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:18px;border-top:1px solid rgba(255,255,255,.16);font-size:.72rem;color:#bda9df}

@media(max-width:1000px){
  body.tima #integrations .cap-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.tima .assurance-grid{grid-template-columns:repeat(2,1fr)}
  body.tima .onboarding-grid{grid-template-columns:repeat(2,1fr)}
  body.tima .footer-grid{grid-template-columns:1.4fr 1fr 1fr;gap:30px}
  body.tima .footer-grid>div:last-child{grid-column:2/4}
}
@media(max-width:900px){
  body.tima .white .screen{min-height:300px}
  body.tima .radarstage:after{left:16px;top:16px;right:16px}
  body.tima .tima-final-cta{min-height:460px;background-position:62% center}
}
@media(max-width:620px){
  body.tima #integrations .cap-grid{grid-template-columns:1fr}
  body.tima #integrations .cap{min-height:220px}
  body.tima .assurance-grid{grid-template-columns:1fr}
  body.tima .onboarding-grid{grid-template-columns:1fr}
  body.tima .footer-grid{grid-template-columns:1fr;gap:28px}
  body.tima .footer-grid>div:last-child{grid-column:auto}
  body.tima .final-cta-inner{padding:64px 0}
  body.tima .tima-onboarding{padding:64px 0 72px}
}