/* TR InnovaTech — Modern design system (2025) — same brand colors */

:root{
  --m-radius:20px;
  --m-radius-lg:28px;
  --m-radius-xl:32px;
  --m-shadow:0 1px 2px rgba(7,38,109,.04),0 8px 32px rgba(7,38,109,.08);
  --m-shadow-hover:0 4px 8px rgba(7,38,109,.06),0 20px 50px rgba(7,38,109,.12);
  --m-border:1px solid rgba(6,95,211,.08);
  --m-section-gap:clamp(4rem,7vw,6rem);
}

/* ── Global canvas ── */
body{
  background:
    radial-gradient(ellipse 100% 80% at 50% -20%,rgba(6,95,211,.07),transparent 50%),
    linear-gradient(180deg,#eef3fb 0%,#f6f9fc 40%,#eef3fb 100%);
}

main#main,.page-main{display:block}

/* ── Section rhythm — alternating modern bands ── */
.section{
  padding:var(--m-section-gap) var(--page-px);
  position:relative;
}
.section--surface{background:#fff}
.section--muted{background:linear-gradient(180deg,#f8fafc 0%,#fff 100%)}
.section--tint{background:linear-gradient(180deg,#eef3fb 0%,#f8fafc 50%,#eef3fb 100%)}

/* ── Modern section headers ── */
.s-head{
  margin-bottom:clamp(2rem,4vw,3.25rem);
  max-width:720px;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}
.s-head .s-sub{margin-left:auto;margin-right:auto}
.s-head--center{margin-left:auto;margin-right:auto;text-align:center}
.s-head--center .s-sub{margin-left:auto;margin-right:auto}
.s-head--left{
  margin-left:0;
  margin-right:0;
  text-align:left;
}
.s-head--left .s-sub{margin-left:0;margin-right:0;max-width:65ch}
.s-label{
  border-radius:100px;
  padding:6px 14px;
  background:linear-gradient(135deg,rgba(6,95,211,.1),rgba(6,95,211,.04));
  border:1px solid rgba(6,95,211,.14);
  box-shadow:0 2px 10px rgba(6,95,211,.06);
}
.s-h{
  letter-spacing:-.04em;
  font-weight:800;
}
.process-bg .s-h,.cta-bg .s-h,.cta-band .s-h,.svc-cta-inner .s-h,
.hero h1,.page-hero h1,.svc-hero h1,.about-hero h1,.legal-hero h1{
  -webkit-text-fill-color:unset;
  color:#fff;
  background:none;
}

/* ── Heroes — unified cinematic style ── */
.hero,.page-hero,.svc-hero,.about-hero,.legal-hero{
  padding:clamp(4rem,8vw,6.5rem) var(--page-px) clamp(3.5rem,6vw,5.5rem);
  overflow:hidden;
  isolation:isolate;
}
.hero-inner,.page-hero-grid,.svc-hero-grid,.about-hero-grid{
  gap:clamp(2rem,5vw,4rem);
  align-items:center;
}
.hero-badge,.ai-live,.legal-badge{
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-radius:100px;
}

/* ── Bento-style service grid (homepage) ── */
.svc-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(1rem,2vw,1.5rem);
}
.svc-card{
  border-radius:var(--m-radius-lg);
  border:var(--m-border);
  background:linear-gradient(180deg,#fff 0%,#fafcff 100%);
  box-shadow:var(--m-shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.svc-card:hover{
  box-shadow:var(--m-shadow-hover);
  border-color:rgba(6,95,211,.18);
  transform:translateY(-5px);
}
.svc-card-bar{height:3px}
.svc-card-body{padding:clamp(1.35rem,2.5vw,1.75rem)}
.svc-card-foot{
  margin-top:auto;
  padding:1rem 1.5rem 1.35rem;
  background:linear-gradient(180deg,transparent,rgba(6,95,211,.03));
  border-top:1px solid rgba(6,95,211,.06);
}
.svc-icon-wrap{
  width:56px;height:56px;border-radius:16px;
  font-size:1.3rem;
}
.svc-list{
  border-radius:14px;
  background:rgba(6,95,211,.03);
  border:1px solid rgba(6,95,211,.08);
}
.svc-cta{
  border-radius:14px;
  padding:12px 18px;
  background:linear-gradient(135deg,rgba(6,95,211,.08),rgba(6,95,211,.02));
  border:1px solid rgba(6,95,211,.12);
  transition:all .25s;
}
.svc-cta:hover{
  background:linear-gradient(135deg,var(--indigo),var(--violet));
  color:#fff!important;
  border-color:transparent;
  transform:translateY(-1px);
}

/* ── AI capability cards ── */
.ai-cap-grid{
  gap:clamp(1rem,2vw,1.35rem);
}
.ai-card,.ai-cap{
  border-radius:var(--m-radius-lg);
  border:var(--m-border);
  background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(248,250,252,.9));
  box-shadow:var(--m-shadow);
}

/* ── Why / value cards ── */
.why-grid{gap:clamp(1rem,2vw,1.35rem)}
.why-card{
  border-radius:var(--m-radius-lg);
  border:var(--m-border);
  background:#fff;
  box-shadow:var(--m-shadow);
  padding:clamp(1.35rem,2.5vw,1.75rem);
}
.why-card::before{height:2px;opacity:1}

/* ── Process (dark section) ── */
.proc-steps,.proc-timeline{gap:clamp(1rem,2vw,1.25rem)}
.proc-card,.proc-step-card{
  border-radius:var(--m-radius-lg);
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.proc-step-card{
  background:#fff;
  border:var(--m-border);
  box-shadow:var(--m-shadow);
}

/* ── Results / stats ── */
.results-grid,.svc-res-grid{
  gap:clamp(.85rem,2vw,1.25rem);
}
.res-card,.svc-res,.h-card,.about-stat,.page-hero-card,.svc-hero-card{
  border-radius:var(--m-radius);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.res-card{
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
  border:var(--m-border);
  box-shadow:var(--m-shadow);
  padding:clamp(1.35rem,2.5vw,1.75rem);
  text-align:center;
}
.res-num,.svc-res-num{font-size:clamp(1.75rem,4vw,2.25rem)}

/* ── Testimonials ── */
.testi-grid{gap:1.25rem}
.testi-card{
  border-radius:var(--m-radius-lg);
  padding:clamp(1.35rem,2.5vw,1.75rem);
  box-shadow:var(--m-shadow);
}

/* ── FAQ — modern accordion ── */
.faq-list{display:flex;flex-direction:column;gap:.65rem}
.faq-item{
  border-radius:var(--m-radius)!important;
  border:var(--m-border)!important;
  background:#fff;
  overflow:hidden;
  box-shadow:var(--m-shadow);
}
.faq-q{
  padding:1.1rem 1.25rem!important;
  font-weight:600;
  font-size:clamp(.9rem,.86rem + .2vw,.95rem);
}
.faq-a{
  padding:0 1.25rem 1.15rem!important;
  font-size:clamp(.84rem,.8rem + .2vw,.9rem);
  line-height:1.75;
  color:var(--g600);
}

/* ── Booking form — app-like panel ── */
.book-bg{background:linear-gradient(180deg,#eef3fb 0%,#fff 50%,#eef3fb 100%)}
.book-card,.book-form-wrap{
  border-radius:var(--m-radius-xl);
  border:var(--m-border);
  box-shadow:var(--m-shadow-hover);
  background:#fff;
  overflow:hidden;
}
.book-sidebar{
  padding:clamp(1.5rem,3vw,2rem);
}
.f-step{border-radius:var(--m-radius-lg)}
.f-card,.step-body input,.step-body select,.step-body textarea{
  border-radius:14px;
  border:1.5px solid var(--g200);
  background:#fafbfc;
}
.f-card:focus-within,.step-body input:focus,.step-body select:focus,.step-body textarea:focus{
  border-color:var(--indigo);
  background:#fff;
  box-shadow:0 0 0 4px rgba(6,95,211,.1);
}

/* ── CTA sections ── */
.cta-bg,.cta-band,.svc-cta-bg{
  border-radius:0;
  padding:var(--m-section-gap) var(--page-px);
}
.cta-inner,.cta-band-inner,.svc-cta-inner{
  max-width:680px;
  margin:0 auto;
  text-align:center;
}
.cta-btn,.cta-btn-white,.cta-btn-ghost{
  border-radius:14px;
  padding:13px 26px;
  font-weight:700;
}

/* ── Contact page ── */
.contact-layout{gap:clamp(1.5rem,3vw,2.5rem)}
.contact-card,.contact-form-card{
  border-radius:var(--m-radius-lg);
  box-shadow:var(--m-shadow);
  border:var(--m-border);
}
.contact-form-card::before{
  height:3px;
  border-radius:var(--m-radius-lg) var(--m-radius-lg) 0 0;
}

/* ── Case studies ── */
.cs-card{
  border-radius:var(--m-radius-lg);
  box-shadow:var(--m-shadow);
  border:var(--m-border);
}
.cs-metric{border-radius:12px}

/* ── Service pages ── */
.svc-feat,.svc-proc,.svc-audience,.svc-related{
  border-radius:var(--m-radius);
  border:var(--m-border);
  box-shadow:var(--m-shadow);
  background:#fff;
}
.svc-overview-grid{gap:clamp(1.5rem,3vw,3rem)}
.svc-checklist{
  border-radius:var(--m-radius);
  border:var(--m-border);
  background:linear-gradient(180deg,#f8fafc,#fff);
}

/* ── About page ── */
.stats-strip{
  background:linear-gradient(90deg,#fff,#f8fafc,#fff);
  border-bottom:var(--m-border);
  box-shadow:0 8px 32px rgba(7,38,109,.06);
}
.stats-strip-inner{padding:clamp(1.25rem,3vw,1.75rem) 0}
.story-card,.value-card,.team-card,.market-card{
  border-radius:var(--m-radius);
  border:var(--m-border);
  box-shadow:var(--m-shadow);
  background:#fff;
  transition:transform .25s,box-shadow .25s;
}
.story-card:hover,.value-card:hover,.team-card:hover,.market-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--m-shadow-hover);
}

/* ── Legal pages ── */
.legal-hero{padding:clamp(3rem,6vw,4.5rem) 0}
.legal-content{
  border-radius:var(--m-radius-lg);
  border:var(--m-border);
  box-shadow:var(--m-shadow);
  background:#fff;
  padding:clamp(1.5rem,3vw,2.5rem);
}
.legal-toc{
  border-radius:var(--m-radius);
  border:var(--m-border);
  background:#fff;
  box-shadow:var(--m-shadow);
  padding:1.25rem;
}
.legal-toc a{
  border-radius:8px;
  border-left:3px solid transparent;
  padding:.45rem .65rem;
}
.legal-toc a.active{
  background:rgba(6,95,211,.06);
  border-left-color:var(--indigo);
}
.legal-highlight{
  border-radius:14px;
  border-left:3px solid var(--indigo);
  background:linear-gradient(90deg,rgba(6,95,211,.08),transparent);
}

/* ── Tech strip ── */
.tech-strip{
  background:linear-gradient(180deg,#fff,#f8fafc);
  border-block:var(--m-border);
}

/* ── Hero stat cards ── */
.hero-cards{gap:1rem}
.h-card{
  border-radius:var(--m-radius);
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  padding:1.35rem 1.5rem;
}

/* ── Buttons unified ── */
.btn-glow,.btn-outline,.about-btn,.svc-btn{
  border-radius:14px;
  font-weight:700;
  padding:13px 24px;
}
.btn-outline,.btn-ghost,.about-btn-ghost,.svc-btn-ghost{
  border:1.5px solid rgba(255,255,255,.25);
  backdrop-filter:blur(8px);
}

/* ── Responsive ── */
@media(max-width:1024px){
  .svc-grid{grid-template-columns:1fr}
  .story-grid,.svc-overview-grid{grid-template-columns:1fr}
  .values-grid,.team-grid{grid-template-columns:1fr 1fr}
  .stats-strip-inner{grid-template-columns:repeat(2,1fr)}
  .stats-strip-item{border-right:none;border-bottom:1px solid var(--g100);padding:1rem}
}
@media(max-width:768px){
  .values-grid,.team-grid,.why-grid{grid-template-columns:1fr}
  .about-hero-stats{grid-template-columns:1fr 1fr}
  .legal-layout.page-shell{grid-template-columns:1fr!important}
  .legal-toc{position:static!important;max-height:none}
  .hero-inner,.page-hero-grid{grid-template-columns:1fr;text-align:center}
  .hero-btns,.page-hero-btns,.about-hero-btns{justify-content:center}
  .hero-sub,.page-hero-lead{margin-left:auto;margin-right:auto}
  .hero-pills{justify-content:center}
}
@media(max-width:480px){
  .stats-strip-inner{grid-template-columns:1fr}
  .about-hero-stats{grid-template-columns:1fr}
}

/* ── Homepage utilities ── */
.ai-cap-link{text-decoration:none;color:inherit;display:block;height:100%}
.s-actions{text-align:center;margin-top:1.75rem;display:flex;flex-wrap:wrap;gap:.65rem;justify-content:center;align-items:center}
.s-sub a{color:var(--indigo);font-weight:600;text-decoration:none}
.s-sub a:hover{text-decoration:underline}
.cta-band .s-label--on-dark{background:rgba(255,255,255,.12);color:var(--accent-light);border-color:rgba(255,255,255,.2)}
.ai-live{margin-bottom:1rem}
