@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Inter:wght@300;400;500;600;700;800&display=swap');

.hairtc-ce,
.hairtc-ce *{ box-sizing:border-box; font-family:'Inter',sans-serif; }
.hairtc-ce a{ text-decoration:none; color:inherit; }

body.page-template-page-cost-estimator .entry-content,
body.page-template-page-cost-estimator .page-header{ display:none!important }
body.page-template-page-cost-estimator .site-content,
body.page-template-page-cost-estimator #primary{ padding:0!important; max-width:100%!important }

/* HERO */
.ce-hero{ background:#EEF4F2; border-bottom:1px solid #E2E8E4; padding:52px 24px 44px }
.ce-hero-inner{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr auto; gap:48px; align-items:center }
.ce-live-pill{ display:inline-flex; align-items:center; gap:6px; border:1px solid #C8D8D4; border-radius:20px; padding:5px 12px; font-size:12px; font-weight:500; color:#2D6A5A; background:#fff; margin-bottom:14px }
.ce-live-dot{ width:7px; height:7px; border-radius:50%; background:#2D9E7A }
.ce-hero h1{ font-size:42px; font-weight:800; color:#0A1628; line-height:1.1; margin-bottom:14px; letter-spacing:-.02em; font-family:'Inter',sans-serif }
.ce-hero-sub{ font-size:15px; color:#4A5568; line-height:1.7; margin-bottom:20px; max-width:480px }
.ce-hero-pills{ display:flex; gap:8px; flex-wrap:wrap }
.ce-hero-pill{ border:1px solid #D1D9D7; background:#fff; border-radius:20px; padding:6px 14px; font-size:12px; font-weight:500; color:#374151 }
.ce-stats-block{ display:flex; gap:4px; flex-shrink:0 }
.ce-stat-box{ background:#0A1628; border-radius:10px; padding:18px 22px; text-align:center; min-width:90px }
.ce-stat-val{ font-size:26px; font-weight:800; color:#fff; letter-spacing:-.02em; line-height:1 }
.ce-stat-lbl{ font-size:11px; color:#94A3B8; margin-top:5px; font-weight:400 }

/* BODY */
.ce-body{ max-width:1100px; margin:0 auto; padding:40px 24px; display:grid; grid-template-columns:360px 1fr; gap:28px; align-items:start }

/* INPUT PANEL */
.ce-panel{ background:#fff; border:1px solid #E2E8E4; border-radius:14px; overflow:hidden; position:sticky; top:80px }
.ce-panel-head{ padding:18px 22px; border-bottom:1px solid #F0F4F4; background:#FAFCFB }
.ce-panel-title{ font-size:13px; font-weight:700; color:#0A1628 }
.ce-panel-sub{ font-size:12px; color:#94A3B8; margin-top:2px }
.ce-panel-body{ padding:22px }
.ce-field{ margin-bottom:20px }
.ce-label{ font-size:12px; font-weight:600; color:#374151; margin-bottom:8px; display:block }
.ce-label-note{ font-weight:400; color:#94A3B8; margin-left:4px }

/* Country grid — CHANGE 2: bigger font + flag */
.ce-country-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px }
.ce-country-btn{
  padding:10px 6px;
  border:1.5px solid #E5EAE8;
  border-radius:8px;
  font-size:13px;
  font-weight:500;
  color:#374151;
  cursor:pointer;
  text-align:center;
  transition:all .12s;
  background:#fff;
  font-family:'Inter',sans-serif;
  line-height:1.3
}
.ce-country-btn .ce-flag{ font-size:17px; display:block; margin-bottom:3px }
.ce-country-btn:hover{ border-color:#0A1628; color:#0A1628 }
.ce-country-btn.active{ background:#0A1628; border-color:#0A1628; color:#fff }

/* Technique grid */
.ce-tech-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:6px }
.ce-tech-btn{ padding:9px 10px; border:1.5px solid #E5EAE8; border-radius:8px; font-size:12px; font-weight:500; color:#475569; cursor:pointer; text-align:center; transition:all .12s; background:#fff; font-family:'Inter',sans-serif }
.ce-tech-btn:hover{ border-color:#2563EB; color:#2563EB }
.ce-tech-btn.active{ background:#2563EB; border-color:#2563EB; color:#fff }

/* Slider */
.ce-slider-row{ display:flex; align-items:center; gap:12px }
.ce-slider{ flex:1; height:4px; accent-color:#4DBFA0; cursor:pointer }
.ce-slider-val{ font-size:14px; font-weight:700; color:#0A1628; min-width:52px; text-align:right }
.ce-slider-labels{ display:flex; justify-content:space-between; font-size:10px; color:#94A3B8; margin-top:4px }

.ce-graft-hint{ background:#F0FAF6; border:1px solid #BBE0D4; border-radius:8px; padding:10px 12px; font-size:12px; color:#0F6E56; line-height:1.5; margin-bottom:16px }
.ce-graft-hint a{ font-weight:600; color:#0F6E56 }

/* CHANGE 3: calculate button = teal green */
.ce-calc-btn{ width:100%; background:#4DBFA0; color:#0A1628; border:none; padding:13px; border-radius:9px; font-size:14px; font-weight:700; cursor:pointer; font-family:'Inter',sans-serif; transition:background .15s }
.ce-calc-btn:hover{ background:#3DAF90 }

/* RESULTS */
.ce-results{ display:flex; flex-direction:column; gap:20px }

/* Main card */
.ce-main-card{ background:#fff; border:2px solid #2563EB; border-radius:14px; padding:28px }
.ce-main-top{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px }
.ce-main-label{ font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:#2563EB; margin-bottom:6px }
.ce-main-price{ font-size:48px; font-weight:800; color:#0A1628; letter-spacing:-.03em; line-height:1 }
.ce-main-price-sub{ font-size:13px; color:#64748B; margin-top:5px }
.ce-main-city-badge{ background:#0A1628; color:#fff; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:7px 14px; border-radius:7px; white-space:nowrap }
.ce-main-breakdown{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid #F1F5F9; padding-top:20px }
.ce-br-item{ text-align:center; padding:0 12px; border-right:1px solid #F1F5F9 }
.ce-br-item:first-child{ padding-left:0; text-align:left }
.ce-br-item:last-child{ border-right:none }
.ce-br-label{ font-size:10px; color:#94A3B8; text-transform:uppercase; letter-spacing:.05em; margin-bottom:4px }
.ce-br-val{ font-size:15px; font-weight:700; color:#0A1628 }
/* CHANGE 5: green class covers all saving/comparison text */
.ce-br-val.green{ color:#0F6E56 }

/* Compare table */
.ce-compare-card{ background:#fff; border:1px solid #E2E8E4; border-radius:14px; overflow:hidden }
.ce-compare-head{ padding:16px 20px; border-bottom:1px solid #F1F5F9; background:#FAFCFB; font-size:13px; font-weight:700; color:#0A1628 }
.ce-compare-row{ display:grid; grid-template-columns:1fr 1fr 1fr 80px; padding:12px 20px; border-bottom:1px solid #F8FAF9; align-items:center; font-size:13px; cursor:pointer; transition:background .1s }
.ce-compare-row:last-child{ border-bottom:none }
.ce-compare-row:hover{ background:#F8FAF9 }
.ce-compare-row.hl{ background:#EFF6FF }
.ce-compare-row.hdr{ background:#F1F5F9; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#94A3B8; cursor:default }
.ce-compare-row.hdr:hover{ background:#F1F5F9 }
.ce-cname{ font-weight:600; color:#0A1628 }
.ce-cprice{ color:#0A1628; font-weight:600 }
/* CHANGE 5: all comparison text green */
.ce-csave{ font-size:12px; color:#0F6E56; font-weight:600 }
.ce-csave.muted{ color:#94A3B8; font-weight:400 }
.ce-cbar-wrap{ height:5px; background:#EEF2F0; border-radius:3px }
/* CHANGE 6: bars are green */
.ce-cbar{ height:5px; border-radius:3px; background:#4DBFA0; transition:width .4s ease }

/* Included card */
.ce-included-card{ background:#fff; border:1px solid #E2E8E4; border-radius:14px; padding:20px }
.ce-included-title{ font-size:13px; font-weight:700; color:#0A1628; margin-bottom:14px }
.ce-included-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px }
.ce-inc-item{ display:flex; align-items:center; gap:8px; font-size:12px; color:#374151 }
.ce-inc-dot{ width:6px; height:6px; border-radius:50%; background:#0F6E56; flex-shrink:0 }
.ce-inc-dot.no{ background:#D1D5DB }

/* Lead card */
.ce-lead-card{ background:#0A1628; border-radius:14px; padding:28px }
.ce-lead-title{ font-family:'Inter',sans-serif; font-size:18px; color:#fff; margin-bottom:16px; font-weight:700 }
.ce-lead-row{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:8px }
.ce-lead-input{ padding:13px 14px; border-radius:10px; border:none; background:rgba(255,255,255,.08); color:#fff; font-size:13px; font-family:'Inter',sans-serif; outline:none; width:100% }
.ce-lead-input::placeholder{ color:rgba(255,255,255,.35) }
/* CHANGE 3: same green on lead button */
.ce-lead-btn{ width:100%; background:#4DBFA0; color:#0A1628; border:none; padding:14px; border-radius:10px; font-size:15px; font-weight:700; cursor:pointer; font-family:'Inter',sans-serif; margin-top:4px; transition:background .15s }
.ce-lead-btn:hover{ background:#3DAF90 }

/* CHANGE 8: no lead-note needed — removed from PHP */
.ce-disclaimer{ font-size:11px; color:#94A3B8; line-height:1.6; padding:14px 0; border-top:1px solid #E2E8E4 }
.ce-disclaimer a{ color:#64748B; text-decoration:underline }

@media(max-width:1024px){
  .ce-hero-inner{ grid-template-columns:1fr; gap:28px }
  .ce-body{ grid-template-columns:1fr }
  .ce-panel{ position:static }
}
@media(max-width:768px){
  .ce-hero{ padding:36px 16px 28px }
  .ce-hero h1{ font-size:28px }
  .ce-body{ padding:24px 16px; gap:20px }
  .ce-main-breakdown{ grid-template-columns:1fr 1fr }
  .ce-br-item:last-child{ grid-column:1/-1; border-right:none; border-top:1px solid #F1F5F9; padding-top:12px; margin-top:12px; text-align:left; padding-left:0 }
  .ce-compare-row{ grid-template-columns:1fr 1fr }
  .ce-compare-row > div:nth-child(3),
  .ce-compare-row > div:nth-child(4){ display:none }
  .ce-lead-row{ grid-template-columns:1fr }
  .ce-included-grid{ grid-template-columns:1fr }
}