/* Wayne County Foundation Repair — DryMich-inspired design system */
:root{
  --brand-primary:#E2211C;
  --brand-secondary:#152E54;
  --brand-secondary-dark:#0d1f3d;
  --teal-700:#36748B;
  --teal-400:#72B1C8;
  --yellow-400:#F6C44A;
  --grey-100:#EFEFEF;
  --grey-400:#636569;
  --grey-700:#313131;
  --white:#FFFFFF;
  --focus:#3D75FF;
  --shadow-card:0 0 40px rgba(0,0,0,.15);
  --shadow-lift:0 12px 32px rgba(0,0,0,.18);
  --radius:8px;
  --button-dark-contrast:linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1)),var(--brand-primary);
  --button-light-contrast:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.9)),var(--brand-secondary);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-weight:300;
  color:var(--grey-700);
  line-height:1.5;
  background:var(--white);
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal-700);text-decoration:none;display:inline-block;transition:color .2s ease}
a:hover{color:var(--brand-secondary);text-decoration:underline}

.container{max-width:80rem;margin:0 auto;padding:0 1.25rem}

/* Typography — DryMich pattern */
h1,h2,h3,h4,h5,h6{
  font-family:'Inter','Helvetica Neue',sans-serif;
  letter-spacing:.03em;
  line-height:1.1;
  color:var(--brand-secondary);
}
h1{font-size:2.33rem;font-weight:800}
h2{font-size:1.33rem;font-weight:300;line-height:1.2}
h3{font-size:1.33rem;font-weight:700}
h4{font-size:1.17rem;font-weight:700}
@media(min-width:48em){
  h1{font-size:2.66rem}
  h2{font-size:2.33rem}
  h3{font-size:1.83rem}
  h4{font-size:1.33rem}
}
p{font-size:1.16rem;line-height:1.5;color:var(--grey-700);font-weight:300}
@media(min-width:48em){p{font-size:1rem}}

/* Top contact bar */
.topbar{
  background:var(--brand-secondary);
  color:var(--white);
  padding:.6rem 0;
  font-size:.875rem;
  text-align:center;
  font-weight:500;
  letter-spacing:.02em;
}
.topbar a{color:var(--yellow-400);font-weight:700;margin-left:.5rem}
.topbar a:hover{color:var(--white)}

/* Header */
header{
  background:var(--white);
  border-bottom:1px solid var(--grey-100);
  padding:1rem 0;
  position:sticky;top:0;z-index:100;
  box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.logo{
  font-family:'Inter',sans-serif;
  font-weight:800;
  font-size:1.1rem;
  color:var(--brand-secondary);
  letter-spacing:.02em;
  line-height:1.1;
  text-transform:uppercase;
}
.logo span{color:var(--brand-primary);display:block;font-size:.85rem}
nav ul{list-style:none;display:flex;gap:1.5rem;flex-wrap:wrap}
nav a{
  color:var(--grey-700);
  font-weight:500;
  font-size:.875rem;
  text-transform:capitalize;
  transition:color .2s;
}
nav a:hover{color:var(--brand-primary);text-decoration:none}
.cta-phone{
  background:var(--brand-primary);
  color:var(--white) !important;
  padding:.75rem 1.25rem;
  border-radius:var(--radius);
  font-weight:800;
  font-size:.875rem;
  letter-spacing:.02em;
}
.cta-phone:hover{
  background:var(--button-dark-contrast);
  color:var(--white) !important;
  text-decoration:none;
}

/* Buttons — DryMich style */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  background:var(--brand-primary);
  color:var(--white) !important;
  padding:.85rem 1.5rem;
  border-radius:var(--radius);
  font-family:'Inter',sans-serif;
  font-weight:800;
  font-size:.875rem;
  text-transform:capitalize;
  letter-spacing:.02em;
  border:1px solid transparent;
  cursor:pointer;
  transition:all .25s ease-in;
  text-decoration:none !important;
}
.btn:hover{
  background:var(--button-dark-contrast);
  color:var(--white) !important;
}
.btn-outline{
  background:transparent;
  border:2px solid var(--white);
  color:var(--white) !important;
}
.btn-outline:hover{
  background:var(--button-light-contrast);
  color:var(--brand-secondary) !important;
  border-color:var(--white);
}
.btn-secondary{
  background:var(--brand-secondary);
  color:var(--white) !important;
}
.btn-secondary:hover{
  background:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.15)),var(--brand-secondary);
}

/* HERO — DryMich pattern: full-bleed image, dark gradient, floating form */
.hero{
  position:relative;
  min-height:520px;
  padding:3rem 1.25rem;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:linear-gradient(135deg,var(--brand-secondary-dark) 0%,var(--brand-secondary) 100%);
}
.hero-bg{
  position:absolute;inset:0;
  background-image:
    linear-gradient(90deg,rgba(0,0,0,.85) 1.7%,rgba(49,49,49,0) 50%),
    linear-gradient(0deg,rgba(0,45,116,.75),rgba(0,45,116,.75)),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 600"><defs><pattern id="p" width="80" height="80" patternUnits="userSpaceOnUse"><path d="M0 0h80v80H0z" fill="%230d1f3d"/><path d="M0 40h80M40 0v80" stroke="%23152e54" stroke-width="1"/></pattern></defs><rect fill="url(%23p)" width="1600" height="600"/></svg>');
  background-size:cover;
  background-position:center;
  z-index:1;
}
.hero .container{position:relative;z-index:2;width:100%}
.hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
  align-items:center;
}
@media(min-width:64em){
  .hero{min-height:560px;padding:5rem 1.25rem}
  .hero-grid{grid-template-columns:1fr 489px;gap:3rem}
}
.hero-content h1{
  color:var(--white);
  font-size:2rem;
  font-weight:300;
  line-height:1.15;
  text-shadow:0 2px 6px rgba(0,0,0,.3);
  margin-bottom:1rem;
  letter-spacing:.02em;
}
.hero-content h1 strong{font-weight:800;display:block}
@media(min-width:48em){.hero-content h1{font-size:3rem}}
.hero-content p{
  color:var(--white);
  font-size:1.16rem;
  font-weight:300;
  margin-bottom:1.5rem;
  max-width:540px;
  text-shadow:0 1px 3px rgba(0,0,0,.3);
}
.hero-trust{
  display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.5rem;
  color:var(--white);font-size:.875rem;font-weight:500;
}
.hero-trust span{display:flex;align-items:center;gap:.4rem}
.hero-trust svg{color:var(--yellow-400);flex-shrink:0}

/* Floating contact card (DryMich signature) */
.hero-form{
  background:var(--white);
  border-radius:var(--radius);
  padding:1.75rem;
  box-shadow:var(--shadow-card);
  border:1px solid rgba(99,101,105,.1);
}
.hero-form h3{
  font-size:1.33rem;
  margin-bottom:.4rem;
  color:var(--brand-secondary);
}
.hero-form p.sub{
  font-size:.875rem;
  color:var(--grey-400);
  margin-bottom:1.25rem;
}
.form-row{margin-bottom:.875rem}
.form-row label{
  display:block;
  font-size:.75rem;
  font-weight:700;
  color:var(--grey-700);
  margin-bottom:.35rem;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.form-row input,
.form-row select,
.form-row textarea{
  width:100%;
  padding:.75rem .9rem;
  border:1px solid var(--grey-400);
  border-radius:var(--radius);
  font-family:inherit;
  font-size:.9rem;
  background:var(--white);
  transition:box-shadow .2s, border-color .2s;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus{
  outline:0;
  border-color:var(--teal-400);
  box-shadow:0 0 0 4px rgba(114,177,200,.3);
}
.hero-form .btn{width:100%;justify-content:center;margin-top:.5rem;font-size:.95rem;padding:1rem}
.hero-form .fineprint{
  font-size:.7rem;
  color:var(--grey-400);
  margin-top:.75rem;
  text-align:center;
  font-weight:300;
}

/* Sections */
section{padding:3rem 0}
@media(min-width:48em){section{padding:4.5rem 0}}
section.alt{background:#f7f9fc}
section.dark{background:var(--brand-secondary);color:var(--white)}
section.dark h2,section.dark h3{color:var(--white)}
section.dark p{color:rgba(255,255,255,.85)}

.section-head{text-align:center;max-width:760px;margin:0 auto 3rem}
.section-head h2{margin-bottom:1rem}
.section-head p{color:var(--grey-400);font-size:1.05rem}

/* Decorative parallelogram (DryMich shape) */
.parallelogram-bg{
  position:relative;
  overflow:hidden;
}
.parallelogram-bg::before{
  content:'';
  position:absolute;
  top:-50px;
  right:-100px;
  width:60%;
  height:200%;
  background:var(--brand-secondary);
  transform:skewX(-12deg);
  z-index:0;
  opacity:.06;
}
.parallelogram-bg > *{position:relative;z-index:1}

/* Service grid */
.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}
@media(min-width:48em){
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-4{grid-template-columns:repeat(4,1fr)}
}
.card{
  background:var(--white);
  border-radius:var(--radius);
  padding:2rem 1.75rem;
  border:1px solid var(--grey-100);
  box-shadow:0 2px 12px rgba(0,0,0,.04);
  transition:transform .25s ease, box-shadow .25s ease;
  position:relative;
  overflow:hidden;
}
.card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-lift);
}
/* Premium icon tile — DryMich/godly.website style, white card with subtle shadow */
.card .icon-tile{
  width:72px;height:72px;
  background:var(--white);
  border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.5rem;
  position:relative;
  box-shadow:
    0 1px 2px rgba(21,46,84,.06),
    0 4px 12px rgba(21,46,84,.08),
    inset 0 0 0 1px rgba(21,46,84,.04);
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease;
}
.card .icon-tile::before{
  content:'';
  position:absolute;
  inset:-2px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(226,33,28,.15),rgba(21,46,84,.05));
  z-index:-1;
  opacity:0;
  transition:opacity .35s ease;
}
.card .icon-tile svg{
  width:44px;height:44px;
  filter:drop-shadow(0 2px 4px rgba(21,46,84,.12));
  transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.card:hover .icon-tile{
  transform:translateY(-4px) rotate(-3deg);
  box-shadow:
    0 2px 4px rgba(21,46,84,.08),
    0 12px 28px rgba(21,46,84,.16),
    inset 0 0 0 1px rgba(226,33,28,.15);
}
.card:hover .icon-tile::before{opacity:1}
.card:hover .icon-tile svg{transform:scale(1.08)}

/* Legacy icon-circle (kept as alias to tile for backwards compat) */
.card .icon-circle{
  width:72px;height:72px;
  background:var(--white);
  border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.5rem;
  box-shadow:0 4px 12px rgba(21,46,84,.08), inset 0 0 0 1px rgba(21,46,84,.04);
}
.card .icon-circle svg{width:38px;height:38px}
.card h3{font-size:1.2rem;margin-bottom:.75rem;color:var(--brand-secondary)}
.card p{font-size:.95rem;color:var(--grey-400);margin-bottom:1rem}
.card-link{
  color:var(--brand-primary) !important;
  font-weight:700;
  font-size:.875rem;
  text-transform:capitalize;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}
.card-link:hover{color:var(--brand-secondary) !important;text-decoration:none}

/* Checkmark list (DryMich pattern) */
.check-list{list-style:none;padding:0}
.check-list li{
  position:relative;
  padding-left:2.25rem;
  margin-bottom:1rem;
  font-size:1rem;
  line-height:1.5;
}
.check-list li::before{
  content:'';
  position:absolute;
  left:0;top:3px;
  width:24px;height:24px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'><path fill='%2336748B' d='M12 .923C5.892.923.923 5.892.923 12S5.892 23.077 12 23.077 23.077 18.108 23.077 12 18.107.923 12 .923zm0 1.846c5.11 0 9.23 4.122 9.23 9.231 0 5.11-4.12 9.23-9.23 9.23A9.216 9.216 0 0 1 2.769 12c0-5.11 4.121-9.23 9.23-9.23zm3.865 3.75a.502.502 0 0 0-.346.231l-4.529 6.721-2.134-2.106c-.184-.277-.538-.299-.722-.115l-.836.837c-.184.277-.184.652 0 .836l3.23 3.23c.184.095.444.29.722.29.184 0 .48-.098.663-.376l5.539-8.134c.184-.278.079-.538-.289-.721l-.923-.664c-.094-.047-.238-.05-.375-.029z'/></svg>");
  background-size:contain;
}

/* Two-column blocks */
.two-col{
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
  align-items:center;
}
@media(min-width:64em){.two-col{grid-template-columns:1fr 1fr;gap:4rem}}
.two-col h2{text-align:left;margin-bottom:1rem}

/* Stat row */
.stat-row{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1.5rem;
  margin:2rem 0;
}
@media(min-width:48em){.stat-row{grid-template-columns:repeat(4,1fr)}}
.stat{text-align:center}
.stat .num{
  display:block;
  font-size:2.5rem;
  font-weight:800;
  color:var(--brand-primary);
  line-height:1;
}
.stat .label{
  display:block;
  font-size:.875rem;
  color:var(--grey-400);
  margin-top:.4rem;
  font-weight:500;
}

/* CTA band */
.cta-band{
  background:linear-gradient(135deg,var(--brand-secondary) 0%,var(--brand-secondary-dark) 100%);
  color:var(--white);
  padding:4rem 0;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.cta-band::before{
  content:'';
  position:absolute;top:0;right:-10%;
  width:50%;height:100%;
  background:var(--brand-primary);
  transform:skewX(-15deg);
  opacity:.08;
}
.cta-band h2{color:var(--white);margin-bottom:1rem}
.cta-band p{color:rgba(255,255,255,.9);font-size:1.15rem;margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}
.cta-band .btn{padding:1rem 2rem;font-size:1rem}

/* FAQ */
.faq{display:grid;gap:1rem;max-width:880px;margin:0 auto}
.faq-item{
  background:var(--white);
  border:1px solid var(--grey-100);
  border-radius:var(--radius);
  padding:1.5rem 1.75rem;
}
.faq-item h3{
  font-size:1.05rem;
  color:var(--brand-secondary);
  margin-bottom:.5rem;
}
.faq-item p{font-size:.95rem;color:var(--grey-400);margin:0}

/* Breadcrumb */
.breadcrumb{
  background:#f7f9fc;
  padding:.875rem 0;
  font-size:.8rem;
  color:var(--grey-400);
  border-bottom:1px solid var(--grey-100);
}
.breadcrumb a{color:var(--brand-secondary)}

/* Article */
article{max-width:820px;margin:0 auto}
article h1{font-size:2.3rem;margin-bottom:.5rem;font-weight:800}
article h2{font-size:1.7rem;font-weight:700;text-align:left;margin:2.5rem 0 1rem}
article h3{font-size:1.25rem;margin:1.75rem 0 .75rem}
article p{margin-bottom:1.1rem}
article ul,article ol{margin:1rem 0 1.5rem 0;padding-left:0}
article ul li{
  position:relative;padding-left:1.5rem;margin-bottom:.5rem;font-size:1rem;
}
article ul li::before{
  content:'';position:absolute;left:0;top:10px;width:6px;height:6px;
  border-radius:50%;background:var(--brand-primary);
}
.meta{color:var(--grey-400);font-size:.85rem;margin-bottom:2rem;font-weight:500}

/* Footer */
footer{
  background:var(--brand-secondary-dark);
  color:var(--white);
  padding:4rem 0 1.5rem;
  font-size:.9rem;
}
footer h4{
  color:var(--white);
  font-size:.95rem;
  margin-bottom:1rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:800;
}
footer a{color:rgba(255,255,255,.75)}
footer a:hover{color:var(--yellow-400);text-decoration:none}
footer ul{list-style:none}
footer li{margin-bottom:.5rem;font-size:.875rem}
.footer-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
  margin-bottom:2.5rem;
}
@media(min-width:48em){.footer-grid{grid-template-columns:repeat(4,1fr);gap:2rem}}
.footer-cta{
  background:var(--brand-primary);
  color:var(--white);
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.75rem 1.25rem;
  border-radius:var(--radius);
  font-weight:800;
  font-size:.875rem;
  margin-top:.5rem;
}
.footer-cta:hover{color:var(--white);text-decoration:none;background:var(--button-dark-contrast)}
.copyright{
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:1.5rem;
  text-align:center;
  color:rgba(255,255,255,.5);
  font-size:.8rem;
}

/* Pill chip */
.chip{
  display:inline-block;
  background:rgba(226,33,28,.1);
  color:var(--brand-primary);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  padding:.4rem .85rem;
  border-radius:99px;
  margin-bottom:1rem;
}

/* Cities grid (smaller cards) */
.city-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.75rem;
}
@media(min-width:48em){.city-grid{grid-template-columns:repeat(4,1fr)}}
.city-tile{
  background:var(--white);
  border:1px solid var(--grey-100);
  border-radius:var(--radius);
  padding:1rem;
  text-align:center;
  color:var(--brand-secondary);
  font-weight:700;
  font-size:.95rem;
  transition:all .2s;
  text-decoration:none;
}
.city-tile:hover{
  background:var(--brand-secondary);
  color:var(--white);
  border-color:var(--brand-secondary);
  text-decoration:none;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(21,46,84,.15);
}

/* Dropdown navigation */
nav .has-dropdown{position:relative}
nav .dropdown{
  display:none;
  position:absolute;
  top:100%;left:0;
  background:#fff;
  border-radius:var(--radius);
  box-shadow:0 12px 32px rgba(21,46,84,.18);
  padding:.5rem;
  min-width:260px;
  flex-direction:column !important;
  gap:0 !important;
  margin-top:.25rem;
  border:1px solid var(--grey-100);
  z-index:200;
}
nav .has-dropdown:hover .dropdown,
nav .has-dropdown:focus-within .dropdown{display:flex}
nav .dropdown li{margin:0}
nav .dropdown a{
  display:block;
  padding:.55rem .85rem;
  border-radius:6px;
  font-size:.875rem;
  color:var(--grey-700);
  white-space:nowrap;
}
nav .dropdown a:hover{
  background:var(--brand-secondary);
  color:#fff !important;
  text-decoration:none;
}

@media(max-width:48em){
  nav .dropdown{
    position:static;
    display:flex;
    box-shadow:none;
    background:#f7f9fc;
    margin-top:.25rem;
    border:0;
    padding:.25rem 0;
    min-width:auto;
  }
  nav .dropdown a{padding:.4rem .75rem;font-size:.8rem}
  nav ul{gap:1rem;font-size:.85rem}
  .nav{flex-direction:column;text-align:center}
  .cta-phone{width:100%;text-align:center;justify-content:center}
  h1{font-size:2rem}
  h2{font-size:1.65rem}
  .container{padding:0 1rem}
}

/* ====== MOTION — CSS scroll-reveal & micro-interactions ====== */
@keyframes fadeUp{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes shimmer{
  0%{background-position:-100% 0}
  100%{background-position:200% 0}
}

@supports (animation-timeline: view()){
  .card,.faq-item,.stat,.section-head,.two-col > *,.hero-content,.hero-form{
    animation:fadeUp linear both;
    animation-timeline:view();
    animation-range:entry 0% cover 30%;
  }
}

/* Magnetic button hover */
.btn{
  position:relative;
  overflow:hidden;
  transform:translateZ(0);
}
.btn::after{
  content:'';
  position:absolute;
  top:50%;left:50%;
  width:0;height:0;
  border-radius:50%;
  background:rgba(255,255,255,.15);
  transform:translate(-50%,-50%);
  transition:width .5s ease, height .5s ease;
  pointer-events:none;
}
.btn:hover::after{width:300px;height:300px}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}

/* Stat numbers count-up effect via gradient text */
.stat .num{
  background:linear-gradient(135deg,var(--brand-primary) 0%,#ff5d57 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* Hero gradient shimmer accent */
.hero::after{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 80% 50%,rgba(226,33,28,.15) 0%,transparent 50%);
  pointer-events:none;
  z-index:1;
}

/* ====== MOBILE & FLUID TYPOGRAPHY ====== */
@media(max-width:48em){
  nav ul{gap:1rem;font-size:.85rem}
  .nav{flex-direction:column;text-align:center}
  .cta-phone{width:100%;text-align:center;justify-content:center}
  h1{font-size:clamp(1.75rem,7vw,2.25rem)}
  h2{font-size:clamp(1.5rem,5.5vw,1.85rem)}
  h3{font-size:clamp(1.1rem,4vw,1.25rem)}
  .container{padding:0 1rem}
  .hero{padding:2.5rem 1rem;min-height:auto}
  .hero-content h1{font-size:clamp(2rem,7vw,2.5rem)}
  .btn{padding:1rem 1.25rem;font-size:.95rem;min-height:48px}
  .cta-phone{min-height:44px}
  .card{padding:1.5rem 1.25rem}
  .card .icon-tile{width:60px;height:60px}
  .card .icon-tile svg{width:36px;height:36px}
  section{padding:2.5rem 0}
  .stat .num{font-size:2rem}
  .form-row input,.form-row select,.form-row textarea{font-size:16px}
}

/* Touch target enforcement */
@media(hover:none) and (pointer:coarse){
  a,button,.btn,.cta-phone,.card-link,.city-tile{
    min-height:44px;
    display:inline-flex;
    align-items:center;
  }
}

/* ====== PERFORMANCE ====== */
img,svg{content-visibility:auto}
.card{contain:layout style}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}