/* ============================================================
   edantra OS — HOME.CSS
   ============================================================ */

/* ─── HERO ─── */
.hero {
  padding-top: calc(var(--nav-h) + 40px);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid var(--border);
}
.hero-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--page-px) 48px;
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 48px;
  align-items: end;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 24px;
}
.hero-h1 {
  font-family: var(--display);
  font-size: clamp(44px, 7vw, 108px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 0.92;
  color: var(--fg);
  margin-bottom: 24px;
}
/* "turn attention" — medium weight, recedes so "revenue." pops */
.hero-h1-mid {
  font-weight: 400;
  color: rgba(26,26,26,0.45);
  letter-spacing: -0.03em;
}
.hero-h1 .serif-accent {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: var(--primary);
  display: block;
  line-height: 1.05;
}
.hero-sub {
  font-size: 17px;
  line-height: 1.75;
  color: rgba(26,26,26,0.62);
  max-width: 52ch;
  margin-bottom: 32px;
}
.hero-ctas {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* Hero visual */
.hero-visual {
  position: relative;
  height: 520px;
  align-self: stretch;
}
.hero-img {
  position: absolute;
  inset: 0;
  border-radius: var(--radius);
  overflow: hidden;
}
.hero-img img { width:100%; height:100%; object-fit:cover; }
.hero-img::after {
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(160deg,rgba(253,251,247,0.15) 0%,transparent 50%,rgba(253,251,247,0.2) 100%);
}
.hero-card {
  position: absolute;
  border-radius: 18px;
  padding: 16px 18px;
  width: 200px;
}
.hero-card--a { top: 24px; left: -24px; animation: float-a 6s ease-in-out infinite; }
.hero-card--b { top: 50%; right: -16px; animation: float-b 6s ease-in-out infinite; animation-delay:-2s; }
.hero-card--c { bottom: 24px; left: 16px; animation: float-a 6s ease-in-out infinite; animation-delay:-4s; }
@keyframes float-a {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-7px); }
}
@keyframes float-b {
  0%,100% { transform: translateY(-50%); }
  50%     { transform: translateY(calc(-50% - 7px)); }
}
.hero-card-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 6px;
}
.hero-card-label.p { color: var(--primary); }
.hero-card p { font-size: 13px; line-height: 1.55; color: var(--fg); }

/* ─── STATS ─── */
.stats-section {
  border-bottom: 1px solid var(--border);
  padding: 48px 0;
  background: var(--warm-bg);
}
.stats-grid {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--page-px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.stat-cell {
  padding: 36px 32px;
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.6);
  border-radius: 20px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.75);
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), box-shadow 0.3s;
}
.stat-cell:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.8);
}
.stat-idx {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 16px;
}
.stat-num {
  font-family: var(--display);
  font-size: clamp(40px, 4vw, 62px);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--fg);
  margin-bottom: 10px;
}
.stat-label { font-size: 14px; line-height: 1.55; color: var(--mid); max-width: 22ch; }

/* ─── PILLARS ─── */
.pillars-section { padding: 100px 0; border-bottom: 1px solid var(--border); }
.pillars-header {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--page-px);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}
.pillars-h2 {
  font-family: var(--display);
  font-size: clamp(40px, 5vw, 80px);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 0.94;
}
.pillars-h2 .t-serif { color: var(--primary); display: block; }
.pillars-intro { font-size: 17px; line-height: 1.7; color: rgba(26,26,26,0.62); max-width: 42ch; }
.pillars-grid {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--page-px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.pillar-card {
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius);
  padding: 26px 24px 30px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.7);
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1),
              box-shadow 0.3s cubic-bezier(0.16,1,0.3,1),
              border-color 0.25s;
}
.pillar-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 24px 56px rgba(0,0,0,0.10), inset 0 1px 0 rgba(255,255,255,0.8);
  border-color: rgba(208,90,50,0.25);
}
.pillar-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}
.pillar-code { font-size: 11px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--mid); }
.pillar-icon {
  width:38px; height:38px;
  border-radius:50%;
  background: rgba(26,26,26,0.05);
  display:flex; align-items:center; justify-content:center;
  transition: background 0.25s, color 0.25s;
  color: var(--fg);
}
.pillar-card:hover .pillar-icon { background: var(--primary); color: var(--bg); }
.pillar-icon svg { width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:1.8; }
.pillar-title { font-family:var(--display); font-size:21px; font-weight:500; letter-spacing:-0.02em; line-height:1; color:var(--fg); }
.pillar-subtitle { font-family:var(--serif); font-style:italic; font-size:19px; color:rgba(26,26,26,0.42); line-height:1.2; margin-bottom:12px; }
.pillar-desc { font-size:13.5px; line-height:1.65; color:var(--mid); margin-bottom:16px; }
.pillar-tags { display:flex; flex-wrap:wrap; gap:5px; }
.pillar-tag {
  font-size:10px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase;
  color:rgba(26,26,26,0.48); border:1px solid var(--border); border-radius:100px;
  padding: 3px 9px;
}

/* ─── TESTIMONIAL ─── */
.testimonial-section { padding:100px 0; border-bottom: 1px solid var(--border); }
.testimonial-grid {
  max-width:var(--max-w); margin:0 auto; padding:0 var(--page-px);
  display: grid; grid-template-columns: 1fr 1fr; gap:72px; align-items:center;
}
.testimonial-img { border-radius:var(--radius); overflow:hidden; aspect-ratio:4/5; }
.testimonial-img img { width:100%; height:100%; object-fit:cover; }
.testimonial-content {
  background: rgba(253,251,247,0.60);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: var(--radius);
  padding: 44px 48px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
}
.testimonial-spark { color:var(--primary); margin-bottom:20px; font-size:22px; }
.testimonial-quote {
  font-family:var(--display);
  font-size: clamp(20px, 2.2vw, 34px);
  font-weight:500; letter-spacing:-0.02em; line-height:1.22;
  color:var(--fg); margin-bottom:28px;
}
.testimonial-quote .t-serif { color:var(--primary); }
.testimonial-meta { display:flex; align-items:center; gap:14px; }
.testimonial-avatar { width:44px; height:44px; border-radius:50%; background:var(--secondary); flex-shrink:0; }
.testimonial-name { font-weight:600; font-size:15px; color:var(--fg); }
.testimonial-role { font-size:13px; color:var(--mid); }

/* ─── CASES PREVIEW ─── */
.cases-preview-section { padding:100px 0; border-bottom:1px solid var(--border); }
.cases-preview-header {
  max-width:var(--max-w); margin:0 auto; padding:0 var(--page-px);
  display:flex; align-items:flex-end; justify-content:space-between; gap:24px;
  flex-wrap:wrap; margin-bottom:44px;
}
.cases-preview-h2 {
  font-family:var(--display);
  font-size:clamp(32px, 3.5vw, 58px);
  font-weight:500; letter-spacing:-0.03em; line-height:0.96;
}
.cases-preview-link {
  display:inline-flex; align-items:center; gap:6px;
  font-size:14px; font-weight:500; color:var(--fg);
  transition: color 0.2s;
}
.cases-preview-link:hover { color:var(--primary); }
.cases-preview-grid {
  max-width:var(--max-w); margin:0 auto; padding:0 var(--page-px);
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
}
.case-preview-card {
  border-radius:var(--radius); padding:40px 44px;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1);
}
.case-preview-card:hover { transform:translateY(-3px); }
.case-preview-card--dark { background:var(--fg); }
.case-preview-card--warm { background:var(--secondary); }
.case-sector { font-size:11px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; margin-bottom:24px; }
.case-preview-card--dark .case-sector { color:rgba(253,251,247,0.4); }
.case-preview-card--warm .case-sector { color:var(--mid); }
.case-metric {
  font-family:var(--display);
  font-size:clamp(52px, 5.5vw, 84px);
  font-weight:500; letter-spacing:-0.04em; line-height:1; margin-bottom:6px;
}
.case-preview-card--dark .case-metric { color:var(--primary); }
.case-preview-card--warm .case-metric { color:var(--fg); }
.case-metric-label { font-size:14px; margin-bottom:24px; }
.case-preview-card--dark .case-metric-label { color:rgba(253,251,247,0.45); }
.case-preview-card--warm .case-metric-label { color:var(--mid); }
.case-title {
  font-family:var(--display);
  font-size:clamp(18px, 1.8vw, 26px);
  font-weight:500; letter-spacing:-0.02em; line-height:1.2; margin-bottom:10px;
}
.case-preview-card--dark .case-title { color:var(--bg); }
.case-preview-card--warm .case-title { color:var(--fg); }
.case-body { font-size:15px; line-height:1.65; }
.case-preview-card--dark .case-body { color:rgba(253,251,247,0.58); }
.case-preview-card--warm .case-body { color:rgba(26,26,26,0.6); }

/* ─── HOME FORM ─── */
.home-form-section {
  padding:100px 0;
  background:var(--warm-bg);
}
.home-form-inner {
  max-width:var(--max-w); margin:0 auto; padding:0 var(--page-px);
  display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start;
}
.home-form-left h2 {
  font-family:var(--display);
  font-size:clamp(36px, 4vw, 68px);
  font-weight:500; letter-spacing:-0.03em; line-height:0.94;
  margin:14px 0 18px;
}
.home-form-left h2 .t-serif { color:var(--primary); }
.home-form-left p { font-size:17px; line-height:1.7; color:rgba(26,26,26,0.62); margin-bottom:28px; }
.home-form-promises { display:flex; flex-direction:column; gap:10px; }
.promise-item { display:flex; align-items:center; gap:10px; font-size:14px; color:rgba(26,26,26,0.72); }
.promise-check {
  width:20px; height:20px; border-radius:50%;
  background:var(--accent); display:flex; align-items:center; justify-content:center;
  flex-shrink:0; font-size:11px; color:var(--bg); font-weight:700;
}
.home-form-right {
  background: rgba(253,251,247,0.65);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: var(--radius);
  padding: 40px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.07), inset 0 1px 0 rgba(255,255,255,0.8);
}
.form-field { margin-bottom:16px; }
.form-label {
  display:block; font-size:11px; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase;
  color:var(--mid); margin-bottom:7px;
}
.form-input,.form-textarea,.form-select {
  width:100%; background:var(--bg);
  border:1.5px solid var(--border); border-radius:12px;
  padding:12px 15px;
  font-family:var(--sans); font-size:15px; color:var(--fg);
  outline:none; transition:border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}
.form-input:focus,.form-textarea:focus,.form-select:focus {
  border-color:var(--primary);
  box-shadow: 0 0 0 3px rgba(208,90,50,0.12);
}
.form-textarea { resize:none; min-height:96px; }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.form-submit {
  width:100%; background:var(--fg); color:var(--bg);
  border:none; border-radius:100px; padding:15px 28px;
  font-family:var(--sans); font-size:15px; font-weight:500;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
  transition:background 0.25s; margin-top:6px;
}
.form-submit:hover { background:var(--primary); }
.form-privacy { font-size:12px; color:var(--mid); text-align:center; margin-top:10px; line-height:1.6; }
.form-success { text-align:center; padding:28px 0; }
.form-success-mark {
  width:52px; height:52px; border-radius:50%; background:var(--primary);
  color:var(--bg); font-size:20px; display:flex; align-items:center; justify-content:center;
  margin:0 auto 18px;
}
.form-success h3 {
  font-family:var(--display); font-size:30px; font-weight:500;
  letter-spacing:-0.02em; margin-bottom:8px;
}
.form-success p { font-size:15px; color:var(--mid); max-width:34ch; margin:0 auto; }

/* ─── RESPONSIVE ─── */
@media(max-width:1100px) {
  .hero-inner { grid-template-columns:1fr; }
  .hero-visual { display:none; }
  .pillars-grid { grid-template-columns:repeat(2,1fr); }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px) {
  .testimonial-grid { grid-template-columns:1fr; }
  .testimonial-img { display:none; }
  .cases-preview-grid { grid-template-columns:1fr; }
  .home-form-inner { grid-template-columns:1fr; }
  .form-grid-2 { grid-template-columns:1fr; }
  .pillars-grid { grid-template-columns:1fr; }
  .stat-cell { padding:28px 20px; }
  .case-preview-card { padding:28px 24px; }
  .pillars-header { flex-direction:column; align-items:flex-start; }
}