/* Teena Computers — Plum, Coral & Champagne header refresh */
:root{
  --header-plum:#531b4b;
  --header-plum-deep:#35102f;
  --header-coral:#ed6547;
  --header-peach:#ffb38f;
  --header-gold:#f4c65d;
  --header-cream:#fffaf2;
  --header-lilac:#f5edf8;
  --header-ink:#281826;
  --header-muted:#766875;
  --header-line:#eadde8;
}

.iso-top-banner{
  position:relative;
  overflow:hidden;
  background:linear-gradient(108deg,var(--header-plum-deep) 0%,var(--header-plum) 55%,#7d2d62 100%);
  color:#fff;
  min-height:42px;
  border:0;
}
.iso-top-banner::after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  right:5%;
  top:-210px;
}
.iso-top-banner-inner{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  position:relative;
  z-index:1;
  font-size:.72rem;
}
.iso-top-banner-inner p{margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.iso-top-icon{
  width:22px;
  height:22px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--header-plum-deep);
  background:var(--header-gold);
  font-weight:900;
  box-shadow:0 0 0 4px rgba(244,198,93,.13);
}
.iso-label{
  padding:4px 8px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  border-radius:999px;
  font-size:.58rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.iso-copy{color:#eadcea}
.iso-certificate-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--header-plum-deep);
  background:var(--header-gold);
  border-radius:999px;
  padding:6px 10px;
  font-size:.62rem;
  font-weight:900;
  white-space:nowrap;
  transition:transform .2s ease,box-shadow .2s ease;
}
.iso-certificate-link:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.18)}

.top-strip{
  background:linear-gradient(90deg,#f07351 0%,var(--header-coral) 54%,#d94c4d 100%);
  color:#fff;
  border:0;
}
.top-strip-inner{
  min-height:39px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  font-size:.68rem;
}
.top-strip p{margin:0;display:flex;align-items:center;gap:8px}
.top-strip p>span:last-child{color:#ffe8df}
.pulse-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#fff5bf;
  box-shadow:0 0 0 0 rgba(255,245,191,.5);
  animation:headerPulse 2s infinite;
}
@keyframes headerPulse{70%{box-shadow:0 0 0 8px rgba(255,245,191,0)}100%{box-shadow:0 0 0 0 rgba(255,245,191,0)}}
.top-links{display:flex;align-items:center;gap:5px}
.top-links a{
  color:#fff;
  opacity:.95;
  padding:6px 9px;
  border-radius:999px;
  transition:background .2s ease,opacity .2s ease;
}
.top-links a:hover{background:rgba(255,255,255,.15);opacity:1}

.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,250,242,.94);
  backdrop-filter:blur(18px) saturate(150%);
  border-bottom:1px solid rgba(83,27,75,.08);
  transition:box-shadow .25s ease,background .25s ease;
}
.site-header.scrolled{background:rgba(255,250,242,.98);box-shadow:0 16px 45px rgba(53,16,47,.10)}
.nav-wrap{position:relative;min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:26px}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--header-ink);min-width:max-content}
.brand-mark{
  position:relative;
  width:58px;
  height:58px;
  flex:0 0 58px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#fff 0%,#fff5e8 100%);
  border:1px solid #efd9d4;
  box-shadow:0 10px 24px rgba(83,27,75,.11),inset 0 0 0 4px rgba(255,255,255,.72);
  overflow:hidden;
}
.brand-mark::after{
  content:"";
  position:absolute;
  width:24px;
  height:24px;
  border-radius:50%;
  right:-8px;
  bottom:-8px;
  background:var(--header-gold);
  opacity:.8;
}
.brand-mark img{position:relative;z-index:2;width:48px;height:48px;object-fit:contain}
.brand-fallback{position:absolute;z-index:1;font-family:'Sora',sans-serif;font-weight:900;color:var(--header-plum);font-size:1.05rem}
.brand-copy{display:flex;flex-direction:column;line-height:1.04}
.brand-copy strong{font-family:'Sora',sans-serif;font-size:1.04rem;letter-spacing:.015em;color:var(--header-ink)}
.brand-copy strong span{color:var(--header-plum)}
.brand-copy small{font-size:.61rem;color:var(--header-coral);font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin-top:7px}

.main-nav{display:flex;align-items:center;gap:5px;font-size:.79rem;font-weight:800}
.main-nav>a,.nav-drop-btn{
  position:relative;
  border:0;
  background:transparent;
  color:#564452;
  font:inherit;
  text-decoration:none;
  cursor:pointer;
  padding:11px 12px;
  border-radius:12px;
  transition:color .2s ease,background .2s ease,transform .2s ease;
}
.main-nav>a:hover,.nav-drop-btn:hover,.main-nav>a.active,.nav-drop-btn.active{
  color:var(--header-plum);
  background:#f2e5f0;
}
.main-nav>a.active::after,.nav-drop-btn.active::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:5px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,var(--header-coral),var(--header-gold));
}
.nav-dropdown{position:relative}
.nav-drop-btn{display:flex;align-items:center;gap:5px}
.nav-drop-btn>span{font-size:.76rem;transition:transform .2s ease}
.nav-dropdown:hover .nav-drop-btn>span,.nav-dropdown:focus-within .nav-drop-btn>span{transform:rotate(180deg)}
.nav-drop-menu{
  position:absolute;
  top:calc(100% + 13px);
  left:50%;
  transform:translate(-50%,8px);
  width:360px;
  padding:11px;
  background:#fffdf9;
  border:1px solid var(--header-line);
  border-radius:22px;
  box-shadow:0 24px 65px rgba(53,16,47,.16);
  display:grid;
  gap:4px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.nav-drop-menu::before{
  content:"";
  position:absolute;
  width:14px;
  height:14px;
  background:#fffdf9;
  border-left:1px solid var(--header-line);
  border-top:1px solid var(--header-line);
  transform:rotate(45deg);
  top:-8px;
  left:calc(50% - 7px);
}
.nav-dropdown:hover .nav-drop-menu,.nav-dropdown:focus-within .nav-drop-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%,0);
}
.nav-drop-menu a{position:relative;z-index:1;padding:12px 13px;border-radius:14px;color:var(--header-ink);display:flex;flex-direction:column;gap:3px;text-decoration:none}
.nav-drop-menu a:hover{background:linear-gradient(90deg,#f8edf5,#fff4e8);color:var(--header-plum)}
.nav-drop-menu b{font-size:.76rem}
.nav-drop-menu small{font-size:.62rem;color:var(--header-muted);font-weight:600}
.nav-cta{
  margin-left:5px;
  padding:12px 16px!important;
  border-radius:999px!important;
  color:#fff!important;
  background:linear-gradient(105deg,var(--header-coral),#c63f63 55%,var(--header-plum))!important;
  box-shadow:0 10px 25px rgba(198,63,99,.24);
  display:flex;
  align-items:center;
  gap:9px;
}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(198,63,99,.32)}
.nav-cta::after{display:none!important}
.nav-cta b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.17)}
.nav-toggle{display:none;border:0;background:#f1e2ee;padding:10px;border-radius:12px}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--header-plum);margin:5px;transition:.25s}

.trust-ribbon{
  background:linear-gradient(90deg,#f7eef8 0%,#fff5e9 50%,#f7eef8 100%);
  border-bottom:1px solid var(--header-line);
  color:var(--header-ink);
}
.trust-ribbon-inner{min-height:48px;display:flex;align-items:center;gap:18px}
.trust-title{
  color:var(--header-plum);
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:nowrap;
}
.trust-scroll{display:flex;align-items:center;gap:7px;overflow:auto;scrollbar-width:none;padding:7px 0}
.trust-scroll::-webkit-scrollbar{display:none}
.trust-scroll a,.trust-scroll strong{
  min-width:max-content;
  display:flex;
  align-items:center;
  gap:7px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(83,27,75,.08);
  color:#624d5d;
  font-size:.61rem;
  font-weight:800;
  text-decoration:none;
}
.trust-scroll a:hover{background:#fff;color:var(--header-plum)}
.trust-scroll i{width:5px;height:5px;border-radius:50%;background:var(--header-coral)}
.trust-scroll strong{color:var(--header-plum);background:#fff2c7;border-color:#eed68b}
.trust-scroll strong span{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:var(--header-plum);color:#fff;font-size:.51rem}

@media(max-width:1120px){
  .nav-toggle{display:block}
  .main-nav{
    position:absolute;
    top:calc(100% + 10px);
    left:0;
    right:0;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    padding:15px;
    background:#fffdf9;
    border:1px solid var(--header-line);
    border-radius:22px;
    box-shadow:0 24px 65px rgba(53,16,47,.18);
  }
  .main-nav.open{display:flex}
  .main-nav>a,.nav-drop-btn{width:100%;text-align:left;justify-content:space-between;padding:12px 14px}
  .nav-cta{margin:6px 0 0;justify-content:space-between}
  .nav-drop-menu{position:static;width:auto;transform:none;box-shadow:none;margin:5px 0 4px;border-radius:16px;display:none;opacity:1;visibility:visible;pointer-events:auto}
  .nav-drop-menu::before{display:none}
  .nav-dropdown:hover .nav-drop-menu,.nav-dropdown:focus-within .nav-drop-menu{display:grid;transform:none}
}

@media(max-width:760px){
  .iso-top-banner-inner{justify-content:flex-start;padding:7px 0;gap:9px}
  .iso-label,.iso-copy{display:none}
  .iso-top-banner-inner p{justify-content:flex-start;flex:1}
  .iso-certificate-link{font-size:.57rem;padding:5px 8px}
  .top-strip-inner{min-height:35px;justify-content:center}
  .top-strip p>span:last-child,.top-links a:not(:first-child){display:none}
  .top-links a:first-child{padding:4px 7px}
  .nav-wrap{min-height:74px}
  .brand-mark{width:50px;height:50px;flex-basis:50px;border-radius:15px}
  .brand-mark img{width:42px;height:42px}
  .brand-copy strong{font-size:.88rem}
  .brand-copy small{font-size:.51rem;letter-spacing:.06em}
  .trust-ribbon-inner{display:block;padding:7px 0}
  .trust-title{display:block;margin-bottom:2px}
  .trust-scroll{padding:3px 0}
}

@media(max-width:430px){
  .brand-copy small{display:none}
  .brand-copy strong{font-size:.81rem}
  .iso-top-banner-inner p strong{font-size:.65rem}
  .iso-certificate-link{font-size:.52rem}
}
