/* Tecoris www site styles */
:root{
	--bg:#0b0f19;
	--card:#111726;
	--text:#e7ecf6;
	--muted:#a5b1c9;
	--brand:#7aa2ff;
	--brand-2:#8bd3ff;
	--accent:#22c55e;
	--danger:#ef4444;
	--border:#1e2638;
}
/* Light theme override for marketing pages */
.theme-light{
	/* Grayscale palette to match uploaded example */
	--bg:#ffffff;        /* white background */
	--card:#ffffff;      /* white cards */
	--text:#111111;      /* near-black body text */
	--muted:#6b7280;     /* slate-ish gray for meta */
	--brand:#111111;     /* links and brand are black */
	--brand-2:#111111;   /* not used, keep black */
	--accent:#111111;    /* primary action is black */
	--danger:#dc2626;
	--border:#e5e7eb;    /* light gray dividers */
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji"}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none}
a:hover{opacity:0.8;text-decoration:underline}

/* Promo graphics responsive behavior */
.promo-graphics svg{max-width:100%;height:auto}
@media (max-width:640px){
	.promo-graphics{flex-direction:column !important;align-items:center !important}
	/* Reorder so browser appears first, phone second on small screens */
	.promo-graphics .browser-graphic{order:1}
	.promo-graphics .phone-graphic{order:2}
}

.wrap{width:100%;max-width:1100px;margin:0 auto;padding:0 20px}
.wrap.narrow{max-width:820px}

.site-header{position:sticky;top:0;z-index:60;background:#ffffff;backdrop-filter:saturate(120%) blur(8px)}
.theme-light .site-header{background:rgba(255,255,255,0.8)}
.site-header .wrap{position:relative;display:flex;align-items:center;justify-content:flex-end;height:130px}
.site-header .left-actions{position:absolute;left:20px;display:flex;align-items:center;gap:12px}
.site-header .brand{position:absolute;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px}
.site-header .brand img.logo{height:100px;width:auto;display:block}
.site-header nav{display:flex;gap:16px}
.site-header nav a{color:var(--muted);text-decoration:none;padding:8px 10px;border-radius:8px}
.site-header nav a:hover{color:var(--text);background:rgba(0,0,0,0.04)}

.topbar{position:sticky;top:0;z-index:50;background:rgba(11,15,25,0.75);backdrop-filter:saturate(120%) blur(10px);border-bottom:1px solid var(--border)}
.topbar .inner{display:flex;align-items:center;justify-content:space-between;height:56px}
.brand{color:var(--text);text-decoration:none;font-weight:700;letter-spacing:0.3px}
.brand:hover{color:var(--brand)}
.nav{display:flex;gap:16px}
.nav a{color:var(--muted);text-decoration:none;padding:8px 10px;border-radius:8px}
.nav a:hover{color:var(--text);background:rgba(255,255,255,0.05)}

.hero{padding:56px 0 24px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(122,162,255,0.08),rgba(0,0,0,0))}
.hero h1{font-size:42px;line-height:1.15;margin:0 0 12px}
.hero p{margin:0;color:var(--muted);font-size:18px}

/* Banner-style hero with centered overlay text */
.hero-banner{position:relative;padding:0;border-bottom:1px solid var(--border)}
.hero-banner .hero-media{aspect-ratio: 21/9;min-height:340px;background-position:center;background-size:cover;display:flex;align-items:center;justify-content:center}
.hero-banner .headline{font-size:40px;line-height:1.15;margin:0;color:#fff;text-shadow:0 2px 30px rgba(0,0,0,0.6)}
.theme-light .hero-banner .headline{color:#fff}

section{padding:28px 0;border-bottom:1px solid var(--border)}
.intro{padding:24px 0;border-bottom:none}
.intro p{font-size:18px;line-height:1.7;color:var(--text)}
.intro p + p{margin-top:12px}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.col-4{grid-column:span 4}
.col-6{grid-column:span 6}
.col-12{grid-column:span 12}

/* Service cards */
.services-grid{display:flex;flex-direction:column;gap:28px}
.service-row{display:flex;align-items:flex-start}
.service-icon{width:144px !important;height:auto;display:block;margin:0 auto 10px}
.service-card{flex:1;display:flex;flex-direction:column;padding:0;overflow:hidden;min-width:0}
.service-card .service-body{padding:16px;text-align:center;display:flex;flex-direction:column;align-items:center}
.service-card .service-body h3{margin:6px 0 8px}
.service-card .service-body p{margin:0;text-align:left;align-self:stretch}
.service-inner{display:none}
.arrow-row{display:flex;justify-content:center;align-items:center;padding:0 0 4px}

/* Mobile: stack icon above text for narrow screens */
@media (max-width:600px){
	.services-grid .card{flex-direction:column;align-items:flex-start}
	.services-grid .card .service-media{flex:0 0 auto}
}
.price{font-weight:700}

.button{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;border:1px solid var(--brand);background:#ffffff;color:var(--brand);cursor:pointer;text-decoration:none}
.button.primary{background:var(--brand);color:#ffffff;border:1px solid var(--brand);font-weight:700}
.button.primary:hover{filter:brightness(1.05)}
.button.ghost{background:transparent}
.button.danger{border-color:#3c1b1b;background:#1a0f0f;color:#ffd7d7}

h1,h2,h3{line-height:1.25}
h2{margin:0 0 12px}
p{margin:0 0 12px;color:var(--text)}
small, .muted{color:var(--muted)}

.table{width:100%;border-collapse:separate;border-spacing:0}
.table th,.table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left}
.table th{color:var(--muted);font-weight:600}
.table tr:hover td{background:rgba(255,255,255,0.03)}

.site-footer{border-top:1px solid var(--border);padding:22px 0;color:var(--muted)}
.site-footer .wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}

.alert{padding:12px 14px;border-radius:10px;border:1px solid var(--border);background:#0c1323}
.alert.success{border-color:#1f3b2b;background:#0d1a12;color:#c6f6d5}
.alert.warn{border-color:#3b2f1f;background:#1a140d;color:#ffe7b7}
.alert.danger{border-color:#402126;background:#1a0f11;color:#ffd1d7}

input,select,textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:#0c1323;color:var(--text)}
label{display:block;margin:12px 0 6px;color:var(--muted)}
/* Light theme form fields: white inputs with dark text */
.theme-light input,.theme-light select,.theme-light textarea{background:#ffffff;color:#111;border:1px solid #e5e7eb}
/* Contact form layout */
.contact-form .grid{gap:12px}
.contact-form .actions{margin-top:8px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid var(--brand);background:#ffffff;color:var(--brand);cursor:pointer;text-decoration:none}
/* Primary header buttons: rectangular, blue background, white text */
.btn.primary{background:#2563eb;color:#ffffff;border:1px solid #2563eb;font-weight:700;border-radius:8px}
.btn.primary:hover{filter:brightness(1.05)}
.btn:disabled{opacity:0.6;cursor:not-allowed}

@media (max-width:900px){
	.grid{grid-template-columns:repeat(6,1fr)}
	.col-4{grid-column:span 6}
	.col-6{grid-column:span 6}
	.services-grid{gap:24px}
	.service-row{gap:0}
	.service-icon{width:128px !important}
}
@media (max-width:600px){
	/* Compact header/logo on small devices to avoid vertical crowding */
	.site-header .wrap{height:84px}
	.site-header .brand img.logo{height:56px}
	section{padding:22px 0}
	.grid{gap:20px}
	.intro p{font-size:17px;line-height:1.75}
	.hero h1{font-size:32px}
	.service-row{flex-direction:column}
	.service-icon{width:112px !important}
}

/* Accessibility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* FINAL OVERRIDE: ensure compact centered service icons */
.services-grid .service-icon{width:144px !important;height:auto !important;display:block !important;margin:0 auto 10px !important;padding:0 !important}
@media (max-width:900px){
	.services-grid .service-icon{width:128px !important}
}
@media (max-width:600px){
	.services-grid .service-icon{width:112px !important}
}

/* Consulting icon 25% larger than base sizes */
.services-grid .service-icon[src*="consulting.svg"]{width:180px !important}
@media (max-width:900px){
	.services-grid .service-icon[src*="consulting.svg"]{width:160px !important}
}
@media (max-width:600px){
	.services-grid .service-icon[src*="consulting.svg"]{width:140px !important}
}

/* SaaS icon 25% larger than base sizes */
.services-grid .service-icon[src*="saas.svg"]{width:180px !important}
@media (max-width:900px){
	.services-grid .service-icon[src*="saas.svg"]{width:160px !important}
}
@media (max-width:600px){
	.services-grid .service-icon[src*="saas.svg"]{width:140px !important}
}

/* Footer layout: force centered button with text below */
.site-footer .wrap{display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:center !important;gap:12px !important;text-align:center !important}