/* ==========================================================================
   ANDAMIO — Hoja de estilos principal
   Identidad: "planos técnicos" (blueprint) + estructura de andamiaje.
   Bootstrap 5.3 resuelve el layout base; este archivo aporta la identidad.
   ========================================================================== */

:root{
  /* Paleta */
  --paper:        #FAFAF8;
  --mist:         #EAF0F3;
  --blueprint:    #1C3557;
  --blueprint-dk: #12253D;
  --ink:          #182229;
  --steel:        #5B7185;
  --steel-light:  #93A5B3;
  --accent:       #F2A81D;
  --accent-dk:    #D6900E;
  --uwm-gold:     #C9A15F;
  --line:         #D7DEE2;
  --line-strong:  #B7C3CB;

  /* Tipografía */
  --font-display: 'Archivo', sans-serif;
  --font-body:    'IBM Plex Sans', sans-serif;

  /* Layout */
  --container-max: 1180px;
  --gap: 1.5rem;
}

/* ---------- Base ---------- */
html{ scroll-behavior:smooth; }
body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--paper);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4,.display-font{
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--blueprint-dk);
  line-height: 1.15;
}
h1{ font-weight:800; }
p{ color: var(--steel); max-width: 62ch; }
a{ color: var(--blueprint); text-decoration: none; }
a:hover{ color: var(--accent-dk); }
::selection{ background: var(--accent); color: var(--blueprint-dk); }

:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.container-narrow{ max-width: var(--container-max); margin-inline:auto; padding-inline: 1.25rem; }

section{ position:relative; }
.section-pad{ padding-block: clamp(3.5rem, 6vw, 6.5rem); }
.section-pad-sm{ padding-block: clamp(2.5rem, 4vw, 4rem); }

.bg-mist{ background: var(--mist); }
.bg-blueprint{ background: var(--blueprint); color: #EAF0F3; }
.bg-blueprint h1, .bg-blueprint h2, .bg-blueprint h3{ color:#fff; }
.bg-blueprint p{ color: #C6D4DE; }
.bg-blueprint a:not(.btn){ color:#fff; }

.text-steel{ color: var(--steel); }
.text-blueprint{ color: var(--blueprint); }

.section-head{ max-width: 620px; margin-bottom: 2.75rem; }
.section-head h2{ font-size: clamp(1.75rem, 3vw, 2.5rem); margin-bottom: .75rem; }
.section-head p{ font-size: 1.05rem; }
.section-head.center{ margin-inline:auto; text-align:center; }
.section-head.center p{ margin-inline:auto; }

.kicker{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family: var(--font-display);
  font-weight:600; font-size:.85rem;
  color: var(--blueprint);
  margin-bottom: .85rem;
}
.kicker::before{
  content:''; width:22px; height:2px; background: var(--accent); display:inline-block;
}
.bg-blueprint .kicker{ color:#fff; }

/* ---------- Blueprint grid texture ---------- */
.grid-texture{ position:relative; }
.grid-texture::before{
  content:'';
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity:.55;
  pointer-events:none;
}
.bg-blueprint.grid-texture::before{
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  opacity:1;
}
.grid-texture > .container-narrow{ position:relative; z-index:1; }

/* ---------- Buttons ---------- */
.btn{
  font-family: var(--font-display);
  font-weight:600;
  border-radius: 3px;
  padding: .72rem 1.5rem;
  transition: transform .15s ease, background-color .15s ease, color .15s ease, border-color .15s ease;
  border: 1.5px solid transparent;
}
.btn:active{ transform: translateY(1px); }

.btn-blueprint{ background: var(--blueprint); color:#fff; border-color: var(--blueprint); }
.btn-blueprint:hover{ background: var(--blueprint-dk); color:#fff; border-color:var(--blueprint-dk); }

.btn-outline-blueprint{ background:transparent; color:var(--blueprint); border-color: var(--blueprint); }
.btn-outline-blueprint:hover{ background: var(--blueprint); color:#fff; }

.btn-outline-light{ background:transparent; color:#fff; border-color: rgba(255,255,255,.55); }
.btn-outline-light:hover{ background:#fff; color:var(--blueprint-dk); border-color:#fff; }

.btn-accent{ background: var(--accent); color: var(--blueprint-dk); border-color: var(--accent); }
.btn-accent:hover{ background: var(--accent-dk); color:#fff; border-color: var(--accent-dk); }

.btn-uwm{ background: var(--uwm-gold); color:#2B2210; border-color: var(--uwm-gold); }
.btn-uwm:hover{ background:#B78E4E; color:#fff; }

.btn-sm-pill{ border-radius: 999px; padding:.45rem 1.1rem; font-size:.85rem; }

/* ---------- Navbar ---------- */
.site-navbar{
  background: rgba(250,250,248,.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid transparent;
  transition: border-color .25s ease, box-shadow .25s ease;
  padding-block: .9rem;
}
.site-navbar.is-scrolled{
  border-bottom-color: var(--line);
  box-shadow: 0 6px 18px -14px rgba(18,37,61,.35);
}
.brand-mark{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family: var(--font-display); font-weight:800; font-size:1.25rem;
  color: var(--blueprint-dk);
}
.brand-mark .brand-glyph{
  width:30px; height:30px; flex:none;
}
.navbar-nav .nav-link{
  font-family: var(--font-display);
  font-weight:600; font-size:.95rem;
  color: var(--ink);
  padding:.5rem 1rem !important;
  position:relative;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover{ color: var(--blueprint); }
.navbar-nav .nav-link.active::after{
  content:''; position:absolute; left:1rem; right:1rem; bottom:.15rem; height:2px; background:var(--accent);
}
.nav-admin-link{
  font-size:.85rem; color: var(--steel); border:1px solid var(--line-strong); border-radius:3px;
  padding:.4rem .85rem !important; margin-left:.25rem;
}
.nav-admin-link:hover{ color:var(--blueprint); border-color:var(--blueprint); }

/* ---------- Hero ---------- */
.hero{
  padding-block: clamp(3rem, 8vw, 6rem) clamp(3rem, 6vw, 5rem);
  overflow:hidden;
}
.hero h1{ font-size: clamp(2.3rem, 4.4vw, 3.5rem); }
.hero .lead{ font-size:1.15rem; max-width: 46ch; }
.hero-figure{ position:relative; }
.hero-figure svg{ width:100%; height:auto; }
.blueprint-diagram .bp-line{ stroke: var(--steel-light); stroke-width:2; fill:none; stroke-linecap:round; }
.blueprint-diagram .bp-node{ fill: var(--accent); }
.blueprint-diagram .bp-node.is-blueprint{ fill: var(--blueprint); }

.hero-stats-row{
  display:flex; flex-wrap:wrap; gap: 2.25rem 2.75rem;
  margin-top: 2.75rem; padding-top: 1.75rem;
  border-top:1px solid var(--line);
}
.hero-stats-row .stat-num{
  font-family: var(--font-display); font-weight:800; font-size:1.6rem; color:var(--blueprint-dk); display:block;
}
.hero-stats-row .stat-label{ font-size:.85rem; color:var(--steel); }

.page-hero{
  padding-block: clamp(3rem, 6vw, 4.5rem) clamp(2.5rem, 4vw, 3.5rem);
}
.page-hero .kicker{ margin-bottom:1rem; }
.page-hero h1{ font-size: clamp(2rem, 3.6vw, 2.9rem); max-width: 18ch; }
.breadcrumb-trail{
  font-size:.85rem; color: var(--steel-light); margin-bottom:1.25rem;
  font-family: var(--font-display); font-weight:600;
}
.breadcrumb-trail a{ color: var(--steel); }

/* ---------- Corner-bracket card system ---------- */
.bkt{
  position:relative;
  background: var(--paper);
  padding: 2rem 1.85rem;
  border:1px solid var(--line);
}
.bkt::before,.bkt::after{
  content:''; position:absolute; width:16px; height:16px; border-color:var(--blueprint); border-style:solid; border-width:0;
  transition: border-color .2s ease;
}
.bkt::before{ top:-1px; left:-1px; border-top-width:2px; border-left-width:2px; }
.bkt::after{ bottom:-1px; right:-1px; border-bottom-width:2px; border-right-width:2px; }
.bkt:hover::before,.bkt:hover::after{ border-color: var(--accent); }
.bkt-tight{ padding: 1.5rem 1.35rem; }
.bg-blueprint .bkt{ background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.18); }
.bg-blueprint .bkt::before,.bg-blueprint .bkt::after{ border-color:#fff; }

.bkt-icon{
  width:46px; height:46px; display:flex; align-items:center; justify-content:center;
  background: var(--mist); color: var(--blueprint); margin-bottom:1.1rem; flex:none;
}
.bkt-icon svg{ width:22px; height:22px; }
.bkt h3{ font-size:1.15rem; margin-bottom:.6rem; }
.bkt p{ font-size:.95rem; margin-bottom:0; }

.card-grid{ display:grid; gap: 1.5rem; }
.grid-2{ grid-template-columns: repeat(2,1fr); }
.grid-3{ grid-template-columns: repeat(3,1fr); }
.grid-4{ grid-template-columns: repeat(4,1fr); }

/* ---------- Process steps ---------- */
.process-row{ display:grid; grid-template-columns: repeat(4,1fr); gap:1.5rem; counter-reset: step; }
.process-step{ position:relative; padding-top: 2.5rem; }
.process-step::before{
  counter-increment: step; content: counter(step, decimal-leading-zero);
  font-family: var(--font-display); font-weight:800; font-size:1.6rem;
  color: var(--accent);
  display:block; margin-bottom:.75rem;
}
.process-step::after{
  content:''; position:absolute; top:0; left:0; width:34px; height:1px; background: var(--line-strong);
}
.process-step h3{ font-size:1.05rem; margin-bottom:.5rem; }
.process-step p{ font-size:.92rem; }

/* ---------- Testimonials ---------- */
.testimonial{
  padding: 2rem;
  border-left: 3px solid var(--accent);
  background: var(--mist);
}
.testimonial blockquote{ font-family: var(--font-display); font-size:1.08rem; font-weight:600; color: var(--blueprint-dk); margin-bottom:1.25rem; }
.testimonial cite{ font-style:normal; font-size:.88rem; color: var(--steel); display:block; }
.testimonial cite strong{ color: var(--ink); display:block; font-size:.95rem; }

/* ---------- Portfolio ---------- */
.filter-bar{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:2.25rem; }
.filter-chip{
  font-family: var(--font-display); font-weight:600; font-size:.85rem;
  padding:.45rem 1.1rem; border:1px solid var(--line-strong); background:transparent; color: var(--steel);
  cursor:pointer; transition: all .15s ease;
}
.filter-chip:hover{ border-color: var(--blueprint); color: var(--blueprint); }
.filter-chip.active{ background: var(--blueprint); border-color: var(--blueprint); color:#fff; }
.filter-chip.is-static{ cursor:default; }
.filter-chip.is-static:hover{ border-color: var(--line-strong); color: var(--steel); }
.filter-chip.is-static.active:hover{ border-color: var(--blueprint); color:#fff; }

.project-card{ overflow:hidden; }
.project-card figure{ margin:0 0 1.1rem; overflow:hidden; aspect-ratio: 4/3; background:var(--mist); }
.project-card img{ width:100%; height:100%; object-fit:cover; transition: transform .4s ease; display:block; }
.project-card:hover img{ transform: scale(1.045); }
.project-cat{ font-family:var(--font-display); font-weight:600; font-size:.78rem; color: var(--accent-dk); margin-bottom:.4rem; display:block; }
.project-card h3{ font-size:1.1rem; margin-bottom:.5rem; }
.tag-row{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:1rem; }
.tag{ font-size:.72rem; font-weight:600; color: var(--blueprint); background: var(--mist); padding:.25rem .6rem; border:1px solid var(--line); }
.portfolio-item{ display:none; }
.portfolio-item.is-visible{ display:block; }

/* ---------- Blog ---------- */
.article-card figure{ aspect-ratio: 16/10; overflow:hidden; margin-bottom:1.1rem; background:var(--mist); }
.article-card img{ width:100%; height:100%; object-fit:cover; }
.article-meta{ font-size:.8rem; color: var(--steel); display:flex; gap:.9rem; flex-wrap:wrap; margin-bottom:.6rem; }
.article-meta span{ display:inline-flex; align-items:center; gap:.35rem; }
.article-card h3{ font-size:1.2rem; margin-bottom:.6rem; }
.article-card h3 a{ color: var(--blueprint-dk); }
.article-card h3 a:hover{ color: var(--accent-dk); }
.read-more{ font-family: var(--font-display); font-weight:600; font-size:.9rem; display:inline-flex; align-items:center; gap:.4rem; }
.read-more svg{ width:14px; height:14px; transition: transform .15s ease; }
.read-more:hover svg{ transform: translateX(3px); }

/* ---------- Contact ---------- */
.info-list{ list-style:none; padding:0; margin:0; }
.info-list li{ display:flex; gap:1rem; padding-block:1.1rem; border-bottom:1px solid var(--line); }
.info-list li:last-child{ border-bottom:none; }
.info-list .icon-box{
  width:38px; height:38px; flex:none; display:flex; align-items:center; justify-content:center;
  background: var(--mist); color: var(--blueprint);
}
.info-list .icon-box svg{ width:18px; height:18px; }
.info-list h4{ font-size:.95rem; margin-bottom:.2rem; color: var(--blueprint-dk); font-family:var(--font-display); }
.info-list p{ font-size:.9rem; margin:0; }

.form-control, .form-select{
  border-radius:2px; border:1px solid var(--line-strong); padding:.7rem .9rem; font-size:.95rem;
  background: var(--paper);
}
.form-control:focus, .form-select:focus{
  border-color: var(--blueprint); box-shadow: 0 0 0 3px rgba(28,53,87,.12);
}
.form-label{ font-family: var(--font-display); font-weight:600; font-size:.88rem; margin-bottom:.4rem; color: var(--ink); }
.invalid-feedback{ font-size:.8rem; }

.map-frame{
  aspect-ratio: 16/11; background: var(--blueprint);
  position:relative; overflow:hidden;
}

/* ---------- Commercial banner (Up Web Marketing) ---------- */
.uwm-banner{
  border:1.5px dashed var(--uwm-gold);
  background: linear-gradient(0deg, rgba(201,161,95,.07), rgba(201,161,95,.07)), var(--paper);
  padding: 1.75rem 2rem;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
}
.uwm-banner h3{ font-size:1.05rem; margin-bottom:.3rem; }
.uwm-banner p{ font-size:.9rem; margin-bottom:0; }
.uwm-tag{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.72rem; font-weight:600; color:#8A6A2F; text-transform:none;
  margin-bottom:.5rem;
}
.uwm-tag .dot{ width:6px; height:6px; border-radius:50%; background: var(--uwm-gold); }

.uwm-cta-section{
  padding-block: clamp(3rem, 5vw, 4.5rem);
  background: var(--blueprint);
  position:relative;
}
.uwm-cta-section .uwm-panel{
  border:1.5px solid var(--uwm-gold);
  padding: clamp(2rem, 4vw, 3rem);
  display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
}
.uwm-cta-section h2{ color:#fff; font-size: clamp(1.5rem,2.6vw,2.1rem); max-width: 22ch; }
.uwm-cta-section p{ color:#C6D4DE; }

/* ---------- Floating CTA ---------- */
.floating-cta{
  position:fixed; right:1.5rem; bottom:1.5rem; z-index:1040;
  font-family: var(--font-display); font-weight:600; font-size:.85rem;
  display:inline-flex; align-items:center; gap:.55rem;
  background: var(--blueprint-dk); color:#fff;
  padding:.75rem 1.1rem .75rem .85rem;
  border:1px solid var(--uwm-gold);
  box-shadow: 0 10px 24px -10px rgba(18,37,61,.5);
  transition: transform .2s ease, background-color .2s ease, padding .2s ease, max-width .25s ease;
  overflow:hidden; white-space:nowrap;
  text-decoration:none;
}
.floating-cta .fc-spark{ color: var(--uwm-gold); font-size:1rem; line-height:1; }
.floating-cta .fc-sub{
  display:inline-block; max-width:0; opacity:0; overflow:hidden;
  transition: max-width .25s ease, opacity .2s ease, margin .2s ease;
  color:#E9DCC0; font-weight:500;
}
.floating-cta:hover{ background: var(--blueprint); color:#fff; transform: translateY(-2px); }
.floating-cta:hover .fc-sub{ max-width:220px; opacity:1; margin-left:.15rem; }

/* ---------- Back to top ---------- */
.back-to-top{
  position:fixed; left:1.5rem; bottom:1.5rem; z-index:1039;
  width:42px; height:42px; display:flex; align-items:center; justify-content:center;
  background: var(--paper); border:1px solid var(--line-strong); color: var(--blueprint);
  opacity:0; visibility:hidden; transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.back-to-top.is-visible{ opacity:1; visibility:visible; transform:none; }
.back-to-top:hover{ border-color: var(--blueprint); background: var(--blueprint); color:#fff; }
.back-to-top svg{ width:16px; height:16px; }

/* ---------- Footer ---------- */
.site-footer{ background: var(--blueprint-dk); color:#B9C7D1; padding-block: 3.5rem 0; }
.site-footer h5{ color:#fff; font-family:var(--font-display); font-size:.95rem; margin-bottom:1.1rem; }
.site-footer a{ color:#B9C7D1; }
.site-footer a:hover{ color:#fff; }
.footer-links{ list-style:none; padding:0; margin:0; }
.footer-links li{ margin-bottom:.6rem; font-size:.92rem; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top: 2.75rem; padding-block: 1.5rem;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
  font-size:.82rem; color:#8CA0AD;
}
.social-row{ display:flex; gap:.7rem; }
.social-row a{
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.18);
}
.social-row a:hover{ border-color:#fff; }
.social-row svg{ width:15px; height:15px; }
.footer-uwm{
  border-top:1px solid rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.12);
  margin-top:2.75rem; padding-block:1.5rem;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
}
.footer-uwm p{ margin:0; color:#B9C7D1; font-size:.88rem; }
.footer-uwm strong{ color:#fff; }

/* ---------- Counters / reveal ---------- */
.reveal{ opacity:0; transform: translateY(18px); }
.reveal.is-inview{ opacity:1; transform:none; transition: opacity .6s ease, transform .6s ease; }

/* ---------- FAQ ---------- */
.faq-item{ border-bottom:1px solid var(--line); padding-block:1.25rem; }
.faq-q{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer;
  font-family: var(--font-display); font-weight:600; color: var(--blueprint-dk);
}
.faq-q .faq-plus{ flex:none; width:20px; height:20px; position:relative; }
.faq-q .faq-plus::before,.faq-q .faq-plus::after{
  content:''; position:absolute; background: var(--blueprint); transition: transform .2s ease;
}
.faq-q .faq-plus::before{ top:50%; left:0; right:0; height:2px; transform: translateY(-1px); }
.faq-q .faq-plus::after{ left:50%; top:0; bottom:0; width:2px; transform: translateX(-1px); }
.faq-item.open .faq-plus::after{ transform: translateX(-1px) rotate(90deg); opacity:0; }
.faq-a{ max-height:0; overflow:hidden; transition: max-height .3s ease; }
.faq-a p{ padding-top:.85rem; font-size:.95rem; }
.faq-item.open .faq-a{ max-height: 320px; }

/* ---------- Team ---------- */
.team-card figure{ aspect-ratio:1/1; overflow:hidden; margin-bottom:1rem; background:var(--mist); }
.team-card img{ width:100%; height:100%; object-fit:cover; }
.team-card h3{ font-size:1.05rem; margin-bottom:.15rem; }
.team-card .role{ font-size:.85rem; color: var(--accent-dk); font-weight:600; font-family: var(--font-display); }

/* ---------- Values / diff ---------- */
.value-item{ display:flex; gap:1.1rem; padding-block:1.4rem; border-top:1px solid var(--line); }
.value-item:last-child{ border-bottom:1px solid var(--line); }
.value-num{ font-family:var(--font-display); font-weight:800; color: var(--line-strong); font-size:1.3rem; flex:none; width:2.5ch; }
.value-item h3{ font-size:1.05rem; margin-bottom:.35rem; }
.value-item p{ font-size:.92rem; margin:0; }

/* ---------- Blog detail (article) ---------- */
.article-cover{ aspect-ratio: 21/9; overflow:hidden; margin-bottom: clamp(2rem,4vw,3rem); background:var(--mist); }
.article-cover img{ width:100%; height:100%; object-fit:cover; display:block; }

.article-body{ font-size:1.05rem; }
.article-body p{ color: var(--ink); max-width:68ch; margin-bottom:1.35rem; }
.article-body h2{ font-size:1.5rem; margin-top:2.5rem; margin-bottom:1rem; }
.article-body h3{ font-size:1.2rem; margin-top:2rem; margin-bottom:.85rem; }
.article-body ul, .article-body ol{ max-width:66ch; margin-bottom:1.5rem; padding-left:0; }
.article-body li{ margin-bottom:.65rem; color: var(--ink); }
.article-body ul{ list-style:none; }
.article-body ul li{ position:relative; padding-left:1.6rem; }
.article-body ul li::before{ content:''; position:absolute; left:0; top:.55em; width:8px; height:8px; background:var(--accent); }
.article-body ol{ counter-reset: alist; list-style:none; }
.article-body ol li{ position:relative; padding-left:2.4rem; min-height:1.6rem; }
.article-body ol li::before{
  counter-increment:alist; content:counter(alist);
  position:absolute; left:0; top:-.1rem;
  font-family:var(--font-display); font-weight:700; color:var(--blueprint); font-size:.8rem;
  width:1.6rem; height:1.6rem; border:1.5px solid var(--blueprint);
  display:flex; align-items:center; justify-content:center;
}

.article-highlight{
  border-left:3px solid var(--accent); background:var(--mist);
  padding: 1.5rem 1.75rem; margin: 2.25rem 0; max-width:66ch;
}
.article-highlight p{ font-family:var(--font-display); font-weight:600; color:var(--blueprint-dk); font-size:1.1rem; margin:0; max-width:none; }

.share-row{ display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.share-row .share-label{ font-family:var(--font-display); font-weight:600; font-size:.85rem; color:var(--steel); margin-right:.3rem; }
.share-btn{
  width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line-strong); color: var(--blueprint); background:transparent; cursor:pointer;
  transition: all .15s ease;
}
.share-btn svg{ width:17px; height:17px; }
.share-btn:hover{ border-color:var(--blueprint); background:var(--blueprint); color:#fff; }
.share-btn.is-copied{ border-color: var(--accent); color: var(--accent-dk); }

.author-box{ display:flex; gap:1.25rem; align-items:center; }
.author-box img{ width:64px; height:64px; border-radius:50%; object-fit:cover; flex:none; box-shadow:0 0 0 1px var(--line); }
.author-box h4{ font-family:var(--font-display); font-size:1rem; margin-bottom:.2rem; color:var(--blueprint-dk); }
.author-box p{ font-size:.9rem; margin:0; }

/* ---------- Utilities ---------- */
.mw-560{ max-width:560px; }
.mw-680{ max-width:680px; }
.hr-line{ border:none; border-top:1px solid var(--line); margin: 3rem 0; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 991.98px){
  .grid-3{ grid-template-columns: repeat(2,1fr); }
  .grid-4{ grid-template-columns: repeat(2,1fr); }
  .process-row{ grid-template-columns: repeat(2,1fr); row-gap:2.25rem; }
  .uwm-cta-section .uwm-panel{ flex-direction:column; align-items:flex-start; text-align:left; }
}
@media (max-width: 767.98px){
  body{ overflow-x:hidden; }
  .grid-2, .grid-3, .grid-4{ grid-template-columns: 1fr; }
  .process-row{ grid-template-columns: 1fr; }
  .uwm-banner{ flex-direction:column; align-items:flex-start; }
  .footer-uwm{ flex-direction:column; align-items:flex-start; }
  .floating-cta{ right:1rem; bottom:1rem; padding:.65rem .8rem; }
  .floating-cta .fc-sub{ display:none; }
  .back-to-top{ left:1rem; bottom:1rem; width:38px; height:38px; }
  .hero-stats-row{ gap:1.5rem 2rem; }
  .article-cover{ aspect-ratio:4/3; }
  .author-box{ flex-direction:column; text-align:center; }
}