
/* ============================================================
   TRINITY V387 — WHOLE-SITE PREMIUM ALIGNMENT + GOLD GLASS SYSTEM
   Final visual layer built after page-by-page structural audit.
   Product gallery/image alignment is intentionally NOT overridden.
   ============================================================ */

:root{
  --tr387-gold:#f3c64d;
  --tr387-gold-hi:#ffe59a;
  --tr387-gold-soft:rgba(243,198,77,.18);
  --tr387-gold-line:rgba(243,198,77,.38);
  --tr387-blue:#39cfff;
  --tr387-navy:#061525;
  --tr387-panel:linear-gradient(145deg,rgba(10,38,63,.96),rgba(4,18,31,.98));
}

/* ---------- Global alignment foundation ---------- */
html{scroll-behavior:smooth;overflow-x:hidden}
body{overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,canvas{max-width:100%}
button,input,select,textarea{font:inherit}
a{color:inherit}
main{overflow:clip}

/* ---------- Shared premium background ---------- */
body.tx-home-page,
body.tx-storefront-page,
body.tr-product-body,
body.webit-page,
body.power-page,
body.cctv-page,
body.contact-page,
body.checkout-page{
  background:
    radial-gradient(circle at 8% 0%,rgba(31,126,255,.095),transparent 27%),
    radial-gradient(circle at 92% 10%,rgba(243,198,77,.065),transparent 24%),
    linear-gradient(180deg,#061525 0%,#071c30 48%,#04111e 100%)!important;
  color:#eef7ff;
}

/* ---------- Shared header/nav ---------- */
.tx-header{
  border-bottom:1px solid rgba(243,198,77,.18)!important;
  box-shadow:0 8px 35px rgba(0,0,0,.20),inset 0 -1px 0 rgba(255,235,170,.035)!important;
}
.tx-mainnav{
  align-items:center!important;
  min-height:46px;
}
.tx-mainnav a,
.tx-mainnav a:hover,
.tx-mainnav a:focus{
  text-decoration:none!important;
}
.tx-mainnav a.active{
  color:#ffd75a!important;
  -webkit-text-fill-color:#ffd75a!important;
  text-shadow:0 0 7px rgba(255,215,90,.70),0 0 18px rgba(238,178,36,.28)!important;
  font-weight:900!important;
}
.tx-mainnav a.active::before,
.tx-mainnav a.active::after,
.tx-mainnav a::before,
.tx-mainnav a::after{
  content:none!important;
  display:none!important;
}
.tx-mobile a.active{
  color:#ffd75a!important;
  background:rgba(243,198,77,.075)!important;
  box-shadow:inset 2px 0 #f3c64d,0 0 18px rgba(243,198,77,.08)!important;
}

/* ---------- Shared section headings ---------- */
.tx-kicker,
.tx-section-kicker,
.section-kicker,
.webit-page .kicker,
.power-page .kicker,
.cctv-page .kicker,
.contact-page .kicker{
  color:var(--tr387-gold-hi)!important;
  text-shadow:0 0 14px rgba(243,198,77,.16)!important;
  font-weight:950!important;
}
.tx-section-head,
.section-head{
  align-items:end;
}
.tx-section-head > *,
.section-head > *{min-width:0}

/* ---------- Homepage hero ---------- */
body.tx-home-page .tx-hero-inner{
  align-items:center!important;
}
body.tx-home-page .tx-hero-inner > .tx-reveal:first-child{
  min-width:0;
}
body.tx-home-page .tx-hero-inner > .tx-hero-showcase{
  transform:translateY(-16px)!important;
  min-width:0;
}
body.tx-home-page .tx-hero-inner > .tx-reveal:first-child .tx-eyebrow{
  transform:translateY(14px)!important;
  color:#ffd75a!important;
  -webkit-text-fill-color:#ffd75a!important;
  border-color:rgba(243,198,77,.42)!important;
  box-shadow:0 0 18px rgba(243,198,77,.08),inset 0 1px rgba(255,241,176,.08)!important;
}
body.tx-home-page .tx-hero-inner > .tx-reveal:first-child .tx-eyebrow i{
  background:#ffd75a!important;
  box-shadow:0 0 8px rgba(255,215,90,.90)!important;
}
body.tx-home-page .tx-hero-inner > .tx-reveal:first-child .tx-actions{
  margin-top:58px!important;
}
body.tx-home-page .tx-cat,
body.tx-home-page .tx-service,
body.tx-home-page .tx-trust-item,
body.tx-home-page .tx-product{
  border-color:rgba(243,198,77,.24)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.055),0 18px 48px rgba(0,0,0,.22)!important;
}
body.tx-home-page .tx-cat:hover,
body.tx-home-page .tx-service:hover,
body.tx-home-page .tx-trust-item:hover,
body.tx-home-page .tx-product:hover{
  border-color:rgba(255,226,123,.72)!important;
  box-shadow:0 22px 60px rgba(0,0,0,.28),0 0 28px rgba(243,198,77,.12)!important;
}

/* Homepage network typography: pure gold */
body.tx-home-page .network-core strong,
body.tx-home-page .network-core small,
body.tx-home-page .network-node b,
body.tx-home-page .network-node strong,
body.tx-home-page .network-node span{
  color:#ffd75a!important;
  -webkit-text-fill-color:#ffd75a!important;
  text-shadow:0 0 7px rgba(255,215,90,.58),0 0 15px rgba(238,178,36,.24)!important;
}
body.tx-home-page .network-node b{font-weight:900!important;letter-spacing:.11em!important}

/* ---------- Shared cards: consistent edge, depth, and alignment ---------- */
.tx-product,
.tx-cat,
.tx-service,
.tx-trust-item,
.webit-feature,
.webit-process-card,
.webit-faq-item,
.power-glass-card,
.power-benefit,
.power-process-card,
.power-faq-item,
.cctv-service-card,
.cctv-feature,
.cctv-process-card,
.cctv-page .faq,
.contact-card,
.contact-map-card{
  min-width:0;
}
.tx-product > *,
.tx-cat > *,
.tx-service > *,
.tx-trust-item > *,
.webit-feature > *,
.webit-process-card > *,
.webit-faq-item > *,
.power-glass-card > *,
.power-benefit > *,
.power-process-card > *,
.power-faq-item > *,
.cctv-service-card > *,
.cctv-feature > *,
.cctv-process-card > *,
.contact-card > *,
.contact-map-card > *{
  min-width:0;
}

/* ---------- Website & IT ---------- */
.webit-page .webit-hero-layout{
  align-items:center!important;
}
.webit-page .webit-hero-copy,
.webit-page .webit-hero-visual{
  min-width:0;
}
.webit-page .webit-feature-grid{
  align-items:stretch!important;
}
.webit-page .webit-feature,
.webit-page .webit-process-card,
.webit-page .webit-faq-item{
  background:var(--tr387-panel)!important;
  border-color:var(--tr387-gold-line)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.055),0 18px 48px rgba(0,0,0,.22)!important;
}
.webit-page .webit-feature:hover,
.webit-page .webit-process-card:hover,
.webit-page .webit-faq-item:hover{
  border-color:rgba(255,226,123,.76)!important;
  box-shadow:0 22px 60px rgba(0,0,0,.28),0 0 26px rgba(243,198,77,.10)!important;
}

/* ---------- Power Backup ---------- */
.power-page .power-hero-inner{
  align-items:center!important;
}
.power-page .power-hero-copy-block,
.power-page .power-flow-visual{
  min-width:0;
}
.power-page .power-service-grid{
  align-items:stretch!important;
}
.power-page .power-glass-card,
.power-page .power-benefit,
.power-page .power-process-card,
.power-page .power-faq-item{
  background:var(--tr387-panel)!important;
  border-color:var(--tr387-gold-line)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.055),0 18px 48px rgba(0,0,0,.22)!important;
}

/* ---------- CCTV ---------- */
.cctv-page .cctv-hero-grid{
  align-items:center!important;
}
.cctv-page .cctv-hero-copy,
.cctv-page .cctv-visual{
  min-width:0;
}
.cctv-page .cctv-service-grid{
  align-items:stretch!important;
}
.cctv-page .cctv-service-card,
.cctv-page .cctv-feature,
.cctv-page .cctv-process-card,
.cctv-page .faq{
  background:var(--tr387-panel)!important;
  border-color:var(--tr387-gold-line)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.055),0 18px 48px rgba(0,0,0,.22)!important;
}

/* ---------- Contact ---------- */
.contact-page .contact-grid{
  align-items:stretch!important;
}
.contact-page .contact-card,
.contact-page .contact-map-card{
  background:var(--tr387-panel)!important;
  border-color:var(--tr387-gold-line)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.055),0 20px 52px rgba(0,0,0,.22)!important;
}
.contact-page .contact-action-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.contact-page input,
.contact-page select,
.contact-page textarea{
  min-width:0;
}
.contact-page textarea{resize:vertical}

/* ---------- Shop ---------- */
.tx-storefront-page .tx-shop-head{
  align-items:end!important;
}
.tx-storefront-page .tx-product-grid{
  align-items:stretch!important;
}
.tx-storefront-page .tx-product{
  min-width:0;
  border-color:rgba(243,198,77,.26)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.055),0 18px 50px rgba(0,0,0,.23)!important;
}
.tx-storefront-page .tx-product:hover{
  border-color:rgba(255,226,123,.78)!important;
  box-shadow:0 24px 64px rgba(0,0,0,.30),0 0 28px rgba(243,198,77,.12)!important;
}

/* ---------- Product detail: alignment only around info; gallery deliberately untouched ---------- */
.tr-product-body .tr-product-shell{
  width:min(1320px,calc(100% - 48px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.tr-product-body .tr-product-hero{
  align-items:stretch!important;
}
.tr-product-body .tr-product-info{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.tr-product-body .tr-key-specs,
.tr-product-body .tr-spec-grid{
  min-width:0;
}
.tr-product-body .tr-buy-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:10px;
}
.tr-product-body .tr-buy-actions > *{
  flex:1 1 180px;
  min-width:0;
}
.tr-product-body .tr-price-panel{
  border-color:rgba(243,198,77,.46)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.08),0 0 26px rgba(243,198,77,.06)!important;
}
.tr-product-body .tr-price-line{
  color:#ffd75a!important;
  -webkit-text-fill-color:#ffd75a!important;
  text-shadow:0 0 12px rgba(255,215,90,.28)!important;
}

/* ---------- Checkout ---------- */
body.checkout-page .checkout-wrap{
  width:min(1180px,calc(100% - 40px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
body.checkout-page .checkout-grid{
  align-items:stretch!important;
}
body.checkout-page .checkout-card{
  min-width:0;
  background:var(--tr387-panel)!important;
  border-color:rgba(243,198,77,.25)!important;
  box-shadow:inset 0 1px rgba(255,239,170,.05),0 18px 48px rgba(0,0,0,.22)!important;
}
body.checkout-page .checkout-total{
  border-color:rgba(243,198,77,.38)!important;
}
body.checkout-page .pay-btn{
  min-height:50px!important;
  border-color:rgba(255,226,123,.35)!important;
  box-shadow:0 0 24px rgba(243,198,77,.08)!important;
}

/* ---------- Gold glass travelling reflection for major cards ---------- */
.tx-home-page .tx-cat::after,
.tx-home-page .tx-service::after,
.tx-home-page .tx-trust-item::after,
.tx-home-page .tx-product::after,
.tx-storefront-page .tx-product::after,
.webit-page .webit-feature::after,
.webit-page .webit-process-card::after,
.webit-page .webit-faq-item::after,
.power-page .power-glass-card::after,
.power-page .power-benefit::after,
.power-page .power-process-card::after,
.power-page .power-faq-item::after,
.cctv-page .cctv-service-card::after,
.cctv-page .cctv-feature::after,
.cctv-page .cctv-process-card::after,
.cctv-page .faq::after,
.contact-page .contact-card::after,
.contact-page .contact-map-card::after{
  content:"";
  position:absolute;
  top:-70%;
  bottom:-70%;
  left:-38%;
  width:15%;
  pointer-events:none;
  z-index:20;
  transform:skewX(-17deg);
  background:linear-gradient(90deg,transparent,rgba(243,198,77,.18),rgba(255,241,176,.88),rgba(243,198,77,.22),transparent);
  box-shadow:0 0 18px rgba(243,198,77,.42);
  filter:blur(2px);
  mix-blend-mode:screen;
  opacity:0;
  animation:tr387GoldSweep 7s cubic-bezier(.35,0,.25,1) infinite;
}
@keyframes tr387GoldSweep{
  0%,20%{left:-38%;opacity:0}
  28%{opacity:.28}
  37%{opacity:.82}
  47%{left:123%;opacity:.18}
  54%,100%{left:145%;opacity:0}
}

/* ---------- Buttons: common optical alignment ---------- */
.tx-btn,
.btn{
  min-height:48px;
  line-height:1.15;
}
.tx-actions,
.webit-page .actions,
.power-page .actions,
.cctv-page .actions{
  align-items:center!important;
  flex-wrap:wrap!important;
}

/* ---------- Responsive alignment audit ---------- */
@media(max-width:1100px){
  .tx-product-grid{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:900px){
  .tx-hero-inner{grid-template-columns:1fr!important;gap:22px!important}
  body.tx-home-page .tx-hero-inner > .tx-hero-showcase{transform:translateY(0)!important}
  .power-split{grid-template-columns:1fr!important;gap:36px!important}
  .contact-grid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .tx-product-grid{grid-template-columns:repeat(2,1fr)!important}
  .tr-product-body .tr-product-shell{width:min(100% - 28px,1320px)!important}
  body.checkout-page .checkout-wrap{width:min(100% - 28px,1180px)!important}
}
@media(max-width:620px){
  .tx-product-grid{grid-template-columns:1fr!important}
  .tx-section{padding:58px 0!important}
  body.tx-home-page .tx-hero-inner > .tx-reveal:first-child .tx-actions{
    margin-top:38px!important;
  }
  body.tx-home-page .tx-hero-inner > .tx-reveal:first-child .tx-eyebrow{
    transform:translateY(8px)!important;
  }
  .contact-page .contact-action-row,
  .tr-product-body .tr-buy-actions{
    flex-direction:column!important;
  }
  .contact-page .contact-action-row > *,
  .tr-product-body .tr-buy-actions > *{
    width:100%!important;
    flex:1 1 auto!important;
  }
  .tr-product-body .tr-product-shell{width:calc(100% - 20px)!important}
  body.checkout-page .checkout-wrap{width:calc(100% - 20px)!important}
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  .tx-home-page .tx-cat::after,
  .tx-home-page .tx-service::after,
  .tx-home-page .tx-trust-item::after,
  .tx-home-page .tx-product::after,
  .tx-storefront-page .tx-product::after,
  .webit-page .webit-feature::after,
  .webit-page .webit-process-card::after,
  .webit-page .webit-faq-item::after,
  .power-page .power-glass-card::after,
  .power-page .power-benefit::after,
  .power-page .power-process-card::after,
  .power-page .power-faq-item::after,
  .cctv-page .cctv-service-card::after,
  .cctv-page .cctv-feature::after,
  .cctv-page .cctv-process-card::after,
  .cctv-page .faq::after,
  .contact-page .contact-card::after,
  .contact-page .contact-map-card::after{
    animation:none!important;
    opacity:0!important;
  }
}

/* ---------- V390: keep travelling gold reflections inside their cards ---------- */
.tx-home-page .tx-service,
.tx-home-page .tx-cat,
.tx-home-page .tx-trust-item,
.tx-home-page .tx-product,
.tx-storefront-page .tx-product,
.webit-page .webit-feature,
.webit-page .webit-process-card,
.webit-page .webit-faq-item,
.power-page .power-glass-card,
.power-page .power-benefit,
.power-page .power-process-card,
.power-page .power-faq-item,
.cctv-page .cctv-service-card,
.cctv-page .cctv-feature,
.cctv-page .cctv-process-card,
.cctv-page .faq,
.contact-page .contact-card,
.contact-page .contact-map-card{
  overflow:hidden!important;
  isolation:isolate;
}
