/*
Theme Name: Market Day WiFi
Theme URI: https://example.com/market-day-wifi
Author: Market Day WiFi
Author URI: https://example.com
Description: High-converting, single-page WordPress theme for event WiFi rentals. Built to work with Contact Form 7.
Version: 1.0.0
License: MIT
Text Domain: market-day-wifi
*/

/* ---------- CSS Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html:focus-within{scroll-behavior:smooth}
body{margin:0;min-height:100vh;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,svg,video,canvas{display:block;max-width:100%;height:auto}
input,button,textarea,select{font:inherit}
a{text-decoration:none;color:inherit}

/* ---------- Design tokens (from logo) ---------- */
:root{
  --brand-teal:#2BB3A7;
  --brand-navy:#143A52;
  --brand-dk:#0E2B3C;
  --brand-sky:#E7FAF7;
  --ink:#0B1320;
  --muted:#5A6B7A;
  --surface:#FFFFFF;
  --ring:rgba(43,179,167,.35);
  --shadow:0 10px 24px rgba(16,38,53,.12);
  --radius:16px;
  --space:clamp(18px,1.8vw,24px);
  --maxw:1160px;
}

/* ---------- Base ---------- */
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  color:var(--ink);
  background:#F6F9FB;
  line-height:1.5;
}
ul{
	padding-inline-start:0px;
}
.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--space)}
.section{padding:clamp(48px,6vw,92px) 0}
.grid{display:grid;gap:clamp(16px,2vw,28px)}
.center{text-align:center}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.85);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid #E6EEF5;
}
.site-header .nav{
  display:flex;align-items:center;justify-content:space-between;
  height:72px;
}
.logo-wrap{display:flex;align-items:center;gap:14px}
.logo-wrap img{width:44px;height:44px}
.brand{font-weight:800;letter-spacing:.2px;color:var(--brand-navy)}
.site-header nav a{padding:10px 12px;border-radius:10px;color:var(--muted);font-weight:600}
.site-header nav a:hover{background:#F1F7FA;color:var(--brand-navy)}
.cta{
  display:inline-flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--brand-teal),#18A1B2);
  color:#fff !important;font-weight:800;padding:12px 18px;border-radius:12px;
  box-shadow:0 8px 18px rgba(24,161,178,.25);
}
.cta:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(24,161,178,.35); background:linear-gradient(135deg,var(--brand-teal),#18A1B2); color:#143A52 !important;}
.btn-outline{
  display:inline-flex;align-items:center;gap:10px;
  border:2px solid var(--brand-teal);color:var(--brand-teal);background:transparent;
  font-weight:800;padding:10px 16px;border-radius:12px;
}
.btn-outline:hover{background:#E6F7F5}

/* ---------- Hero ---------- */
.hero{
  background:
    radial-gradient(1200px 600px at 100% -10%, rgba(20,58,82,.08), transparent 60%),
    linear-gradient(180deg,#ffffff, #F3FBFA 55%, #F6F9FB);
}
.hero-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.kicker{font-weight:800;color:var(--brand-teal);letter-spacing:.2em;text-transform:uppercase;font-size:12px}
.hero h1{font-size:clamp(28px,4vw,54px);line-height:1.05;margin:.25em 0 .35em;color:var(--brand-navy)}
.sub{font-size:clamp(16px,1.5vw,19px);color:var(--muted);max-width:52ch}
.hero-card{
  background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:28px; border:1px solid #EAF3F1;
}
.hero-bullets{display:grid;gap:10px;margin:18px 0 26px}
.hero-bullets > div{display:flex;gap:12px;align-items:flex-start}
.check{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;
  background:var(--brand-teal);color:#fff;font-weight:900;line-height:0}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px
}
.stat{border:1px solid #E6EEF5;border-radius:12px;padding:12px 14px;background:#fff}
.stat strong{display:block;color:var(--brand-navy);font-size:clamp(16px,1.8vw,20px)}
.stat span{color:var(--muted);font-size:14px}

/* ---------- Steps ---------- */
.steps{grid-template-columns:repeat(4,minmax(0,1fr))}
.step{background:#fff;border:1px solid #E7EFF6;border-radius:14px;padding:18px 16px}
.step h4{margin:.6em 0 .35em;font-size:18px;color:var(--brand-navy)}
.step p{margin:0;color:var(--muted);font-size:15px}

/* ---------- Pricing ---------- */
.pricing{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{
  background:#fff;border:1px solid #E7EFF6;border-radius:18px;padding:22px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;justify-content:space-between;min-height:420px
}
.pill{display:inline-block;background:#EAF7F5;color:var(--brand-teal);font-weight:800;padding:6px 10px;border-radius:999px;font-size:12px}
.price{font-size:clamp(28px,3.2vw,40px);font-weight:900;color:var(--brand-navy);margin:.15em 0}
.bullets{margin:16px 0 22px;display:grid;gap:10px}
.bullets li{list-style:none;position:relative;padding-left:26px;color:#2C3E50}
.bullets li::before{content:"•";position:absolute;left:8px;color:var(--brand-teal);font-weight:900}
.most-popular{border:2px solid var(--brand-teal);transform:scale(1.02)}
.most-popular .pill{background:linear-gradient(135deg,var(--brand-teal),#18A1B2);color:#fff}

/* ---------- Features ---------- */
.features{grid-template-columns:repeat(3,minmax(0,1fr))}
.feature{background:#fff;border:1px solid #E7EFF6;border-radius:14px;padding:18px}
.feature h4{margin:.4em 0 .3em;color:var(--brand-navy)}
.feature p{margin:0;color:var(--muted)}

/* ---------- CF7 Form Styling ---------- */
.wpcf7 form{
  background:#fff;border:1px solid #E7EFF6;border-radius:18px;padding:22px;box-shadow:var(--shadow)
}
.wpcf7 label{font-weight:700;font-size:14px;color:#2A3B47;display:block;margin-top:10px}
.wpcf7 input,.wpcf7 select,.wpcf7 textarea{
  width:100%;padding:12px 12px;margin-top:6px;border:1px solid #D9E7EE;border-radius:12px;background:#FBFEFF
}
.wpcf7 input:focus,.wpcf7 select:focus,.wpcf7 textarea:focus{outline:3px solid var(--ring);border-color:var(--brand-teal)}
.wpcf7 textarea{min-height:120px;resize:vertical}
.wpcf7 .wpcf7-submit{margin-top:12px;background-color:var(--brand-teal)}
.wpcf7 .wpcf7-submit.cta{border:none;cursor:pointer}

/* ---------- FAQ ---------- */
.faq{max-width:900px;margin-inline:auto}
details{background:#fff;border:1px solid #E7EFF6;border-radius:14px;padding:16px}
details+details{margin-top:12px}
summary{cursor:pointer;font-weight:800;color:var(--brand-navy)}
details p{color:var(--muted);margin:.6em 0 0}

/* ---------- Footer ---------- */
.site-footer{background:#0F2A3A;color:#CFE8E5}
.site-footer a{color:#CFE8E5}
.foot{display:flex;gap:18px;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}
.tiny{font-size:12px;color:#A9C9C5;margin-top:8px}

/* ---------- Responsive ---------- */
@media (max-width: 960px){
  .hero-wrap{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .features{grid-template-columns:1fr 1fr}
  .pricing{grid-template-columns:1fr}
}