/*
 * Identity layer for Website Repair Service.
 * Isolated to this replica; commercial copy and layout remain unchanged.
 */
:root {
  --navy:#111C2B; --navy-2:#17283D; --navy-3:#1E3652;
  --ink:#142235; --paper:#F4F7F8; --muted:#647386; --line:#D7E0E6;
  --blue:#315FE8; --blue-bright:#557CF3; --cyan:#1CB6A3;
  --amber:#F3B84B; --danger:#E56355;
  --soft-blue:#E9EEFF; --soft-cyan:#E4F7F3;
  --radius:10px;
  --sans:'Manrope', sans-serif; --serif:'Manrope', sans-serif;
  --shadow:0 28px 80px color-mix(in srgb, var(--navy) 18%, transparent);
}
body {font-family:var(--sans);}
h1,h2,.service-grid h3,.protocol-list h3,.specialist-card h3,.article-content>p,
.article-content>ul li,.article-content>ol li,.brand strong,.big-copy {font-family:var(--serif);}
.brand strong {font-family:var(--sans);font-weight:800;}
.brand-symbol {background:var(--navy);border-radius:var(--radius);color:#fff;}
.brand-symbol svg {width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round;}
.site-header {background:color-mix(in srgb, var(--paper) 92%, transparent);}
.hero,.page-hero,.article-head {
  background:linear-gradient(122deg,color-mix(in srgb,var(--paper) 94%,#fff),color-mix(in srgb,var(--soft-blue) 68%,var(--paper)));
}
.hero:before {background-image:linear-gradient(color-mix(in srgb,var(--blue) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--blue) 7%,transparent) 1px,transparent 1px);}
.hero:after,.page-hero:after,.article-head:after {border-color:color-mix(in srgb,var(--blue) 18%,transparent);}
.button-primary {box-shadow:0 14px 34px color-mix(in srgb,var(--blue) 28%,transparent);}
.button-primary:hover {background:var(--blue-bright);}
.header-cta-visible {background:var(--amber);border-color:color-mix(in srgb,var(--amber) 75%,var(--navy));color:var(--navy);box-shadow:0 10px 28px color-mix(in srgb,var(--amber) 28%,transparent);}
.header-cta-visible:hover {background:color-mix(in srgb,var(--amber) 82%,#fff);}
.evidence {background:color-mix(in srgb,var(--paper) 78%,var(--line));}
.faq {background:color-mix(in srgb,var(--paper) 92%,var(--line));}
.site-footer {background:color-mix(in srgb,var(--navy) 88%,#000);}
.footer-brand .brand-symbol {background:#fff;color:var(--navy);}
.specialist-card,.closing,.mobile-emergency,.trust-rail {background:var(--blue);}
.incident-console,.protocol {background:var(--navy);}
.service-grid>a,.post-grid article,.seo-check-grid article,.guide-hub-grid a {border-radius:calc(var(--radius) * .55);}
@media(max-width:600px) {
  .brand>span:last-child {max-width:190px;}
  .brand strong {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
}


/* Sans-only hierarchy: identity is built with weight, scale and spacing. */
body {font-family:var(--sans);font-weight:400;}
h1,h2,h3,.big-copy,.article-content>p,.article-content>ul li,.article-content>ol li,
.service-grid h3,.protocol-list h3,.specialist-card h3 {
  font-family:var(--sans);
  font-style:normal;
}
h1 {font-weight:700;letter-spacing:-.055em;}
h2 {font-weight:700;letter-spacing:-.048em;}
h3,.service-grid h3,.protocol-list h3,.specialist-card h3 {font-weight:700;letter-spacing:-.035em;}
h1 em,h2 em,.hero h1 em,.blog-hero h1 em {
  font-family:var(--sans);
  font-weight:550;
  font-style:italic;
  letter-spacing:-.045em;
}
.big-copy,.article-content>p,.article-content>ul li,.article-content>ol li {
  font-weight:450;
  letter-spacing:-.018em;
}
.kicker,.button,.brand strong,.site-header nav a {font-family:var(--sans);font-weight:800;}

/* Layout differentiation v1 — 2026-07-27 */
@media (min-width: 901px) {
  .hero-grid{grid-template-columns:minmax(0,1.34fr) minmax(340px,.66fr);gap:54px}
  .incident-console{transform:translateY(22px)}
  .split-heading{grid-template-columns:.82fr 1.18fr;gap:8vw}
  .service-grid{gap:18px;border:0}
  .service-grid>a{border:1px solid var(--line);min-height:390px}
  .service-grid>a:nth-child(2){transform:translateY(24px)}
  .protocol-grid{grid-template-columns:.72fr 1.28fr}
  .evidence-grid{grid-template-columns:1.18fr .82fr}
}
.trust-rail .wrap{max-width:1040px}
.closing-grid{grid-template-columns:1.4fr .6fr}
/* Console identity: technical diagnostic panel */
.incident-console{border-radius:18px;border:1px solid color-mix(in srgb,var(--blue) 32%,transparent);box-shadow:0 30px 70px color-mix(in srgb,var(--navy) 24%,transparent)}
.console-head{background:color-mix(in srgb,var(--navy) 82%,var(--blue));border-bottom:0}
.console-body{padding:30px}
.console-label{padding-bottom:18px;border-bottom:2px solid var(--blue)}
.console-body>a{margin-top:8px;padding:15px 14px;border:1px solid rgba(255,255,255,.1);border-radius:9px;background:rgba(255,255,255,.035)}
.console-body>a:hover{background:rgba(255,255,255,.075)}
.console-foot{background:rgba(0,0,0,.18)}
/* Header/footer identity: structured technical service */
@media (min-width:901px){
  .site-header{margin:12px 18px 0;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 35px rgba(17,28,43,.07)}
  .header-inner{min-height:82px}.site-header nav{margin-left:auto}
  .footer-lead{grid-template-columns:1.45fr .55fr}.footer-grid{grid-template-columns:1.6fr .7fr .7fr}
}
.site-footer{border-top:6px solid var(--blue)}
.footer-bottom{border-top-style:dashed}
@media (max-width: 900px) {
  .closing-grid{display:grid;grid-template-columns:1fr;text-align:left}
  .closing-grid>div:last-child{width:100%}
}