:root{--ink:#061a2b;--blue:#078ff0;--blue2:#0757c9;--paper:#f7fbff;--muted:#607184;--line:#dce9f3}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);background:white;line-height:1.55}header{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,24px);position:sticky;top:0;background:rgba(255,255,255,.93);backdrop-filter:blur(12px);z-index:10;border-bottom:1px solid #edf3f8}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:900;letter-spacing:.12em}.brand img{width:42px;height:42px;object-fit:cover;object-position:50% 8%;border-radius:10px}nav{display:flex;gap:26px}nav a{text-decoration:none;color:#33485a;font-size:14px;font-weight:700}.hero{min-height:690px;display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center;padding:70px max(7vw,30px);background:radial-gradient(circle at 85% 30%,#dff3ff 0,transparent 31%),linear-gradient(135deg,#fff 55%,#f4faff)}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.18em;color:var(--blue2);margin:0 0 14px}.hero h1,.section h2,.showcase h2,.projects h2,.launch h2{font-size:clamp(38px,5.2vw,72px);line-height:1.02;letter-spacing:-.045em;margin:0}.hero h1 span,.showcase h2 span{color:var(--blue)}.lede{font-size:19px;max-width:720px;color:#52677a;margin:28px 0}.actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-block;padding:13px 20px;border:1px solid #bfd3e3;border-radius:10px;text-decoration:none;color:var(--ink);font-weight:800}.button.primary{background:var(--ink);color:white;border-color:var(--ink)}.pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.pills span{background:#eef7fd;border:1px solid #d6e9f7;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:800}.hero-art{text-align:center}.hero-art>img{width:min(100%,520px);filter:drop-shadow(0 28px 35px rgba(0,50,90,.15))}.launch-card{margin:-8px auto 0;background:var(--ink);color:white;border-radius:14px;padding:16px 20px;max-width:330px;display:flex;justify-content:space-between;gap:18px;text-align:left}.launch-card span{font-size:13px;color:#b9ddf6}.strip{background:var(--ink);color:white;text-align:center;padding:16px;letter-spacing:.25em}.strip i{color:var(--blue);font-style:normal;margin:0 20px}.section,.projects{padding:100px max(7vw,30px)}.section>h2,.projects>h2{font-size:clamp(34px,4vw,56px);max-width:850px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:50px}.steps article,.cards article,.project-grid article{border:1px solid var(--line);border-radius:18px;padding:26px;background:white}.steps em{font-style:normal;color:var(--blue);font-weight:900}.steps h3,.cards h3,.project-grid h3{font-size:22px;margin:12px 0 8px}.steps p,.cards p,.project-grid p,.actual p,.launch p{color:var(--muted)}.showcase{margin:0 max(4vw,18px);border-radius:30px;background:var(--ink);color:white;padding:80px max(4vw,30px);display:grid;grid-template-columns:1.05fr .95fr;gap:55px;align-items:center}.showcase h2{font-size:clamp(38px,4.5vw,64px)}.showcase p{color:#bcd0df;max-width:650px}.flow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:30px}.flow span{border:1px solid #31516b;padding:8px 12px;border-radius:8px;font-size:12px;font-weight:900}.flow b{color:var(--blue)}.screen-placeholder{min-height:330px;border:1px solid #31516b;border-radius:18px;background:linear-gradient(145deg,#0a253a,#06131f);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.screen-placeholder small{color:var(--blue);font-weight:900;letter-spacing:.12em}.screen-placeholder strong{font-size:34px;margin-top:10px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:45px}.cards article>span{display:inline-flex;min-width:48px;height:48px;padding:0 10px;align-items:center;justify-content:center;background:#eaf6ff;color:var(--blue2);border-radius:12px;font-weight:900}.projects{background:#f4f9fd}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}.project-grid article b{font-size:11px;letter-spacing:.15em;color:var(--blue2)}.actual{display:grid;grid-template-columns:.7fr 1.3fr;gap:50px;align-items:center}.actual h2{font-size:48px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.gallery div{aspect-ratio:1.15;background:var(--ink);color:white;border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-weight:900;font-size:13px}.gallery small{color:#8fcfff;margin-top:6px}.launch{margin:0 max(4vw,18px) 50px;padding:55px max(5vw,30px);border-radius:30px;background:linear-gradient(120deg,#e9f7ff,#fff);display:grid;grid-template-columns:220px 1fr;gap:45px;align-items:center}.launch img{width:220px}.launch h2{font-size:clamp(38px,5vw,66px)}footer{background:#04131f;color:#a9bdcc;padding:28px max(5vw,24px);display:flex;justify-content:space-between;gap:20px;font-size:12px}footer b{color:white}@media(max-width:900px){nav{display:none}.hero,.showcase,.actual{grid-template-columns:1fr}.hero{padding-top:45px}.hero-art{order:-1}.hero-art>img{width:min(72vw,390px)}.steps,.cards{grid-template-columns:repeat(2,1fr)}.project-grid{grid-template-columns:1fr}.actual .gallery{grid-template-columns:1fr 1fr}.launch{grid-template-columns:130px 1fr}.launch img{width:130px}}@media(max-width:560px){header{height:64px}.hero{padding:35px 22px 60px;gap:25px}.hero h1{font-size:43px}.lede{font-size:17px}.strip i{margin:0 8px}.section,.projects{padding:72px 22px}.steps,.cards,.actual .gallery{grid-template-columns:1fr}.showcase{padding:58px 24px}.launch{grid-template-columns:1fr;text-align:center;padding:38px 24px}.launch img{margin:auto}.launch .eyebrow{margin-top:5px}footer{flex-direction:column;text-align:center}}

/* Real screenshots inside the ORIGINAL starter-size boxes. */
.screen-placeholder.screen-image{padding:14px;min-height:330px}
.screen-placeholder.screen-image img{display:block;width:100%;height:300px;object-fit:contain;border-radius:10px}
.gallery .gallery-shot{position:relative;overflow:hidden;padding:0}
.gallery .gallery-shot img{display:block;width:100%;height:100%;object-fit:cover}
.gallery .gallery-shot span{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;background:rgba(4,19,31,.82);color:white;font-weight:900;font-size:12px;letter-spacing:.03em}


/* =========================================================
   DALE REAL SCREENSHOT GALLERY
   Fixed thumbnail cards: source images can never overflow.
   ========================================================= */
.dale-shot-grid{
  display:grid;
  grid-template-columns:repeat(3, 180px);
  gap:14px;
  justify-content:center;
  align-items:start;
  width:100%;
  max-width:600px;
  margin:0 auto;
}

.dale-shot-card{
  width:180px;
  min-width:0;
  overflow:hidden;
  text-align:left;
}

.dale-shot-frame{
  width:180px;
  height:150px;
  overflow:hidden;
  border-radius:15px;
  background:#061a2b;
  border:1px solid #dce9f3;
}

.dale-shot-frame img{
  display:block !important;
  width:180px !important;
  height:150px !important;
  max-width:180px !important;
  max-height:150px !important;
  object-fit:cover !important;
  margin:0 !important;
}

.dale-shot-card strong{
  display:block;
  margin-top:9px;
  font-size:12px;
  line-height:1.25;
  color:#061a2b;
}

.dale-shot-card small{
  display:block;
  margin-top:4px;
  font-size:11px;
  line-height:1.35;
  color:#607184;
}

/* One Logic Builder screenshot only */
.featured-shot{
  margin:0;
  width:100%;
  max-width:520px;
  min-width:0;
  overflow:hidden;
  border:1px solid #31516b;
  border-radius:18px;
  background:#06131f;
}

.featured-shot img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:520px !important;
  max-height:300px !important;
  object-fit:contain !important;
}

.featured-shot figcaption{
  padding:10px 14px;
  color:white;
  font-size:13px;
}

.featured-shot figcaption small{
  color:#078ff0;
  font-weight:900;
  letter-spacing:.08em;
  margin-right:8px;
}

@media(max-width:900px){
  .dale-shot-grid{
    grid-template-columns:repeat(2, 180px);
    max-width:390px;
  }
}

@media(max-width:560px){
  .dale-shot-grid{
    grid-template-columns:180px;
    max-width:180px;
  }
}

/* Why DALE Is Different */
.why-dale{background:linear-gradient(180deg,#fff 0%,#f7fbff 100%)}
.why-intro{font-size:19px;max-width:820px;color:var(--muted);margin:22px 0 0}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:42px}
.why-grid article{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff}
.why-grid article>span{display:inline-flex;width:42px;height:42px;align-items:center;justify-content:center;border-radius:12px;background:#eaf6ff;color:var(--blue2);font-weight:900}
.why-grid h3{font-size:21px;margin:14px 0 8px}
.why-grid p{color:var(--muted);margin:0}
.why-close{margin-top:26px;border-radius:20px;background:var(--ink);color:white;padding:28px 30px}
.why-close>b,.why-close>span{display:block}
.why-close>b{font-size:24px}
.why-close>span{font-size:20px;color:#b9ddf6;margin-top:2px}
.why-flow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:22px}
.why-flow strong{font-size:11px;letter-spacing:.08em;border:1px solid #31516b;border-radius:8px;padding:7px 10px}
.why-flow i{font-style:normal;color:var(--blue);font-weight:900}
@media(max-width:900px){.why-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.why-grid{grid-template-columns:1fr}.why-close{padding:24px 20px}.why-flow{gap:7px}.why-flow strong{font-size:10px;padding:6px 8px}}