/* SuTech theme — shared design system. One source of truth for every template. */

:root{
  --bg:#0a0b0d; --surface:#141619; --surface-2:#1b1e22; --border:#26292e;
  --text-1:#fafafa; --text-2:#a7adb3; --text-3:#6c7278;
  --accent:#2f7fe0; --accent-hover:#1a63bd; --accent-strong:#004AAF; --accent-strong-hover:#003a8c; --accent-ink:#ffffff;
  --font-h:'Poppins',sans-serif; --font-b:'Heebo',sans-serif;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px; --s12:48px; --s16:64px; --s20:80px; --s24:96px; --s32:128px;
  --radius:10px; --radius-sm:6px;
  --container:1240px;
  --ease:cubic-bezier(.4,0,.2,1); --dur:.18s; --dur-slow:.32s;
}

*{box-sizing:border-box;}
img{max-width:100%;height:auto;}
html{background:var(--bg);overflow-x:hidden;}
body{margin:0;background:var(--bg);color:var(--text-2);font-family:var(--font-b);overflow-x:hidden;}
body.sutech a{color:var(--accent);text-decoration:none;transition:color var(--dur) var(--ease);}
body.sutech a:hover{color:var(--accent-hover);}
body.sutech h1,body.sutech h2,body.sutech h3,body.sutech h4{font-family:var(--font-h);color:var(--text-1);margin:0;letter-spacing:-0.01em;}
body.sutech p{line-height:1.7;}
body.sutech svg{transition:stroke var(--dur) var(--ease),fill var(--dur) var(--ease);}
@media (prefers-reduced-motion: reduce){
  body.sutech *{transition-duration:.001ms!important;animation-duration:.001ms!important;}
}

.sutech-wrap{max-width:var(--container);margin:0 auto;padding:0 var(--s10);}
.sutech-wrap-narrow{max-width:760px;margin:0 auto;padding:0 var(--s10);}

.sutech-navlink{font-family:var(--font-b);font-size:14.5px;color:var(--text-2);text-decoration:none;letter-spacing:.01em;transition:color var(--dur) var(--ease);}
.sutech-navlink:hover{color:var(--text-1);}
.sutech-navlink.is-active{color:var(--text-1);}

.sutech-eyebrow{font-family:var(--font-b);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}

.sutech-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;background:var(--accent-strong);color:var(--accent-ink)!important;font-family:var(--font-b);font-weight:600;font-size:15px;border-radius:var(--radius-sm);border:none;cursor:pointer;transition:background var(--dur) var(--ease),transform var(--dur) var(--ease);}
.sutech-btn-primary:hover{background:var(--accent-strong-hover);color:var(--accent-ink)!important;transform:translateY(-1px);}
.sutech-btn-primary:active{transform:translateY(0);}
.sutech-btn-primary.sutech-btn-sm{padding:11px 22px;font-size:14px;}
.sutech-btn-primary.sutech-btn-block{width:100%;}

.sutech-btn-ghost{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border:1px solid var(--border);color:var(--text-1)!important;font-family:var(--font-b);font-weight:500;font-size:15px;border-radius:var(--radius-sm);transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);}
.sutech-btn-ghost:hover{border-color:var(--text-3);color:var(--text-1)!important;background:var(--surface);}

.sutech-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1px solid transparent;color:var(--text-2);background:none;cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease);flex:none;padding:0;}
.sutech-icon-btn:hover{background:var(--surface);border-color:var(--border);color:var(--text-1);}
.sutech-icon-btn svg{width:19px;height:19px;stroke:currentColor;}

.sutech-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),background var(--dur) var(--ease);}
.sutech-card-link{display:block;text-decoration:none;}
.sutech-card-link:hover .sutech-card,.sutech-card.sutech-card-hover:hover{border-color:var(--accent);transform:translateY(-3px);background:var(--surface-2);}

.sutech-tag{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:rgba(47,127,224,.14);color:var(--accent);font-size:11.5px;font-weight:600;letter-spacing:.03em;}

/* ---------- header ---------- */
.sutech-header{position:sticky;top:0;z-index:50;background:rgba(10,11,13,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);transition:transform var(--dur-slow) var(--ease);}
.sutech-header.is-hidden{transform:translateY(-100%);}
.sutech-header-inner{display:flex;align-items:center;justify-content:space-between;height:120px;gap:var(--s6);}
.sutech-header-nav{display:flex;align-items:center;gap:36px;}
.sutech-logo{flex:none;display:block;}
.sutech-logo img{height:88px;width:auto;display:block;}
.sutech-header-actions{display:flex;align-items:center;gap:var(--s3);}
.sutech-menu-toggle-input{position:absolute;opacity:0;pointer-events:none;}
.sutech-menu-toggle{display:none;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;cursor:pointer;color:var(--text-1);flex:none;}
.sutech-menu-toggle svg{width:21px;height:21px;}
.sutech-menu-toggle .icon-close{display:none;}
.sutech-menu-toggle:hover{background:var(--surface);}

/* ---------- search ---------- */
.sutech-search-panel{max-height:0;overflow:hidden;border-bottom:0 solid var(--border);transition:max-height var(--dur-slow) var(--ease),border-color var(--dur-slow) var(--ease);}
.sutech-search-panel.is-open{max-height:96px;border-bottom-width:1px;}
.sutech-search-panel form{display:flex;align-items:center;gap:var(--s3);padding:var(--s4) 0;}
.sutech-search-panel input[type="search"]{flex:1;background:none;border:none;color:var(--text-1);font-family:var(--font-b);font-size:19px;outline:none;}
.sutech-search-panel input[type="search"]::placeholder{color:var(--text-3);}
.sutech-search-panel button{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--text-2);cursor:pointer;flex:none;}
.sutech-search-panel button:hover{color:var(--text-1);border-color:var(--text-3);}
.sutech-search-panel button svg{width:17px;height:17px;}

/* ---------- mobile off-canvas nav ---------- */
.sutech-mobile-panel{position:fixed;top:0;right:0;bottom:0;width:min(320px,84vw);background:var(--surface);border-left:1px solid var(--border);z-index:60;padding:140px var(--s6) var(--s6);display:flex;flex-direction:column;gap:var(--s8);transform:translateX(100%);transition:transform var(--dur-slow) var(--ease);overflow-y:auto;}
.sutech-mobile-panel nav{display:flex;flex-direction:column;gap:var(--s5);}
.sutech-mobile-panel nav a{font-family:var(--font-h);font-size:19px;color:var(--text-1);}
.sutech-mobile-panel nav a.is-active{color:var(--accent);}
.sutech-mobile-social{display:flex;gap:10px;}
.sutech-mobile-social a{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--border);color:var(--text-2);flex:none;}
.sutech-mobile-social a:hover{color:var(--text-1);border-color:var(--text-3);}
.sutech-mobile-social svg{width:14px;height:14px;}
.sutech-mobile-backdrop{position:fixed;inset:0;background:rgba(10,11,13,.6);backdrop-filter:blur(2px);z-index:59;opacity:0;pointer-events:none;transition:opacity var(--dur-slow) var(--ease);}

.sutech-menu-toggle-input:checked ~ .sutech-mobile-panel{transform:translateX(0);}
.sutech-menu-toggle-input:checked ~ .sutech-mobile-backdrop{opacity:1;pointer-events:auto;}
.sutech-menu-toggle-input:checked ~ .sutech-header .icon-menu{display:none;}
.sutech-menu-toggle-input:checked ~ .sutech-header .icon-close{display:block;}

/* ---------- footer ---------- */
.sutech-footer{border-top:1px solid var(--border);padding:var(--s12) 0 var(--s8);}
.sutech-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:var(--s10);padding-bottom:var(--s10);border-bottom:1px solid var(--border);}
.sutech-footer-col-title{font-family:var(--font-h);font-size:13px;color:var(--text-1);font-weight:600;margin-bottom:var(--s4);}
.sutech-footer-links{display:flex;flex-direction:column;gap:10px;}
.sutech-footer-links a{font-size:13.5px;}
.sutech-footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--s6);font-size:12.5px;color:var(--text-3);gap:var(--s4);flex-wrap:wrap;}
.sutech-footer-logo img{height:64px;width:auto;display:block;}
.sutech-footer-social{display:flex;gap:10px;margin-top:var(--s5);}
.sutech-footer-social a{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--border);color:var(--text-2);flex:none;}
.sutech-footer-social a:hover{color:var(--text-1);border-color:var(--text-3);}
.sutech-footer-social svg{width:14px;height:14px;}

/* ---------- hero (front page) ---------- */
.sutech-hero{position:relative;overflow:hidden;min-height:660px;display:flex;align-items:center;}
.sutech-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.sutech-hero-bg video{width:100%;height:100%;object-fit:cover;display:block;}
.sutech-hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg, rgba(10,11,13,.62) 0%, rgba(10,11,13,.55) 40%, rgba(10,11,13,.92) 100%);}
.sutech-hero-glow{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 0%, rgba(47,127,224,.20), transparent 70%);pointer-events:none;}
.sutech-hero-content{position:relative;text-align:center;padding:var(--s24) 0 var(--s16);width:100%;}
.sutech-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border:1px solid var(--border);border-radius:999px;margin-bottom:var(--s8);background:rgba(10,11,13,.4);backdrop-filter:blur(6px);}
.sutech-video-badge{display:inline-flex;align-items:center;gap:10px;margin-top:var(--s16);padding:9px 16px 9px 10px;border-radius:999px;background:rgba(10,11,13,.45);border:1px solid var(--border);backdrop-filter:blur(6px);font-size:13px;color:var(--text-2);}
.sutech-video-badge .play{width:26px;height:26px;border-radius:50%;background:var(--accent);display:inline-flex;align-items:center;justify-content:center;flex:none;}

/* ---------- stats strip ---------- */
.sutech-stats{border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.sutech-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);}
.sutech-stats-grid > div{padding:var(--s8) var(--s6);border-right:1px solid var(--border);}
.sutech-stats-grid > div:last-child{border-right:none;}
.sutech-stat-title{font-family:var(--font-h);font-size:15px;color:var(--text-1);font-weight:600;}
.sutech-stat-desc{font-size:14px;margin-top:6px;color:var(--text-2);}

/* ---------- product grid ---------- */
.sutech-product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);}
.sutech-product-card{overflow:hidden;}
.sutech-product-media{height:200px;display:flex;align-items:center;justify-content:center;background:var(--surface-2);overflow:hidden;}
.sutech-product-media img{max-width:82%;max-height:82%;object-fit:contain;transition:transform var(--dur-slow) var(--ease);}
.sutech-product-card:hover .sutech-product-media img{transform:scale(1.05);}
.sutech-product-body{padding:var(--s6);}
.sutech-product-body h3{font-size:19px;}
.sutech-product-body p{font-size:14px;margin-top:var(--s2);color:var(--text-2);}

/* ---------- CTA band ---------- */
.sutech-cta-band{position:relative;overflow:hidden;border-radius:16px;border:1px solid var(--border);background:linear-gradient(135deg, var(--surface) 0%, var(--surface-2) 100%);padding:var(--s16);text-align:center;}
.sutech-cta-band .glow{position:absolute;inset:0;background:radial-gradient(40% 80% at 90% 10%, rgba(47,127,224,.16), transparent 60%);}

/* ---------- generic content page ---------- */
.sutech-page-header{padding:var(--s20) 0 var(--s16);border-bottom:1px solid var(--border);position:relative;overflow:hidden;}
.sutech-page-header .glow{position:absolute;inset:0;background:radial-gradient(50% 60% at 15% 0%, rgba(47,127,224,.14), transparent 65%);pointer-events:none;}
.sutech-content-grid{display:grid;grid-template-columns:220px 1fr;gap:var(--s16);}
.sutech-content-grid .sutech-toc{position:sticky;top:110px;display:flex;flex-direction:column;gap:14px;}
.sutech-content-body{max-width:700px;}
.sutech-content-body p{font-size:17px;margin:0;}
.sutech-content-body p + p{margin-top:var(--s6);}

/* ---------- breadcrumbs ---------- */
.sutech-breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--text-3);padding:var(--s5) 0 0;}
.sutech-breadcrumbs a{color:var(--text-3);}
.sutech-breadcrumbs a:hover{color:var(--text-1);}
.sutech-breadcrumbs .current{color:var(--text-2);}
.sutech-breadcrumbs .sep{opacity:.5;}

/* ---------- trusted-by / logo strip ---------- */
/* Source logos have mixed white/transparent backgrounds — a uniform white
   chip normalizes them all instead of risking stray boxes on the dark bg. */
.sutech-logos-strip{display:flex;flex-wrap:wrap;gap:var(--s5);}
.sutech-logo-chip{display:flex;align-items:center;justify-content:center;background:#ffffff;border-radius:var(--radius-sm);padding:26px 40px;height:124px;transition:transform var(--dur) var(--ease);}
.sutech-logo-chip:hover{transform:translateY(-2px);}
.sutech-logo-chip img{max-height:64px;max-width:260px;width:auto;object-fit:contain;display:block;}
.sutech-logo-chip.is-dark{background:var(--surface-2);border:1px solid var(--border);}

/* ---------- related content / cross-links ---------- */
.sutech-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6);}

/* ---------- team ---------- */
.sutech-team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s8);}
.sutech-team-card{padding:var(--s8);text-align:center;}
.sutech-team-avatar{width:104px;height:104px;border-radius:50%;margin:0 auto;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--accent-strong);flex:none;}
.sutech-team-avatar img{width:100%;height:100%;object-fit:cover;}
.sutech-team-avatar span{font-family:var(--font-h);font-size:28px;color:#fff;font-weight:600;}
@media (max-width: 900px){
  .sutech-team-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 640px){
  .sutech-team-grid{grid-template-columns:1fr;max-width:320px;margin:0 auto;}
}
.sutech-related-card{overflow:hidden;}
.sutech-related-media{height:150px;background:var(--surface-2);overflow:hidden;}
.sutech-related-media img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-slow) var(--ease);}
.sutech-related-card:hover .sutech-related-media img{transform:scale(1.06);}
.sutech-related-body{padding:var(--s5);}
.sutech-related-body .sutech-tag{margin-bottom:10px;}
.sutech-related-body h4{font-size:15.5px;line-height:1.35;}

/* ---------- post navigation (next/prev) ---------- */
.sutech-post-nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);margin-top:var(--s16);padding-top:var(--s10);border-top:1px solid var(--border);}
.sutech-post-nav .wp-block-post-navigation-link{display:block;}
.sutech-post-nav a{display:block;padding:var(--s5);border:1px solid var(--border);border-radius:var(--radius);}
.sutech-post-nav a:hover{border-color:var(--accent);background:var(--surface);}
.sutech-post-nav .wp-block-post-navigation-link-next{text-align:right;}
.sutech-post-nav .wp-block-post-navigation-link__label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-3);margin-bottom:6px;}
.sutech-post-nav .wp-block-post-navigation-link__title{color:var(--text-1);font-family:var(--font-h);font-size:15px;}

/* ---------- contact ---------- */
.sutech-info-row{display:flex;gap:14px;align-items:flex-start;padding:var(--s4) 0;border-bottom:1px solid var(--border);}
.sutech-info-row:last-child{border-bottom:none;}
.sutech-icon-badge{flex:none;width:36px;height:36px;border-radius:8px;background:rgba(47,127,224,.14);display:flex;align-items:center;justify-content:center;}
.sutech-icon-badge svg{width:17px;height:17px;stroke:var(--accent);}
.sutech-form label{display:block;font-family:var(--font-b);font-size:13px;color:var(--text-2);margin-bottom:8px;}
.sutech-form input,.sutech-form textarea{width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;color:var(--text-1);font-family:var(--font-b);font-size:14.5px;transition:border-color var(--dur) var(--ease);}
.sutech-form input:focus,.sutech-form textarea:focus{outline:none;border-color:var(--accent);}
.sutech-field{margin-bottom:var(--s4);}

/* ---------- single post ---------- */
.sutech-post-article .sutech-tag{margin-bottom:var(--s4);}
.sutech-post-title{margin-top:var(--s3)!important;}
.sutech-post-hero{margin-top:var(--s10);border:1px solid var(--border);max-height:560px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--surface-2);}
.sutech-post-hero img{width:100%;max-height:560px;object-fit:contain;display:block;}
.sutech-post-body{margin-top:var(--s10);display:flex;flex-direction:column;gap:var(--s5);}
.sutech-post-body p{font-size:17px;}

/* ---------- blog / news card grid ---------- */
.sutech-post-query .wp-block-post-template{list-style:none;margin:0;padding:0;}
.sutech-news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6);}
.sutech-news-card{overflow:hidden;display:flex;flex-direction:column;height:100%;}
.sutech-news-thumb{aspect-ratio:16/10;background:var(--surface-2);overflow:hidden;margin:0!important;display:block;}
.sutech-news-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--dur-slow) var(--ease);}
.sutech-news-card:hover .sutech-news-thumb img{transform:scale(1.06);}
.sutech-news-body{padding:var(--s5);display:flex;flex-direction:column;gap:10px;flex:1;}
.sutech-news-title{font-size:16.5px!important;line-height:1.35;margin:0!important;}
.sutech-news-title a{color:var(--text-1)!important;}
.sutech-news-excerpt{font-size:13.5px!important;margin:0!important;color:var(--text-2);flex:1;}
.sutech-news-excerpt p{margin:0;}
.sutech-news-date{font-size:12px!important;color:var(--text-3);margin:0!important;order:-1;}

.sutech-pagination{display:flex;gap:var(--s4);justify-content:center;margin-top:var(--s10);font-size:14px;}
.sutech-pagination a,.sutech-pagination span{color:var(--text-2);}
.sutech-pagination .current{color:var(--accent);font-weight:600;}

/* Feature the first (most recent) post, spanning two columns */
.sutech-news-grid > li:first-child{grid-column:span 2;}
.sutech-news-grid > li:first-child .sutech-news-card{display:grid;grid-template-columns:1.1fr 1fr;}
.sutech-news-grid > li:first-child .sutech-news-thumb{aspect-ratio:auto;height:100%;}
.sutech-news-grid > li:first-child .sutech-news-title{font-size:22px!important;}
.sutech-news-grid > li:first-child .sutech-news-body{justify-content:center;padding:var(--s8);}

/* ---------- 404 ---------- */
.sutech-404-links{display:flex;flex-wrap:wrap;gap:var(--s3);justify-content:center;margin-top:var(--s8);}

@media (max-width: 900px){
  .sutech-header-nav,.sutech-header-cta,.sutech-search-toggle{display:none;}
  .sutech-menu-toggle{display:inline-flex;}
  .sutech-product-grid{grid-template-columns:repeat(2,1fr);}
  .sutech-footer-grid{grid-template-columns:1fr 1fr;}
  .sutech-content-grid{grid-template-columns:1fr;}
  .sutech-content-grid .sutech-toc{position:static;flex-direction:row;flex-wrap:wrap;gap:var(--s5);}
  .sutech-stats-grid{grid-template-columns:1fr;}
  .sutech-stats-grid > div{border-right:none;border-bottom:1px solid var(--border);}
  .sutech-related-grid{grid-template-columns:repeat(2,1fr);}
  .sutech-news-grid{grid-template-columns:repeat(2,1fr);}
  .sutech-news-grid > li:first-child{grid-column:span 2;}
  .sutech-news-grid > li:first-child .sutech-news-card{grid-template-columns:1fr;}
  .sutech-news-grid > li:first-child .sutech-news-thumb{aspect-ratio:16/9;height:auto;}
}

@media (max-width: 640px){
  .sutech-wrap,.sutech-wrap-narrow{padding:0 var(--s6);}
  .sutech-page-header{padding:var(--s16) 0 var(--s10);}
  .sutech-hero{min-height:520px;}
  .sutech-related-grid{grid-template-columns:1fr;}
  .sutech-post-nav{grid-template-columns:1fr;}
  .sutech-post-nav .wp-block-post-navigation-link-next{text-align:left;}
  .sutech-footer-grid{grid-template-columns:1fr;gap:var(--s8);}
  .sutech-footer-bottom{flex-direction:column;align-items:flex-start;}
  .sutech-news-grid{grid-template-columns:1fr;}
  .sutech-news-grid > li:first-child{grid-column:span 1;}
}

@media (max-width: 420px){
  .sutech-header-inner{height:96px;}
  .sutech-logo img{height:72px;}
  .sutech-logos-strip{gap:var(--s6);}
  .sutech-logo-chip{height:88px;padding:16px 24px;}
  .sutech-logo-chip img{max-height:44px;max-width:180px;}
}
