/* GraceNest Blocks — base styles only.
   All colours/sizes below are DEFAULTS. Elementor style controls use a
   higher-specificity wrapper selector, so every value here is overridable
   from the editor. Deliberately no !important on controllable properties. */
:root{
  --gnb-forest:#3F5A47; --gnb-forest-deep:#33493A; --gnb-gold:#C2A15A;
  --gnb-gold-soft:#CBB07A; --gnb-cream:#F7F3EA; --gnb-line:#E4DECF;
  --gnb-ink:#3D4A3F; --gnb-ink-soft:#6B7267;
}
.gnb{ --gnb-accent:var(--gnb-gold); font-family:'Nunito Sans',sans-serif; }
.gnb *{ box-sizing:border-box; min-width:0; }
.gnb h2,.gnb h3{ font-family:'Cormorant Garamond',serif; font-weight:500; color:var(--gnb-forest); margin:0; line-height:1.1; }
.gnb p{ margin:0; color:var(--gnb-ink-soft); line-height:1.6; }
.gnb-center{ text-align:center; }

.gnb-btn{ display:inline-flex; align-items:center; justify-content:center; padding:15px 30px;
  font-size:11.5px; letter-spacing:.13em; text-transform:uppercase; font-weight:700;
  border-radius:30px; text-decoration:none; transition:all .2s ease; }
.gnb-btn--solid{ background:var(--gnb-forest); color:#fff; }
.gnb-btn--solid:hover{ background:var(--gnb-forest-deep); color:#fff; }

.gnb-eyebrow{ font-size:11.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--gnb-accent);
  font-weight:700; display:inline-flex; align-items:center; gap:14px; }
.gnb-eyebrow--both::before,.gnb-eyebrow--both::after{ content:""; width:30px; height:1.5px; background:var(--gnb-accent); }
.gnb-accent{ stroke:var(--gnb-accent); }
.gnb-section-head{ max-width:640px; margin:0 auto 50px; text-align:center; }
.gnb-section-head .gnb-heading{ font-size:clamp(30px,3.4vw,38px); margin-top:16px; }

/* ---------------- service grid ---------------- */
.gnb-service-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:16px; }
.gnb-service-card{ background:#fff; border:1px solid var(--gnb-line); border-radius:3px;
  padding:30px 16px 24px; text-align:center; display:flex; flex-direction:column; align-items:center;
  text-decoration:none; transition-property:transform,box-shadow,background-color,border-color;
  transition-duration:.25s; transition-timing-function:ease; }
.gnb-service-icon{ width:34px; height:34px; color:var(--gnb-forest); margin-bottom:18px;
  display:inline-flex; align-items:center; justify-content:center; transition:color .25s ease; }
.gnb-service-icon svg{ width:100%; height:100%; }
.gnb-service-icon i{ font-size:30px; line-height:1; }
.gnb-service-icon img{ width:100%; height:100%; object-fit:contain; }
.gnb-service-card .gnb-title{ font-size:17px; font-weight:600; margin-bottom:10px; line-height:1.2; transition:color .25s ease; }
.gnb-service-card .gnb-body{ font-size:12px; line-height:1.5; flex-grow:1; margin-bottom:16px; }
.gnb-service-arrow{ color:var(--gnb-accent); width:20px; height:20px; display:inline-flex;
  align-items:center; justify-content:center; transition:transform .2s ease,color .2s ease; }
.gnb-service-arrow svg{ width:100%; height:100%; }
.gnb-service-section .gnb-center{ margin-top:44px; }

/* ---------------- value pillars ---------------- */
.gnb-pillars{ display:grid; grid-template-columns:repeat(4,1fr); }
.gnb-pillar{ padding:6px 26px; text-align:center; position:relative; }
.gnb-pillars--divided .gnb-pillar + .gnb-pillar::before{ content:""; position:absolute; left:0;
  top:8%; height:84%; width:1px; background:var(--gnb-line); }
.gnb-pillar-icon{ width:38px; height:38px; margin:0 auto 16px; color:var(--gnb-forest);
  display:flex; align-items:center; justify-content:center; transition:color .25s ease; }
.gnb-pillar-icon svg{ width:100%; height:100%; }
.gnb-pillar-icon i{ font-size:34px; line-height:1; }
.gnb-pillar-icon img{ width:100%; height:100%; object-fit:contain; }
.gnb-pillar .gnb-title{ font-family:'Nunito Sans',sans-serif; font-size:12px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase; color:var(--gnb-forest); margin-bottom:9px; transition:color .25s ease; }
.gnb-pillar .gnb-body{ font-size:13px; line-height:1.5; max-width:180px; margin:0 auto; }

/* Responsive fallbacks only apply when the editor has not set a value.
   Column counts are driven by the widgets' responsive controls, so they are
   intentionally NOT forced here. Dividers are hidden where wrapping occurs. */
@media (max-width:1024px){
  .gnb-pillars--divided .gnb-pillar:nth-child(odd)::before{ display:none; }
}
@media (max-width:600px){
  .gnb-pillars--divided .gnb-pillar::before{ display:none; }
}
