/* Case study additional styles — builds on styles.css */

body.case{ --accent: oklch(0.78 0.17 30); }


.case-hero{
  max-width: 1200px;margin:0 auto;
  padding: 140px var(--gutter) 60px;
}
.crumbs{font-size:11px;color:var(--muted);margin-bottom:28px;display:flex;gap:10px;align-items:center}
.crumbs a:hover{color:var(--ink)}
.case-hero-head{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.case-accent-chip{
  display:inline-block;width:18px;height:18px;border-radius:50%;
  background:var(--accent);border:1px solid var(--rule);
}
.case-title{
  font-family:'Geist';font-weight:500;
  font-size: clamp(44px, 6vw, 92px);
  line-height:0.98;letter-spacing:-0.035em;margin:0 0 28px;max-width: 18ch;
}
.case-title em{
  font-style:italic;font-weight:500;color: color-mix(in oklab, var(--accent), #000 25%);
}
.case-lede{
  font-size: clamp(17px, 1.4vw, 22px);line-height:1.5;max-width: 64ch;
  margin: 0 0 48px;color:var(--ink);
}
.case-meta{
  display:grid;grid-template-columns: repeat(6, 1fr);gap:0;margin:0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.case-meta > div{
  padding:18px 16px;border-right:1px solid var(--rule-soft);
  display:flex;flex-direction:column;gap:6px;
}
.case-meta > div:last-child{border-right:none}
.case-meta dt{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin:0}
.case-meta dd{margin:0;font-size:13px;font-weight:500}
.case-meta-link{
  border-bottom:1px solid var(--rule-soft);
  padding-bottom:1px;
  transition: border-color .18s var(--ease), color .18s var(--ease);
}
.case-meta-link:hover{border-color:var(--ink);color:var(--ink)}

.case-live-cta{
  display:flex;align-items:center;gap:18px;
  flex-wrap:wrap;
  margin: 0 0 48px;
}
.case-live-btn{
  position:relative;
  padding-left: 22px;
}
.case-live-pulse{
  width:8px;height:8px;border-radius:50%;
  background: oklch(0.78 0.17 145);
  flex-shrink:0;
  box-shadow: 0 0 0 0 oklch(0.78 0.17 145 / 0.55);
  animation: caseLivePulse 1.8s var(--ease) infinite;
}
@keyframes caseLivePulse{
  0%{box-shadow:0 0 0 0 oklch(0.78 0.17 145 / 0.55)}
  70%{box-shadow:0 0 0 10px oklch(0.78 0.17 145 / 0)}
  100%{box-shadow:0 0 0 0 oklch(0.78 0.17 145 / 0)}
}
.case-live-arrow{
  display:inline-block;
  transition: transform .22s var(--ease);
}
.case-live-btn:hover .case-live-arrow{
  transform: translate(3px, -3px);
}
.case-live-meta{
  font-size:11px;color:var(--muted);
  letter-spacing:.06em;
}
@media (prefers-reduced-motion: reduce){
  .case-live-pulse{animation:none}
  .case-live-arrow{transition:none}
}

/* Shot placeholders */
.case-shot{
  max-width: var(--max);margin:0 auto;padding: 40px var(--gutter);
}
.case-shot.xl{padding: 60px var(--gutter)}
.shot{
  width:100%;aspect-ratio: 16 / 9;
  background:
    linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,0) 50%),
    repeating-linear-gradient(135deg, transparent 0 14px, rgba(0,0,0,.08) 14px 15px),
    color-mix(in oklab, var(--accent), #000 15%);
  border:1px solid var(--rule);
  border-radius: 6px;
  display:flex;align-items:flex-end;padding: 18px 22px;
  color:#fff;font-family:'Geist Mono';font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  position:relative;overflow:hidden;
}
.shot::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(40% 60% at 30% 30%, rgba(255,255,255,.25), transparent 60%),
    radial-gradient(50% 60% at 85% 80%, rgba(0,0,0,.18), transparent 70%);
  pointer-events:none;
}
.shot::after{ content: attr(data-label); position:relative; z-index:1; }
.shot.shot-tall{aspect-ratio: 4/5}
.shot.shot-real{
  background: #fff;
  padding: 0;
  overflow:hidden;
  align-items:stretch;
  color: var(--ink);
  border-color: var(--rule);
}
.shot.shot-real::before, .shot.shot-real::after{display:none}
.shot.shot-real img{
  width:100%;height:100%;object-fit:cover;object-position: top center;
  display:block;
}
.shot.shot-real.contain img{object-fit:contain;background:#fff;image-rendering:auto}
.shot-caption{
  max-width: var(--max);margin: -24px auto 0;padding: 0 var(--gutter) 24px;
  font-family:'Geist Mono';font-size:11px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;
  display:flex;justify-content:space-between;gap:16px;
}
.shot-caption span{white-space:nowrap}
@media(max-width:640px){
  .shot-caption{flex-direction:column;gap:6px;font-size:10px;letter-spacing:.04em}
  .shot-caption span{white-space:normal}
}
.case-two-col{
  max-width: var(--max);margin:0 auto;padding: 40px var(--gutter);
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
}

/* Outcome charts */
.case-charts{
  max-width: var(--max);margin: 24px auto 0;padding: 0 var(--gutter);
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
}
.chart-card{
  margin:0;padding:28px;border:1px solid var(--rule);border-radius:8px;
  background:var(--paper);display:flex;flex-direction:column;gap:18px;
}
.chart-eyebrow{
  font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin:0;
}
.chart-title{
  font-family:'Geist';font-weight:500;font-size:clamp(18px,1.6vw,22px);
  letter-spacing:-.02em;line-height:1.25;margin:0;max-width:24ch;
}
.chart-svg{width:100%;height:180px;display:block}
.chart-axis{
  display:flex;justify-content:space-between;
  font-size:10px;color:var(--muted);letter-spacing:.06em;
}
.chart-bar{
  display:flex;height:64px;border-radius:6px;overflow:hidden;border:1px solid var(--rule-soft);
}
.chart-bar .seg{
  display:flex;flex-direction:column;justify-content:center;gap:2px;padding:0 14px;
  color:var(--ink);
}
.chart-bar .seg-1{background:color-mix(in oklab, var(--accent), var(--paper) 40%)}
.chart-bar .seg-2{background:color-mix(in oklab, var(--accent), var(--paper) 65%)}
.chart-bar .seg-3{background:color-mix(in oklab, var(--accent), var(--paper) 82%)}
.chart-bar .seg-v{font-family:'Geist';font-weight:600;font-size:18px;letter-spacing:-.01em;line-height:1}
.chart-bar .seg-l{font-family:'Geist Mono';font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.chart-foot{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  padding-top:18px;border-top:1px solid var(--rule-soft);
}
.chart-stat{display:flex;flex-direction:column;gap:4px}
.chart-stat .cs-v{font-family:'Geist';font-weight:600;font-size:20px;letter-spacing:-.02em;line-height:1}
.chart-stat .cs-l{font-size:10px;color:var(--muted);letter-spacing:.06em}
@media(max-width:900px){
  .case-charts{grid-template-columns:1fr}
}
@media(max-width:640px){
  .chart-card{padding:22px}
  .chart-foot{grid-template-columns:1fr 1fr;gap:12px}
  .chart-bar{height:56px}
  .chart-bar .seg{padding:0 10px}
  .chart-bar .seg-v{font-size:16px}
}

/* Metrics strip */
.case-metrics{
  max-width:var(--max);margin:0 auto;
  padding: 40px var(--gutter);
  display:grid;grid-template-columns: repeat(4, 1fr);gap:0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.metric{
  padding: 28px 24px;border-right:1px solid var(--rule-soft);
  display:flex;flex-direction:column;gap:12px;
}
.metric:last-child{border-right:none}
.m-label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.m-value{
  font-family:'Geist';font-weight:500;font-size: clamp(40px, 4.2vw, 64px);
  letter-spacing:-0.035em;line-height:0.95;
  color: color-mix(in oklab, var(--accent), #000 30%);
}

/* Case sections */
.case-sec{
  max-width: 1000px;margin:0 auto;padding: 80px var(--gutter);
}
.case-sec-head{margin-bottom: 32px}
.case-sec-n{font-size:11px;color:var(--muted);display:block;margin-bottom:14px}
.case-sec-head h2{
  font-family:'Geist';font-weight:500;
  font-size: clamp(28px, 3vw, 42px);
  line-height:1.1;letter-spacing:-0.025em;margin:0;max-width:24ch;
}
.case-body{max-width: 70ch}
.case-p{font-size: 17px;line-height:1.6;margin:0 0 18px;color:var(--ink)}
.case-p em{font-style:italic;font-weight:500;color: color-mix(in oklab, var(--accent), #000 25%)}
.case-subsec{font-size:18px;font-weight:600;letter-spacing:-.01em;margin:24px 0 8px;color:var(--ink)}
.case-list{margin:14px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.case-list li{
  padding: 14px 16px;border:1px solid var(--rule-soft);border-radius:4px;
  font-size:15px;line-height:1.5;
}
.case-list strong{font-weight:600}

/* Decisions / Feature cards */
.decisions{
  list-style:none;margin:0;padding:0;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:12px;
}
.decisions li{
  border:1px solid var(--rule);border-radius:6px;
  padding: 26px 28px;
  display:flex;flex-direction:column;gap:14px;
  background: var(--paper);
  transition: background .2s var(--ease);
}
.decisions li:hover{background:var(--paper-2)}
.d-n{
  font-size:11px;color:var(--muted);
  letter-spacing:0.06em;text-transform:uppercase;
}
.decisions h3{
  font-family:'Geist';font-weight:500;
  font-size:20px;line-height:1.25;margin:0;
  letter-spacing:-0.02em;
}
.decisions p{
  margin:0;font-size:14.5px;line-height:1.55;
  color: var(--muted);
}
@media(max-width:760px){
  .decisions{grid-template-columns: 1fr}
  .decisions li{padding:22px 24px}
}

/* Demo cards */
.case-demo{max-width: var(--max);margin:0 auto;padding: 40px var(--gutter) 80px}
.demo-title{font-family:'Geist';font-weight:500;font-size:28px;letter-spacing:-0.02em;margin: 0 0 20px}
.demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.demo-card{
  display:flex;flex-direction:column;gap:10px;
  border:1px solid var(--rule);border-radius:6px;padding:24px;min-height:160px;
  background:var(--paper);
  transition: background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.demo-card:hover{background:var(--ink);color:var(--paper);transform:translateY(-3px)}
.demo-num{font-size:11px;color:var(--muted)}
.demo-card:hover .demo-num, .demo-card:hover .demo-meta{color:var(--muted-2)}
.demo-h{font-family:'Geist';font-weight:500;font-size:18px;letter-spacing:-0.01em;line-height:1.3}
.demo-meta{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-top:auto}
@media (max-width: 900px){.demo-grid{grid-template-columns:1fr}}

/* Pullquote */
.pullquote{
  margin: 28px 0 8px;padding: 28px 32px;border-left: 3px solid var(--accent);
  background: color-mix(in oklab, var(--accent), var(--paper) 85%);
  border-radius: 0 6px 6px 0;
}
.pullquote blockquote{
  margin:0;font-family:'Geist';font-weight:500;
  font-size: clamp(20px, 2vw, 28px);line-height:1.3;letter-spacing:-0.02em;
}
.pullquote figcaption{font-family:'Geist Mono';font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-top:14px}

/* Next case study */
.case-next{
  max-width: var(--max);margin:0 auto;padding: 60px var(--gutter) 40px;
  border-top:1px solid var(--rule);
}
.case-next .section-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:24px}
.case-next-link{
  display:grid;grid-template-columns: 80px 1fr 60px;align-items:center;gap:24px;
  padding: 48px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  position:relative;isolation:isolate;overflow:hidden;
  transition: padding .3s var(--ease);
}
.case-next-link::before{
  content:"";position:absolute;inset:0;background:var(--accent);
  transform:scaleY(0);transform-origin:bottom;transition:transform .4s var(--ease);z-index:-1;
}
.case-next-link:hover::before{transform:scaleY(1);transform-origin:top}
.case-next-link:hover{padding-left:24px;padding-right:24px}
.next-num{font-size:11px;color:var(--muted)}
.next-title{font-family:'Geist';font-weight:500;font-size: clamp(36px, 5vw, 72px);letter-spacing:-0.03em;line-height:1}
.next-sub{font-style:italic;font-weight:400;font-size: clamp(16px,1.5vw,22px);color:var(--muted)}
.case-next-link:hover .next-sub{color:var(--ink)}
.next-arrow{font-size:28px;justify-self:end;transition:transform .3s var(--ease)}
.case-next-link:hover .next-arrow{transform: translate(6px,-6px)}

/* Stubs: compact case page */
.stub-hero{max-width:1000px;margin:0 auto;padding: 140px var(--gutter) 40px}
.stub-hero .case-title{font-size: clamp(40px, 5vw, 72px)}

.wip-banner{
  max-width: 1000px;margin: 40px auto 0;padding: 24px var(--gutter);
  border:1px dashed var(--rule);border-radius:6px;
  display:flex;align-items:center;gap:16px;
  font-family:'Geist Mono';font-size:12px;letter-spacing:.04em;color:var(--ink);
}
.wip-banner .wip-dot{
  width:10px;height:10px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 4px color-mix(in oklab, var(--accent), transparent 70%);
}

/* Contact page */
.contact-page{max-width:1100px;margin:0 auto;padding: 140px var(--gutter) 80px}
.contact-grid{display:grid;grid-template-columns: 1.2fr 1fr;gap: 60px;margin-top:60px;align-items:start}
.contact-left h1{font-family:'Geist';font-weight:500;font-size:clamp(48px,6vw,88px);line-height:0.98;letter-spacing:-0.035em;margin:0 0 24px}
.contact-left h1 em{font-style:italic;font-weight:500;color: color-mix(in oklab, var(--accent), #000 25%)}
.contact-left p{font-size:18px;line-height:1.55;max-width:48ch;margin:0 0 20px}
.contact-card{
  border:1px solid var(--rule);border-radius:6px;padding:28px;
  display:flex;flex-direction:column;gap:18px;background:var(--paper);
}
.contact-card h3{font-size:14px;margin:0;font-family:'Geist Mono';color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.contact-row{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px dashed var(--rule-soft);padding-bottom:12px}
.contact-row:last-child{border-bottom:none;padding-bottom:0}
.contact-row .k{font-family:'Geist Mono';font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.contact-row .v{font-size:14px}

/* 404 */
.nf{min-height: 90vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding: 140px var(--gutter) 40px;gap:28px}
.nf-code{font-family:'Geist';font-weight:600;font-size: clamp(120px, 22vw, 320px);line-height:0.9;letter-spacing:-0.05em;margin:0}
.nf-code span{color:transparent;-webkit-text-stroke:1.5px var(--ink);font-style:italic;font-weight:500}
.nf p{font-size: 18px;max-width: 52ch;line-height:1.5;margin:0}

/* Responsive */
@media (max-width: 900px){
  .case-meta{grid-template-columns: repeat(2,1fr)}
  .case-meta > div:nth-child(2n){border-right:none}
  .case-metrics{grid-template-columns: repeat(2,1fr)}
  .metric{border-right:none;border-bottom:1px solid var(--rule-soft)}
  .case-two-col{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .case-next-link{grid-template-columns: 40px 1fr 40px}
  .demo-grid{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .case-hero{padding:80px 20px 40px}
  .stub-hero{padding:80px 20px 32px}
  .case-title{font-size:clamp(36px,11vw,64px);margin-bottom:18px}
  .case-lede{font-size:15px}
  .case-meta{grid-template-columns:1fr 1fr}
  .case-meta > div{padding:12px 10px}
  .case-metrics{grid-template-columns:1fr 1fr}
  .m-value{font-size:clamp(32px,9vw,52px)}
  .case-shot{padding:20px 16px}
  .case-shot.xl{padding:24px 16px}
  .case-two-col{padding:20px 16px;gap:12px}
  .case-sec{padding:48px 20px}
  .case-p{font-size:15px}
  .case-next{padding:40px 20px}
  .next-title{font-size:clamp(28px,9vw,52px)}
  .pullquote{padding:20px 20px}
  .pullquote blockquote{font-size:18px}
  .contact-page{padding:80px 20px 48px}
  .contact-left h1{font-size:clamp(36px,12vw,64px)}
  .nf-code{font-size:clamp(80px,22vw,200px)}
}

/* =========== CASE LOCK REGION =========== */
.case-lock-region{
  position: relative;
}

/* Locked content: blurred, not selectable, can't be interacted with */
.case-lock-region.is-locked .case-locked-content{
  filter: blur(8px);
  -webkit-filter: blur(8px);
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  opacity: 0.85;
}
.case-locked-content{
  transition: filter .45s var(--ease), opacity .45s var(--ease);
}

/* Hide the gate when unlocked */
.case-lock-region:not(.is-locked) .case-lock-gate{
  display: none;
}

/* =========== CASE LOCK GATE =========== */
.case-lock-gate{
  max-width: 680px;
  margin: 40px auto -240px;            /* negative bottom pulls blurred content up under gate */
  padding: 48px 40px 40px;
  text-align: center;
  border: 1px solid var(--rule);
  border-radius: 8px;
  background: color-mix(in oklab, var(--paper) 96%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 30px 80px -30px rgba(0,0,0,0.25), 0 8px 24px -12px rgba(0,0,0,0.15);
  position: sticky;
  top: 90px;
  z-index: 30;
}
.case-lock-card{
  position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 0;
}
.case-lock-eyebrow{
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 10px; letter-spacing: .12em; color: var(--muted);
  border: 1px solid var(--rule-soft);
  padding: 7px 14px; border-radius: 999px;
  margin-bottom: 24px;
}
.case-lock-icon{font-size: 12px}
.case-lock-gate h2{
  font-family: 'Geist'; font-weight: 500;
  font-size: clamp(26px, 3.2vw, 40px);
  letter-spacing: -0.025em; line-height: 1.1;
  margin: 0 0 16px;
  max-width: 22ch;
}
.case-lock-gate p{
  font-size: 15px; line-height: 1.55; color: var(--ink);
  margin: 0 0 28px;
  max-width: 54ch;
}
.case-lock-actions{
  margin-bottom: 40px;
}
.case-lock-form{
  width: 100%;
  border-top: 1px solid var(--rule-soft);
  padding-top: 24px;
}
.case-lock-label{
  display: block;
  font-size: 10px; color: var(--muted);
  text-transform: uppercase; letter-spacing: .12em;
  margin-bottom: 14px;
}
.case-lock-input-row{
  display: flex; gap: 8px;
  max-width: 380px;
  margin: 0 auto;
}
.case-lock-input-row input{
  flex: 1;
  padding: 12px 18px;
  border: 1px solid var(--rule);
  border-radius: 999px;
  font-family: 'Geist Mono', monospace;
  font-size: 13px; letter-spacing: .04em;
  background: var(--paper);
  color: var(--ink);
  transition: border-color .18s var(--ease), background .18s var(--ease);
  min-width: 0;
}
.case-lock-input-row input:focus{
  outline: none;
  border-color: var(--ink);
  background: var(--paper-2);
}
.case-lock-input-row input.shake{
  animation: caseLockShake .38s ease;
  border-color: oklch(0.62 0.20 25);
}
.case-lock-input-row .btn{
  flex-shrink: 0;
  padding: 12px 18px;
  font-size: 13px;
}
@keyframes caseLockShake{
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-6px); }
  40%, 80% { transform: translateX(6px); }
}
.case-lock-msg{
  font-size: 11px;
  color: var(--muted);
  letter-spacing: .04em;
  margin-top: 14px;
  min-height: 16px;
}
@media (max-width: 640px){
  .case-lock-gate{margin: 40px 20px 60px; padding: 40px 24px 36px}
  .case-lock-gate::before{top: -100px; height: 100px}
  .case-lock-input-row{flex-direction: column; max-width: 320px}
  .case-lock-input-row .btn{width: 100%}
}

/* =========== SKELETON PLACEHOLDER (shown behind gate when locked, swapped on unlock) =========== */
.case-locked-skeleton{
  display: grid;
  gap: 28px;
  max-width: 1100px;
  margin: 60px auto 0;
  padding: 0 24px 320px;
  filter: blur(6px);
  opacity: 0.55;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}
.case-lock-region:not(.is-locked) .case-locked-skeleton{display:none}
.skl-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.skl-row.one-col{grid-template-columns: 1fr}
.skl-block{
  background: linear-gradient(100deg,
    color-mix(in oklab, var(--ink) 6%, transparent) 0%,
    color-mix(in oklab, var(--ink) 10%, transparent) 50%,
    color-mix(in oklab, var(--ink) 6%, transparent) 100%);
  background-size: 200% 100%;
  border-radius: 8px;
  animation: sklShimmer 2.4s linear infinite;
}
.skl-img{height: 360px}
.skl-h{height: 32px; width: 65%; border-radius: 6px}
.skl-p{height: 14px; border-radius: 4px}
.skl-p.short{width: 70%}
.skl-p.tight{width: 45%}
.skl-stack{display: grid; gap: 12px}
@keyframes sklShimmer{
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@media (max-width: 640px){
  .skl-row, .skl-row.one-col{grid-template-columns: 1fr}
  .skl-img{height: 220px}
}

/* =========== PRINT: hide everything except a private-notice =========== */
@media print {
  .case-lock-region.is-locked .case-locked-content,
  .case-lock-region.is-locked .case-locked-skeleton,
  .case-lock-region.is-locked .case-lock-gate{display: none !important}
  .case-lock-region.is-locked::after{
    content: "This case study is private. Email AJ at adedamolajokee@gmail.com for access.";
    display: block;
    padding: 60px 40px;
    text-align: center;
    font-family: 'Geist', sans-serif;
    font-size: 16px;
    color: #000;
    border: 1px solid #000;
    margin: 40px;
  }
  /* Even when unlocked, don't allow printing the content */
  .case-locked-content{display: none !important}
  .case-locked-content::after{
    content: "Printing this case study isn't permitted. Please refer to the live page.";
    display: block !important;
    padding: 40px;
    text-align: center;
    color: #000;
  }
}