/* GEODOMAS ROOFS — project readiness premium layer | 2026-07-23 */
.readiness-section{
  position:relative;
  overflow:hidden;
  padding:clamp(72px,8vw,112px) 0;
  background:
    radial-gradient(circle at 88% 8%,rgba(45,145,255,.13),transparent 34%),
    linear-gradient(145deg,#07111f 0%,#0b1d31 54%,#071522 100%);
  color:#f5f9ff;
}
.readiness-section::before{
  content:"";
  position:absolute;inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 88%);
}
.readiness-section .wrap{position:relative;z-index:1}
.readiness-section .head{max-width:860px;margin-bottom:clamp(30px,4vw,48px)}
.readiness-section .head::before{
  content:"PROJECT READINESS";
  display:inline-flex;
  margin-bottom:17px;
  padding:8px 12px;
  border:1px solid rgba(122,192,255,.32);
  border-radius:999px;
  background:rgba(18,105,184,.12);
  color:#83c5ff;
  font:700 11px/1.1 system-ui,sans-serif;
  letter-spacing:.16em;
}
.readiness-section .head h2{max-width:760px;color:#fff;font-size:clamp(34px,4.6vw,64px);line-height:1.02;letter-spacing:-.045em}
.readiness-section .head p{max-width:760px;margin-top:18px;color:#b8c8d9;font-size:clamp(16px,1.45vw,19px);line-height:1.7}
.readiness-section .process{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  counter-reset:readiness;
}
.readiness-section .process::before{
  content:"";
  position:absolute;left:7%;right:7%;top:34px;height:1px;
  background:linear-gradient(90deg,transparent,#3da5ff 12%,#3da5ff 88%,transparent);
  opacity:.42;
}
.readiness-section .process-card{
  position:relative;
  min-height:230px;
  padding:82px 24px 25px;
  border:1px solid rgba(153,199,239,.16);
  border-radius:22px;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  box-shadow:0 22px 54px rgba(0,0,0,.2);
  backdrop-filter:blur(12px);
  counter-increment:readiness;
}
.readiness-section .process-card::before{
  content:"0" counter(readiness);
  position:absolute;top:20px;left:22px;
  display:grid;place-items:center;
  width:42px;height:42px;
  border:1px solid rgba(124,197,255,.54);
  border-radius:50%;
  background:#0a2842;
  box-shadow:0 0 0 7px rgba(55,154,239,.08);
  color:#8dcaff;
  font:700 12px/1 system-ui,sans-serif;
  letter-spacing:.08em;
}
.readiness-section .process-card b{display:block;margin-bottom:12px;color:#fff;font-size:20px;line-height:1.18;letter-spacing:-.02em}
.readiness-section .process-card span{display:block;color:#b6c7d8;font-size:14px;line-height:1.65}
.readiness-section .process-card .roof-like{display:none!important}
.readiness-section .note{
  position:relative;
  margin:20px 0 28px;
  padding:20px 22px 20px 54px;
  border:1px solid rgba(121,190,248,.2);
  border-radius:16px;
  background:rgba(5,14,25,.56);
  color:#b9c9d9;
  font-size:13px;
  line-height:1.65;
}
.readiness-section .note::before{content:"i";position:absolute;left:21px;top:20px;display:grid;place-items:center;width:20px;height:20px;border:1px solid #70b9f5;border-radius:50%;color:#8ccaff;font:700 12px/1 serif}
.readiness-section .scenario-banner{margin-top:0}
.readiness-section .scenario-banner-frame{height:auto;max-height:none;border:1px solid rgba(145,196,238,.2);border-radius:24px;overflow:visible;box-shadow:0 28px 70px rgba(0,0,0,.32)}
.readiness-section .scenario-banner-frame img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
@media(max-width:980px){
  .readiness-section .process{grid-template-columns:repeat(2,minmax(0,1fr))}
  .readiness-section .process::before{display:none}
}
@media(max-width:620px){
  .readiness-section{padding:64px 0}
  .readiness-section .head h2{font-size:36px}
  .readiness-section .process{grid-template-columns:1fr}
  .readiness-section .process-card{min-height:0;padding:72px 21px 22px}
  .readiness-section .scenario-banner-frame{height:auto;max-height:none;border-radius:18px;overflow:visible}
}