/* ---- Header Logo Fix ---- */
header .brand img {
    max-height: 45px;      /* Reduce logo height */
    width: auto;           /* Keep proportions */
    margin: 8px 0;         /* Add breathing space */
}

/* --- Sansui brand: white / red / grey --- */
@import url("../fonts/Brink.css");  /* uses your Brink font-face file */

/* Fallback stack in case Brink doesn't load */
:root{
  --brand-red:#e31c23;
  --brand-grey:#6c6f73;      /* text grey */
  --brand-dark:#222;         /* headings */
  --brand-light:#f6f7f8;     /* light bg */
  --maxw:1200px;
  --radius:14px;
  --shadow:0 6px 18px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Brink", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--brand-dark);
  background:#fff;
  line-height:1.6;
}

/* layout */
.container{max-width:var(--maxw);margin:0 auto;padding:24px}
.header{border-bottom:1px solid #ececec;background:#fff;position:sticky;top:0;z-index:20}
.header .bar{display:flex;gap:20px;align-items:center;justify-content:space-between;padding:14px 0}
.logo{display:flex;gap:12px;align-items:center}
.logo img{height:40px;width:auto}
.logo .name{font-weight:700;letter-spacing:.4px}

.nav{display:flex;gap:18px;flex-wrap:wrap}
.nav a{
  text-decoration:none;color:var(--brand-dark);padding:8px 10px;border-radius:10px;
}
.nav a:hover{background:var(--brand-light)}

.langs{display:flex;gap:8px;align-items:center}
.badge{font-size:12px;padding:6px 10px;border:1px solid #ddd;border-radius:999px;background:#fff}
.badge--red{border-color:var(--brand-red);color:var(--brand-red)}

.hero{
  background:linear-gradient(180deg,#fff, #fafafb);
  border-bottom:1px solid #eee;
}
.hero .inner{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;padding:40px 0}
@media (max-width:920px){ .hero .inner{grid-template-columns:1fr} }

h1,h2,h3{line-height:1.2;margin:0 0 12px}
h1{font-size:40px}
h2{font-size:28px;margin-top:22px}
p{margin:0 0 12px;color:var(--brand-grey)}

.btn{
  display:inline-block;background:var(--brand-red);color:#fff;
  padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:600;
  box-shadow:var(--shadow);transition:.15s transform ease;
}
.btn:hover{transform:translateY(-1px)}
.btn--ghost{background:#fff;color:var(--brand-red);border:1px solid var(--brand-red)}

.grid{display:grid;gap:18px}
.grid--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){ .grid--3{grid-template-columns:1fr} }

.card{
  border:1px solid #eee;border-radius:var(--radius);padding:18px;background:#fff;box-shadow:var(--shadow)
}
.card h3{margin-bottom:6px}

.footer{border-top:1px solid #eee;background:#fff;margin-top:32px}
.footer .bar{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:16px 0;color:var(--brand-grey);font-size:14px}

/* === Global header / logo sizing (site-wide) === */
header.container{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding:10px 0;
}

header .brand img{
  max-height:130px;   /* 2× larger */
  width:auto;
  margin:10px 0;
}

@media (max-width:768px){
  header .brand img{ max-height:70px; }
}
/* kill switch for any Google sign in UI */
#g_id_onload, .g_id_signin, iframe[src*=""accounts.google.com""] { display:none !important; visibility:hidden !important; }