/* ============ WiseOps Gambling — site-aligned design system ============ */

:root {
  --navy-900: #2F2C6E;       /* primary dark (mix #322F79 + #2C2963) */
  --navy-800: #35327A;
  --navy-700: #3D3A87;
  --navy-500: #6C699F;
  --navy-300: #9F9DC3;

  --orange-600: #C9561E;
  --orange-500: #E26226;     /* brand accent — matches wiseops.team */
  --orange-400: #E87F4E;
  --orange-100: #F7CDB5;
  --orange-050: #FDEBDD;

  --bg: #F6F7FA;             /* page */
  --bg-alt: #EEF1F6;
  --surface: #FFFFFF;
  --line: #E4E8EF;
  --line-soft: #EEF1F6;

  --ink-900: #2F2C6E;
  --ink-700: #4E4B8C;
  --ink-500: #7977A2;
  --ink-300: #A6B0C1;

  --radius-pill: 999px;
  --radius-lg: 20px;
  --radius-md: 14px;

  --shadow-sm: 0 1px 2px rgba(14,35,67,0.04), 0 2px 6px rgba(14,35,67,0.04);
  --shadow-md: 0 6px 24px rgba(14,35,67,0.08);
  --shadow-lg: 0 18px 40px rgba(14,35,67,0.10);
  --shadow-orange: 0 10px 24px rgba(240,133,51,0.28);

  --container: 1240px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html,body{background:var(--bg);color:var(--ink-900);}
body{
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, sans-serif;
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
  line-height: 1.55;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}

.container{max-width:var(--container);margin:0 auto;padding:0 32px;}

/* ============ Typography ============ */
.eyebrow{
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orange-600);
}
h1,h2,h3,h4{
  font-family: 'Roboto', 'Inter', sans-serif;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  line-height: 1.05;
  font-weight: 700;
}
h1{font-size: clamp(44px, 5.8vw, 82px); font-weight: 700;}
h2{font-size: clamp(36px, 4.2vw, 60px); line-height:1.08; font-weight:700;}
h3{font-size: 22px; line-height:1.25; font-weight:700; letter-spacing:-0.015em;}
h4{font-size: 16px; font-weight:700;}
p{color: var(--ink-700); font-size: 15px; line-height:1.6;}
.lead{font-size: 16px; color: var(--ink-700); max-width: 680px; line-height:1.6;}

/* ============ Buttons (pill, site-style) ============ */
.btn{
  display:inline-flex;
  align-items:center;
  gap: 12px;
  padding: 14px 22px 14px 28px;
  border-radius: var(--radius-pill);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.005em;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
  white-space: nowrap;
}
.btn-primary{
  background: var(--orange-500);
  color:#fff;
  box-shadow: var(--shadow-orange);
}
.btn-primary:hover{transform: translateY(-1px); box-shadow: 0 14px 28px rgba(240,133,51,0.38);}
.btn-secondary{
  background: #fff;
  color: var(--ink-900);
  border: 1.5px solid var(--line);
}
.btn-secondary:hover{border-color: var(--orange-500); color: var(--orange-600);}

.btn .btn-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;
  border-radius:50%;
  background: var(--orange-500);
  color:#fff;
  transition: transform .2s;
}
.btn:hover .btn-icon{ transform: translateY(-2px); }
.btn-primary .btn-icon{
  background: #fff;
  color: var(--orange-500);
}
.btn-secondary .btn-icon{background: var(--orange-500);color:#fff;}

.btn-ghost{
  color: var(--ink-900); font-weight:600; font-size:15px;
  padding:10px 4px;
}
.btn-ghost:hover{color: var(--orange-600);}

/* ============ Top bar + Header ============ */
.topbar{
  background: #F6F7FA;
  color: var(--navy-900);
  font-size: 13px;
  border-bottom: 1px solid var(--line-soft);
}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between;
  height: 44px;
}
.topbar-socials{display:flex;gap:8px;}
.topbar-socials a{
  width:26px;height:26px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background: var(--navy-900);
  color:#fff;
  transition: background .2s, color .2s;
}
.topbar-socials a:hover{background: var(--orange-500);color:#fff;}
.topbar-contacts{display:flex;gap:28px;align-items:center;color:var(--navy-900);font-weight:600;}
.topbar-contacts a{display:inline-flex;align-items:center;gap:8px;}
.topbar-contacts a:hover{color: var(--orange-600);}

.header{
  background: #fff;
  border-bottom: 1px solid var(--line-soft);
  position: sticky; top:0; z-index: 40;
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height: 78px;
}
.logo{display:flex;align-items:center;gap:10px;}
.logo img{display:block;}
.logo-mark{
  width:36px;height:36px;border-radius:8px;
  background: var(--orange-500);
  display:flex;align-items:center;justify-content:center;
  box-shadow: 0 4px 10px rgba(226,126,78,0.35);
}
.logo-text{font-weight:800;font-size:20px;color:var(--navy-900);letter-spacing:-0.02em;}
.logo-text span{color: var(--orange-500);}

.nav{display:flex;gap:36px;}
.nav a{
  color: var(--navy-900);
  font-size: 16px;
  font-weight: 500;
  padding: 8px 0;
  position:relative;
}
.nav a:hover{color: var(--orange-600);}
.nav a.active::after{
  content:""; position:absolute; bottom:-2px;left:0;right:0;
  height:2px; background: var(--orange-500); border-radius:2px;
}
.nav a .chev{margin-left:4px;}

/* ============ Decorative waves (hero + sections) ============ */
.waves{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  overflow:hidden;
}
.waves svg{position:absolute;width:120%;height:120%;top:-10%;left:-10%;opacity:0.55;}

/* ============ Hero ============ */
.hero{
  position: relative;
  background: var(--bg);
  padding: 80px 0 72px;
  overflow: hidden;
}
.hero-inner{position:relative;z-index:1;}
.hero h1{max-width: 920px;}
.hero h1 .accent{color: var(--orange-500);}
.hero .lead{margin-top: 22px; font-size: 17px;}
.hero-cta{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap;}

/* Industry bar */
.industries{
  display:grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 28px 24px;
  margin-top: 72px;
  padding: 32px 0 0;
  border-top: 1px solid var(--line);
}
.industry{
  display:flex;align-items:center;gap:14px;
  font-weight:500;color:var(--navy-900);font-size:17px;
}
.industry-icon{
  width:40px;height:40px;border-radius:6px;
  background: var(--orange-500);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}

/* Stats row */
.stats{
  display:grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 32px;
  margin-top: 44px;
  align-items: start;
}
.stat{min-width:0;}
.stat-num{
  font-family:'Roboto', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 4vw, 60px);
  color: var(--navy-900);
  letter-spacing:-0.03em; line-height:1.05;
  white-space: nowrap;
}
.stat-label{
  margin-top:12px; font-size:14px; color: var(--ink-700);
  font-weight:400; line-height:1.4;
}

/* ============ Section primitives ============ */
.section{
  position: relative;
  padding: 100px 0;
}
.section-light{background: var(--bg);}
.section-white{background: var(--surface);}
.section-navy{background: var(--navy-900); color:#fff;}
.section-navy h2, .section-navy h3{color:#fff;}
.section-navy p{color: #B9C4D9;}

.section-head{display:flex;flex-direction:column;gap:14px;max-width: 860px;margin-bottom: 48px;}
.section-head .eyebrow + h2{margin-top: 0;}

/* ============ Pain Points ============ */
.pain-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 20px;
}
.pain-card{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 28px 26px;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  display:flex;flex-direction:column;gap:14px;
  position: relative;
  overflow:hidden;
}
.pain-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0;
  width:4px; background: var(--orange-500);
  transform: scaleY(0.0); transform-origin: top;
  transition: transform .3s ease;
}
.pain-card:hover{border-color: transparent; box-shadow: var(--shadow-lg); transform: translateY(-3px);}
.pain-card:hover::before{transform: scaleY(1);}
.pain-card-head{display:flex;align-items:flex-start;gap:14px;}
.pain-card-num{
  width:38px;height:38px;border-radius:10px;
  background: var(--orange-050); color: var(--orange-600);
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:15px;flex-shrink:0;
}
.pain-card h3{color: var(--navy-900);}
.pain-row{font-size:14px;color:var(--ink-700);line-height:1.55;}
.pain-row b{display:block;color:var(--ink-500);font-weight:600;text-transform:uppercase;letter-spacing:0.08em;font-size:11px;margin-bottom:3px;}
.pain-row--result b{color:var(--orange-600);}
.pain-row--result{padding-top:12px;border-top:1px dashed var(--line);margin-top:auto;}

/* ============ Capabilities ============ */
.cap-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow:hidden;
  background:#fff;
}
.cap-card{
  padding: 34px 30px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display:flex;flex-direction:column;gap:14px;
  background:#fff;
  transition: background .22s ease;
  position:relative;
}
.cap-card:nth-child(3n){border-right:none;}
.cap-card:nth-last-child(-n+3){border-bottom:none;}
.cap-card:hover{background: var(--orange-050);}
.cap-icon{
  width:48px;height:48px;border-radius:12px;
  background: var(--orange-500);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow: 0 6px 14px rgba(240,133,51,0.25);
}
.cap-card h3{color: var(--navy-900);}
.cap-card p{font-size:14.5px;}

/* ============ Case Study ============ */
.case-wrap{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 56px 48px;
  position:relative;
}
.case-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:40px;}
.case-intro{max-width:640px;}
.case-metrics{display:flex;gap:44px;}
.case-metric{text-align:right;}
.case-metric .v{font-weight:800;font-size:34px;color:var(--orange-500);letter-spacing:-0.02em;line-height:1;}
.case-metric .l{font-size:12px;text-transform:uppercase;color:var(--ink-500);letter-spacing:0.1em;margin-top:6px;}

.case-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:16px;
}
.case-card{
  background: var(--bg-alt);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 26px 24px;
  transition: background .2s, border-color .2s;
}
.case-card:hover{background:#fff;border-color:var(--orange-400);}
.case-card h3{
  color: var(--navy-900);
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:0.12em;
  font-weight:700;
  margin-bottom:16px;
  display:flex;align-items:center;gap:10px;
}
.case-card h3::before{
  content:""; width:6px;height:6px;border-radius:50%;background:var(--orange-500);
}
.case-card ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px;}
.case-card ul li{
  display:flex;gap:12px;font-size:14.5px;color:var(--ink-700);line-height:1.5;
}
.case-card ul li::before{
  content:""; width:14px;height:14px;flex-shrink:0;margin-top:5px;
  background: var(--orange-500);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='black' d='M7.5 13.5l-3-3 1.4-1.4 1.6 1.6 4.6-4.6L13.5 7z'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='black' d='M7.5 13.5l-3-3 1.4-1.4 1.6 1.6 4.6-4.6L13.5 7z'/></svg>") center/contain no-repeat;
}
/* Case outcome (replaces old .case-summary) */
.case-outcome{
  margin-top:36px;
  background: var(--navy-900);
  border-radius: 18px;
  padding: 44px 44px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 48px;
  align-items: center;
}
.case-outcome::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 100% 0%, rgba(240,133,51,0.18), transparent 45%),
    radial-gradient(circle at 0% 100%, rgba(240,133,51,0.08), transparent 50%);
  pointer-events:none;
}
.case-outcome > *{position:relative; z-index:1;}
.case-outcome-head .eyebrow{margin-bottom:14px; display:block;}
.case-outcome-title{
  color:#fff; font-size: 28px; line-height:1.2; font-weight:700;
  letter-spacing:-0.02em; max-width: 520px;
}
.case-outcome-metrics{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 28px 32px;
}
.co-metric{border-left: 2px solid var(--orange-500); padding-left: 18px;}
.co-v{
  font-family:'Roboto', sans-serif;
  font-size: 38px; font-weight: 700; color:#fff;
  letter-spacing:-0.03em; line-height:1;
}
.co-l{
  margin-top: 8px; font-size: 13px; color:#B9C4D9;
  line-height:1.45;
}
@media(max-width:900px){
  .case-outcome{grid-template-columns:1fr; gap:32px; padding:32px 28px;}
  .case-outcome-title{font-size:24px;}
  .case-outcome-metrics{gap:20px 24px;}
  .co-v{font-size:32px;}
}

/* ============ Use cases ============ */
.uc-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 16px;
}
.uc-card{
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--radius-md);
  padding: 28px 22px;
  transition: background .2s, border-color .2s, transform .2s;
}
.uc-card:hover{background: rgba(240,133,51,0.10); border-color: var(--orange-500); transform: translateY(-3px);}
.uc-icon{
  width:44px;height:44px;border-radius:12px;
  background: rgba(240,133,51,0.16);
  color: var(--orange-400);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
}
.uc-card h3{font-size:16px;color:#fff;margin-bottom:6px;}
.uc-card p{font-size:13.5px;color:#9FAECB;line-height:1.5;}

/* ============ Final CTA ============ */
.final-cta-wrap{
  position:relative;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-800) 100%);
  border-radius: 28px;
  padding: 80px 64px;
  overflow:hidden;
  color:#fff;
  display:flex;justify-content:space-between;align-items:center;gap:48px;flex-wrap:wrap;
}
.final-cta-wrap h2{color:#fff;max-width:640px;}
.final-cta-wrap .lead{color:#B9C4D9;margin-top:14px;}
.final-cta-actions{display:flex;gap:14px;flex-wrap:wrap;}
.final-cta-wrap .waves svg{opacity:0.12;}

/* ============ Footer (light redesign) ============ */
.footer{
  background: #F5F7FA; color: var(--navy-900);
  padding: 72px 0 28px;
  border-top: 1px solid rgba(16,28,54,0.06);
}
.footer-top{
  display:grid;
  grid-template-columns: 120px 1fr 240px;
  gap: 28px;
  align-items: start;
  padding-bottom: 40px;
}
.footer-pages h4,
.footer-services-card h4{
  color: var(--navy-900);
  font-size: 15px; font-weight: 700;
  text-transform:none; letter-spacing:0;
  margin-bottom: 18px;
}
.footer-pages ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;}
.footer-pages ul a{color: var(--navy-700); font-size:14px;}
.footer-pages ul a:hover{color: var(--orange-500);}
.chev-mini{font-size:10px; color: var(--navy-500); margin-left:2px;}

.footer-services-card{
  background:#FFFFFF;
  border-radius: 18px;
  padding: 28px 28px;
  box-shadow: 0 6px 24px rgba(16,28,54,0.04);
}
.fsc-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px 22px;
}
.fsc-col{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;}
.fsc-col li{font-size:13px; line-height:1.3;}
.fsc-col a{color: var(--navy-900); font-weight: 500;}
.fsc-col a:hover{color: var(--orange-500);}
.fsc-head{
  color: var(--navy-500); font-size: 12.5px !important;
  font-weight: 500; margin-top: 6px; padding-top: 2px;
}
.fsc-col li:first-child.fsc-head{margin-top:0;}

.footer-contact{position:relative; padding-top: 8px;}
.back-to-top{
  position:absolute; top: 0; right: 0;
  width: 48px; height: 48px; border-radius:50%;
  background: var(--orange-500); color:#fff;
  display:flex;align-items:center;justify-content:center;
  border:none; cursor:pointer;
  box-shadow: 0 8px 18px rgba(226,126,78,0.35);
  transition: background .2s, transform .2s;
}
.back-to-top:hover{background: var(--orange-600); transform: translateY(-2px);}
.bt-arrow{transform: none;}
.fc-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:14px;}
.fc-list li{display:flex;align-items:center;gap:12px;font-size:14px;color: var(--navy-900);}
.fc-ic{
  width:18px;height:18px;
  color: var(--navy-500);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.fc-list a{color: var(--navy-900);}
.fc-list a:hover{color: var(--orange-500);}

.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding-top: 24px;
  border-top: 1px solid rgba(16,28,54,0.08);
  font-size:13px; color: var(--navy-500);
  flex-wrap:wrap; gap:16px;
}
.fb-left{display:flex; gap:32px; align-items:center;}
.fb-left a{color: var(--navy-500);}
.fb-left a:hover{color: var(--orange-500);}
.fb-socials{display:flex; gap:28px; align-items:center; flex-wrap:wrap;}
.fb-socials a{
  display:flex;align-items:center;gap:8px;
  color: var(--navy-700); font-size:13px; font-weight:500;
}
.fb-socials a:hover{color: var(--navy-900);}
.fbs-ic{
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
}
.fbs-in{background: var(--orange-500); border-radius: 4px;}
.fbs-tg,
.fbs-wa,
.fbs-fb{background: var(--orange-500); border-radius: 50%;}
.fbs-ic{border-radius: 50%;}
.fb-socials .fbs-in{border-radius: 4px;}

/* ============ Responsive ============ */
@media (max-width: 1100px){
  .pain-grid, .cap-grid, .case-grid{grid-template-columns: repeat(2, minmax(0,1fr));}
  .cap-card:nth-child(3n){border-right:1px solid var(--line);}
  .cap-card:nth-child(2n){border-right:none;}
  .cap-card:nth-last-child(-n+3){border-bottom:1px solid var(--line);}
  .cap-card:nth-last-child(-n+2){border-bottom:none;}
  .industries{grid-template-columns: repeat(3, minmax(0,1fr));}
  .stats{grid-template-columns: repeat(5, minmax(0,1fr));gap:12px;}
  .uc-grid{grid-template-columns: repeat(2, minmax(0,1fr));}
}
@media (max-width: 720px){
  .container{padding:0 20px;}
  .section{padding:72px 0;}
  .hero{padding: 52px 0 48px;}
  .nav{display:none;}
  .topbar-socials{display:none;}
  .industries{grid-template-columns: repeat(2, minmax(0,1fr));}
  .stats{grid-template-columns: repeat(2, minmax(0,1fr));gap:24px 12px;}
  .pain-grid, .cap-grid, .case-grid{grid-template-columns: 1fr;}
  .cap-card{border-right:none !important;}
  .cap-card:not(:last-child){border-bottom:1px solid var(--line)!important;}
  .uc-grid{grid-template-columns: 1fr;}
  .case-wrap{padding: 36px 24px;}
  .case-metrics{gap:20px;}
  .case-metric{text-align:left;}
  .final-cta-wrap{padding:56px 28px;}
  .footer-top{grid-template-columns: 1fr; gap: 32px;}
  .footer-services-card{padding: 24px 20px;}
  .fsc-grid{grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px;}
  .footer-contact{padding-top: 0;}
  .back-to-top{position: static; margin-bottom: 18px;}
  .back-to-top:hover{transform: translateY(-2px);}
}

@media (max-width: 520px){
  .fsc-grid{grid-template-columns: 1fr; gap: 18px;}
  .footer-services-card{padding: 22px 18px;}
}

/* ============ Utility ============ */
.inline-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px;border-radius:999px;
  background: var(--orange-050); color: var(--orange-600);
  font-size:12px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
  border: 1px solid rgba(240,133,51,0.25);
}
.dot{width:6px;height:6px;border-radius:50%;background:var(--orange-500);display:inline-block;}

/* ============ Contact modal ============ */
.contact-modal{
  position:fixed; inset:0; z-index:9999;
  background: rgba(47, 44, 110, 0.55);
  backdrop-filter: blur(2px);
  display:flex; align-items:center; justify-content:center;
  padding: 40px 20px;
  animation: cm-fade .2s ease-out;
}
.contact-modal-body{
  position:relative;
  width: min(440px, 100%);
  background:#fff; border-radius: 16px;
  box-shadow: 0 30px 80px rgba(15,18,40,0.35);
  padding: 44px 44px 40px;
}
.contact-close{
  position:absolute; top:14px; right:14px;
  width:32px; height:32px; border-radius:50%;
  background: transparent; color: var(--navy-900);
  display:flex; align-items:center; justify-content:center;
  border:none; cursor:pointer;
  transition: background .15s, color .15s;
}
.contact-close:hover{background: var(--navy-900); color:#fff;}
.contact-title{
  font-family: 'Roboto', sans-serif;
  font-size: 26px; font-weight: 700;
  color: var(--navy-900); text-align:center;
  margin-bottom: 26px; letter-spacing:-0.01em;
}
.contact-form{display:flex; flex-direction:column; gap:14px;}
.cf-field{
  position: relative; display:block;
}
.cf-field input,
.cf-field textarea{
  width:100%;
  padding: 18px 18px 8px;
  font-family:'Inter', sans-serif; font-size:15px;
  color: var(--navy-900);
  background:#fff;
  border: 1.5px solid #DDE1EB;
  border-radius: 10px;
  transition: border-color .2s;
  resize: vertical;
}
.cf-field textarea{padding-top: 22px; padding-bottom: 14px; min-height: 110px;}
.cf-field input:focus,
.cf-field textarea:focus{outline:none; border-color: var(--orange-500);}
.cf-label{
  position:absolute; left: 18px; top: 18px;
  color: #8C93A4; font-size:15px; pointer-events:none;
  transition: transform .15s, font-size .15s, color .15s;
  background: #fff; padding: 0 4px;
}
.cf-hint{
  position:absolute; right: 14px; top: 18px;
  color: #B4BAC7; font-size: 12px; pointer-events:none;
  background: #fff; padding: 0 4px;
  transition: opacity .15s;
}
.cf-field input:focus ~ .cf-hint,
.cf-field input:not(:placeholder-shown) ~ .cf-hint,
.cf-field textarea:focus ~ .cf-hint,
.cf-field textarea:not(:placeholder-shown) ~ .cf-hint{
  opacity: 0;
}
.cf-field input:focus + .cf-label,
.cf-field input:not(:placeholder-shown) + .cf-label,
.cf-field textarea:focus + .cf-label,
.cf-field textarea:not(:placeholder-shown) + .cf-label{
  transform: translateY(-26px);
  font-size: 12px;
  color: var(--navy-900);
}
.cf-error{
  font-size:13px; color:#C9281C;
  background:#FDECEA; border:1px solid #F5C3BD;
  border-radius:8px; padding:10px 12px;
}
/* Phone with dial-code selector */
.cf-phone{display:block;}
.cf-phone .cf-dial{
  position:absolute; left:10px; top:50%; transform: translateY(-50%);
  height: 30px;
  padding: 0 22px 0 8px;
  border: none; background: transparent;
  font-family:'Inter', sans-serif; font-size:14px;
  color: var(--navy-900); cursor:pointer;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%232F2C6E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 4px center;
  border-right: 1px solid #DDE1EB;
}
.cf-phone .cf-dial:focus{outline:none;}
.cf-phone input[type="tel"]{
  padding-left: 116px;
}
.cf-phone .cf-label{ left: 116px; }
.cf-submit{
  width:100%; justify-content:center;
  margin-top: 8px;
  padding: 18px 24px !important;
  border-radius: 999px;
  font-size: 15px;
}
.cf-submit[disabled]{opacity:0.7; cursor: default;}
.contact-success{
  display:flex; flex-direction:column; align-items:center;
  gap: 16px; padding: 24px 0 8px; text-align:center;
}
.contact-success-ic{
  width:56px; height:56px; border-radius:50%;
  background: var(--orange-050); color: var(--orange-500);
  display:flex;align-items:center;justify-content:center;
}
.contact-success p{font-size:15px; color: var(--navy-900); max-width: 320px;}
@keyframes cm-fade{from{opacity:0} to{opacity:1}}
@media (max-width:520px){
  .contact-modal-body{padding: 36px 24px 28px;}
}

/* ============ Meeting modal ============ */
.meeting-modal{
  position:fixed; inset:0; z-index:9999;
  background: rgba(15, 18, 40, 0.68);
  backdrop-filter: blur(4px);
  display:flex; align-items:center; justify-content:center;
  padding: 40px 20px;
  animation: mm-fade .2s ease-out;
}
.meeting-modal-body{
  position:relative;
  width: min(1040px, 100%); height: min(760px, 92vh);
  background:#fff; border-radius: 18px;
  box-shadow: 0 30px 80px rgba(15,18,40,0.45);
  overflow:hidden;
}
.meeting-modal-body iframe{
  width:100%; height:100%; border:0; display:block;
}
.meeting-close{
  position:absolute; top:12px; right:12px; z-index:2;
  width:38px; height:38px; border-radius:50%;
  background: rgba(47,44,110,0.9); color:#fff;
  display:flex; align-items:center; justify-content:center;
  border:none; cursor:pointer;
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
  transition: background .2s;
}
.meeting-close:hover{background: var(--orange-500);}
@keyframes mm-fade{from{opacity:0} to{opacity:1}}

/* Cookie notice — informational banner, bottom-center */
.cookie-notice{
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  z-index: 3000;
  background: #FFFFFF;
  border-radius: 18px;
  box-shadow: 0 12px 40px rgba(16,28,54,0.12);
  padding: 22px 28px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
  max-width: 420px;
  width: calc(100% - 32px);
  animation: cn-in .3s ease-out;
}
@keyframes cn-in{
  from { opacity: 0; transform: translate(-50%, 20px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}
.cn-close{
  position: absolute;
  top: 10px; right: 12px;
  width: 24px; height: 24px;
  display: flex; align-items: center; justify-content: center;
  background: transparent; border: none; cursor: pointer;
  color: var(--orange-500);
  opacity: 0.8;
  transition: opacity .15s;
}
.cn-close:hover{opacity: 1;}
.cn-text{
  margin: 0;
  color: var(--navy-900);
  font-size: 15px;
  line-height: 1.4;
  font-weight: 500;
  padding: 0 12px;
}
.cn-ok{
  background: var(--orange-500);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 12px 26px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s, transform .15s;
  box-shadow: 0 6px 18px rgba(226,126,78,0.3);
}
.cn-ok:hover{
  background: var(--orange-600);
  transform: translateY(-1px);
}
@media (max-width:720px){
  .meeting-modal{padding:0;}
  .meeting-modal-body{width:100%; height:100%; border-radius:0;}
}

/* gentle hover for icon links etc */
a, button { transition: color .2s; }
