/*
Theme Name: Zuetech Technology Solutions
Theme URI: https://zuetechtechnologysolutions.com
Author: Zuetech Technology Solutions
Author URI: https://zuetechtechnologysolutions.com
Description: Custom one-page theme for Zuetech Technology Solutions -- IT support, networking, cybersecurity, cloud, telephony, CCTV and procurement services for companies, SMEs and individuals in Harare, Zimbabwe.
Version: 1.2
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: zuetech
*/

:root{
    --ink:#0C1420;
    --ink-2:#121E30;
    --ink-3:#182742;
    --line-dark:#26374F;
    --paper:#EEF1F5;
    --paper-2:#FFFFFF;
    --line-light:#D7DEE6;
    --text-dark:#0C1420;
    --text-dark-muted:#57647A;
    --text-light:#E7ECF3;
    --text-light-muted:#8FA0B8;
    --accent:#33C7B0;
    --accent-strong:#26A492;
    --status:#E8A33D;
    --whatsapp:#25D366;
    --radius-s:4px;
    --radius-m:8px;
    --container:1160px;
    --ff-display:'Space Grotesk', system-ui, sans-serif;
    --ff-body:'IBM Plex Sans', system-ui, sans-serif;
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:var(--ff-body);
    color:var(--text-dark);
    background:var(--paper);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  body::before{
    content:"";position:fixed;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg, var(--accent-strong), var(--accent), var(--accent-strong));
    z-index:999;
  }
  .bg-grid{
    background-image:
      linear-gradient(rgba(231,236,243,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(231,236,243,0.05) 1px, transparent 1px);
    background-size:44px 44px;
  }
  h1,h2,h3{
    font-family:var(--ff-display);
    font-weight:600;
    line-height:1.12;
    margin:0 0 0.5em;
    letter-spacing:-0.01em;
    text-rendering:optimizeLegibility;
  }
  h1{letter-spacing:-0.02em;}
  p{margin:0 0 1em;}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  ul{margin:0;padding:0;list-style:none;}
  button{font-family:inherit;}

  :focus-visible{outline:2px solid var(--accent);outline-offset:3px;}

  .skip-link{
    position:absolute;left:-999px;top:auto;
    background:var(--accent);color:var(--ink);
    padding:0.75em 1.25em;border-radius:var(--radius-s);
    font-weight:600;z-index:200;
  }
  .skip-link:focus{left:1rem;top:1rem;}

  .container{
    max-width:var(--container);
    margin:0 auto;
    padding:0 clamp(1.25rem, 4vw, 2.5rem);
  }

  section{scroll-margin-top:84px;}

  /* ---------- Header ---------- */
  header.site-header{
    position:sticky;top:0;z-index:100;
    background:rgba(12,20,32,0.92);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line-dark);
    transition:box-shadow 0.2s ease;
  }
  header.site-header.scrolled{
    box-shadow:0 12px 30px -18px rgba(0,0,0,0.55);
  }
  .header-row{
    display:flex;align-items:center;justify-content:space-between;
    height:72px;
    transition:height 0.2s ease;
  }
  header.site-header.scrolled .header-row{height:60px;}
  .wordmark{
    font-family:var(--ff-display);
    color:var(--text-light);
    display:flex;align-items:center;gap:0.55rem;
  }
  .wordmark .dot{
    width:8px;height:8px;border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 0 4px rgba(51,199,176,0.18);
    flex:none;
  }
  .wordmark-text{display:flex;flex-direction:column;line-height:1.15;}
  .wordmark-primary{font-weight:700;font-size:1.05rem;}
  .wordmark-secondary{font-weight:500;font-size:0.66rem;letter-spacing:0.02em;color:var(--text-light-muted);}
  nav.primary-nav ul{
    display:flex;gap:2rem;align-items:center;
  }
  nav.primary-nav a{
    color:var(--text-light-muted);
    font-size:0.95rem;font-weight:500;
    padding:0.4rem 0.1rem;
    border-bottom:2px solid transparent;
    transition:color 0.15s ease, border-color 0.15s ease;
  }
  nav.primary-nav a:hover{color:var(--text-light);border-color:var(--accent);}
  nav.primary-nav a.active{color:var(--text-light);border-color:var(--accent);}
  .header-actions{display:flex;align-items:center;gap:1.25rem;}
  .btn-call-header{
    color:var(--text-light);
    font-size:0.9rem;font-weight:600;
    border:1px solid var(--line-dark);
    padding:0.55rem 1.1rem;border-radius:var(--radius-s);
    white-space:nowrap;
    transition:border-color 0.15s ease, background 0.15s ease;
  }
  .btn-call-header:hover{border-color:var(--accent);background:rgba(51,199,176,0.08);}
  .status-pill{
    display:flex;align-items:center;gap:0.55rem;
    font-size:0.8rem;color:var(--text-light-muted);
    border:1px solid var(--line-dark);
    padding:0.42rem 0.85rem;border-radius:100px;
    white-space:nowrap;
  }
  .status-pill-dot{
    width:7px;height:7px;flex:none;border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 0 3px rgba(51,199,176,0.16);
    animation:pulse-dot 2.4s ease-in-out infinite;
  }

  .nav-toggle{
    display:none;
    background:none;border:1px solid var(--line-dark);
    border-radius:var(--radius-s);
    width:42px;height:42px;
    align-items:center;justify-content:center;
    cursor:pointer;
  }
  .nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
    content:"";display:block;width:18px;height:2px;background:var(--text-light);
    position:relative;transition:transform 0.2s ease, opacity 0.2s ease;
  }
  .nav-toggle span::before{position:absolute;top:-6px;}
  .nav-toggle span::after{position:absolute;top:6px;}
  .nav-toggle[aria-expanded="true"] span{background:transparent;}
  .nav-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

  /* ---------- Buttons / links ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;
    font-weight:600;font-size:0.95rem;
    padding:0.85rem 1.6rem;border-radius:var(--radius-s);
    transition:transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  }
  .btn-solid{background:var(--accent);color:var(--ink);box-shadow:0 1px 0 rgba(0,0,0,0);}
  .btn-solid:hover{background:var(--accent-strong);transform:translateY(-2px);box-shadow:0 12px 24px -10px rgba(51,199,176,0.55);}
  .btn-solid:active{transform:translateY(0);box-shadow:0 4px 10px -6px rgba(51,199,176,0.5);}
  .btn-outline{border:1px solid var(--line-dark);color:var(--text-light);}
  .btn-outline:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px);}
  .btn-outline:active{transform:translateY(0);}
  .text-link{
    display:inline-block;font-weight:600;color:var(--accent-strong);
    border-bottom:1px solid rgba(38,164,146,0.4);
    padding-bottom:2px;
    transition:border-color 0.15s ease;
  }
  .text-link:hover{border-color:var(--accent-strong);}

  /* ---------- Hero ---------- */
  .hero{
    background:var(--ink);
    color:var(--text-light);
    padding:clamp(3.5rem,8vw,6rem) 0 clamp(3rem,6vw,5rem);
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:clamp(2rem,5vw,4rem);
    align-items:center;
  }
  .hero h1{
    font-size:clamp(2.25rem,4.4vw,3.4rem);
    max-width:14ch;
  }
  .hero .lede{
    color:var(--text-light-muted);
    font-size:1.08rem;
    max-width:46ch;
    margin-bottom:2rem;
  }
  .hero-actions{display:flex;flex-wrap:wrap;gap:1rem;}

  /* ---------- Shared icon chip ---------- */
  .icon-chip{
    display:flex;align-items:center;justify-content:center;
    flex:none;border-radius:50%;
    background:radial-gradient(circle at 35% 30%, rgba(51,199,176,0.22), rgba(51,199,176,0.06));
    border:1px solid rgba(51,199,176,0.3);
    color:var(--accent-strong);
  }
  .icon-chip svg{width:52%;height:52%;}

  /* ---------- Support console (hero widget) ---------- */
  .hero-art{position:relative;}
  .hero-art::before{
    content:"";position:absolute;inset:-70px;
    background:radial-gradient(circle at 55% 45%, rgba(51,199,176,0.3), transparent 65%);
    filter:blur(50px);z-index:0;
  }
  .console{
    position:relative;z-index:1;
    background:var(--ink-3);
    border:1px solid var(--line-dark);
    border-radius:var(--radius-m);
    padding:1.5rem;
    max-width:420px;
    margin-left:auto;
    box-shadow:0 30px 60px -25px rgba(0,0,0,0.6);
  }
  .console-head{
    display:flex;align-items:center;gap:0.6rem;
    padding-bottom:1rem;margin-bottom:0.25rem;
    border-bottom:1px solid var(--line-dark);
  }
  .console-dot{
    width:8px;height:8px;flex:none;border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 0 4px rgba(51,199,176,0.16);
    animation:pulse-dot 2.4s ease-in-out infinite;
  }
  .console-title{font-weight:600;font-size:0.95rem;color:var(--text-light);}
  .console-live{
    margin-left:auto;font-size:0.72rem;font-weight:600;
    color:var(--accent);border:1px solid rgba(51,199,176,0.35);
    padding:0.15rem 0.55rem;border-radius:100px;
  }
  .console-tickets li{
    display:flex;align-items:center;gap:0.75rem;
    padding:0.85rem 0;border-top:1px solid var(--line-dark);
    opacity:0;transform:translateY(6px);
    animation:ticket-in 0.5s ease forwards;
  }
  .console-tickets li.d2{animation-delay:0.5s;}
  .console-tickets li.d3{animation-delay:0.85s;}
  .ticket-id{
    font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;
    font-size:0.78rem;color:var(--text-light-muted);flex:none;
  }
  .ticket-desc{
    flex:1;font-size:0.86rem;color:var(--text-light);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .badge{
    flex:none;font-size:0.72rem;font-weight:600;
    padding:0.25rem 0.6rem;border-radius:100px;white-space:nowrap;
  }
  .badge-open{color:var(--accent);border:1px solid rgba(51,199,176,0.4);}
  .badge-progress{color:var(--status);border:1px solid rgba(232,163,61,0.4);}
  .badge-resolved{color:var(--text-light-muted);border:1px solid var(--line-dark);}
  .console-foot{
    display:flex;gap:2rem;
    margin-top:0.6rem;padding-top:1rem;
    border-top:1px solid var(--line-dark);
  }
  .foot-figure{display:block;font-family:var(--ff-display);font-weight:600;font-size:1.15rem;color:var(--text-light);font-variant-numeric:tabular-nums;}
  .foot-label{display:block;font-size:0.76rem;color:var(--text-light-muted);margin-top:0.15rem;}

  /* ---------- Stats strip ---------- */
  .stats-strip{
    background:var(--ink-2);
    border-top:1px solid var(--line-dark);
    border-bottom:1px solid var(--line-dark);
    padding:clamp(2.25rem,4vw,3rem) 0;
  }
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);}
  .stat{
    display:flex;flex-direction:column;gap:0.5rem;
    padding-left:1.75rem;border-left:1px solid var(--line-dark);
  }
  .stat:first-child{padding-left:0;border-left:none;}
  .stat-icon{color:var(--accent);width:20px;height:20px;}
  .stat-figure{font-family:var(--ff-display);font-weight:600;font-size:clamp(1.4rem,2.4vw,1.85rem);color:var(--text-light);font-variant-numeric:tabular-nums;}
  .stat-label{font-size:0.85rem;color:var(--text-light-muted);}

  /* ---------- Who we serve ---------- */
  .subsection-title{font-family:var(--ff-display);font-size:1.2rem;font-weight:600;margin-bottom:0.4rem;color:var(--text-dark);}
  .subsection-title.on-dark{color:var(--text-light);}
  .who-we-serve{
    margin-top:clamp(2rem,4vw,2.75rem);
    padding-top:clamp(2rem,4vw,2.75rem);
    border-top:1px solid var(--line-dark);
  }
  .who-we-serve-intro{color:var(--text-light-muted);font-size:0.95rem;max-width:56ch;margin-bottom:1.5rem;}
  .who-we-serve-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
  .audience-card{
    background:var(--ink-3);border:1px solid var(--line-dark);
    border-radius:var(--radius-m);padding:1.5rem;
    transition:border-color 0.18s ease, transform 0.18s ease;
  }
  .audience-card:hover{border-color:rgba(51,199,176,0.4);transform:translateY(-3px);}
  .audience-card .icon-chip{width:44px;height:44px;margin-bottom:1rem;}
  .audience-card h4{font-family:var(--ff-display);font-size:1.05rem;font-weight:600;color:var(--text-light);margin:0 0 0.5rem;}
  .audience-card p{font-size:0.9rem;color:var(--text-light-muted);margin:0;}

  /* ---------- How support works ---------- */
  .how-it-works{
    background:var(--paper-2);
    padding:clamp(3rem,6vw,5rem) 0;
    border-top:1px solid var(--line-light);
    border-bottom:1px solid var(--line-light);
  }
  .steps{
    display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;
    position:relative;counter-reset:none;
  }
  .steps::before{
    content:"";position:absolute;top:17px;left:0;right:0;height:1px;
    background:var(--line-light);
  }
  .step-index{
    position:relative;z-index:1;
    display:inline-flex;align-items:center;justify-content:center;
    width:34px;height:34px;border-radius:50%;
    background:var(--paper-2);
    border:1px solid var(--accent-strong);color:var(--accent-strong);
    font-family:var(--ff-display);font-weight:600;font-size:0.92rem;
    margin-bottom:1rem;
  }
  .steps h3{font-size:1.1rem;}
  .steps p{color:var(--text-dark-muted);font-size:0.95rem;margin:0;}

  /* ---------- Section headers ---------- */
  .section-head{max-width:640px;margin-bottom:clamp(2.25rem,4vw,3.25rem);}
  .section-head.on-dark h2{color:var(--text-light);}
  .section-head.on-dark p{color:var(--text-light-muted);}
  .section-head h2{font-size:clamp(1.75rem,3vw,2.3rem);}
  .section-head p{color:var(--text-dark-muted);font-size:1.05rem;}

  /* ---------- Services ---------- */
  .services{background:var(--paper);padding:clamp(3.5rem,7vw,6rem) 0;}
  .service-grid-primary{
    display:grid;grid-template-columns:1fr 1fr;gap:1.75rem;
    margin-bottom:clamp(3rem,5vw,4rem);
  }
  .service-card{
    background:var(--paper-2);
    border:1px solid var(--line-light);
    border-radius:var(--radius-m);
    padding:clamp(1.75rem,3vw,2.25rem);
    transition:border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  }
  .service-card:hover{
    border-color:rgba(51,199,176,0.4);
    transform:translateY(-4px);
    box-shadow:0 20px 40px -22px rgba(12,20,32,0.28);
  }
  .service-card .icon-chip{width:56px;height:56px;margin-bottom:1.25rem;}
  .service-card h3{font-size:1.35rem;color:var(--text-dark);}
  .service-card p{color:var(--text-dark-muted);}
  .tag-row{display:flex;flex-wrap:wrap;gap:0.6rem;margin:1.1rem 0 1.3rem;}
  .tag{
    font-size:0.82rem;font-weight:500;
    padding:0.35rem 0.75rem;
    border:1px solid rgba(51,199,176,0.22);
    border-radius:100px;
    color:var(--accent-strong);
    background:rgba(51,199,176,0.07);
  }
  .more-services-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap;}
  .more-services-head p{color:var(--text-dark-muted);font-size:0.95rem;margin:0;}
  .service-grid-secondary{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;}
  .service-card-mini{
    background:var(--paper-2);
    border:1px solid var(--line-light);
    border-radius:var(--radius-m);
    padding:1.5rem;
    transition:border-color 0.18s ease, transform 0.18s ease;
  }
  .service-card-mini:hover{border-color:rgba(51,199,176,0.4);transform:translateY(-3px);}
  .service-card-mini .icon-chip{width:44px;height:44px;margin-bottom:1rem;}
  .service-card-mini h4{font-family:var(--ff-display);font-size:1.02rem;font-weight:600;color:var(--text-dark);margin:0 0 0.4rem;}
  .service-card-mini p{font-size:0.88rem;color:var(--text-dark-muted);margin:0;}

  /* ---------- About ---------- */
  .about{background:var(--ink-2);color:var(--text-light);padding:clamp(3.5rem,7vw,6rem) 0;}
  .about-grid{
    display:grid;grid-template-columns:1.15fr 0.85fr;
    gap:clamp(2.5rem,5vw,4rem);
  }
  .about-copy p{color:var(--text-light-muted);font-size:1.02rem;max-width:56ch;}
  .capability-list li{
    display:flex;gap:1rem;align-items:flex-start;
    padding:1.1rem 0;
    border-top:1px solid var(--line-dark);
  }
  .capability-list li:last-child{border-bottom:1px solid var(--line-dark);}
  .capability-list .icon-chip{width:40px;height:40px;margin-top:0.1rem;}
  .capability-list span.label{font-weight:500;color:var(--text-light);}

  /* ---------- Why choose us ---------- */
  .why{background:var(--paper);padding:clamp(3.5rem,7vw,6rem) 0;}
  .why-list li{
    display:grid;grid-template-columns:minmax(0,320px) 1fr;
    gap:2rem;padding:1.75rem 0;
    border-top:1px solid var(--line-light);
  }
  .why-list li:last-child{border-bottom:1px solid var(--line-light);}
  .why-title{display:flex;align-items:center;gap:0.9rem;}
  .why-title .icon-chip{width:40px;height:40px;}
  .why-list h3{font-size:1.2rem;margin-bottom:0;}
  .why-list p{color:var(--text-dark-muted);margin:0;max-width:52ch;}

  /* ---------- CTA band ---------- */
  .cta-band{
    position:relative;
    background:linear-gradient(135deg, var(--ink-3), var(--ink) 65%);
    overflow:hidden;
    padding:clamp(3rem,6vw,4.5rem) 0;
  }
  .cta-band::before{
    content:"";position:absolute;inset:-40% -10%;
    background:radial-gradient(circle at 25% 30%, rgba(51,199,176,0.32), transparent 60%);
    filter:blur(60px);
  }
  .cta-band .container{
    position:relative;z-index:1;
    display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2rem;
  }
  .cta-band h2{color:var(--text-light);font-size:clamp(1.6rem,3vw,2.1rem);margin-bottom:0.5rem;max-width:20ch;}
  .cta-band p{color:var(--text-light-muted);margin:0;max-width:42ch;}
  .cta-band-actions{display:flex;gap:1rem;flex-wrap:wrap;flex:none;}

  /* ---------- FAQ ---------- */
  .faq{background:var(--paper-2);padding:clamp(3.5rem,7vw,6rem) 0;}
  .faq-list{border-top:1px solid var(--line-light);max-width:840px;}
  .faq-item{border-bottom:1px solid var(--line-light);padding:1.25rem 0;}
  .faq-item summary{
    display:flex;align-items:center;justify-content:space-between;gap:1.25rem;
    cursor:pointer;list-style:none;
    font-family:var(--ff-display);font-weight:600;font-size:1.05rem;color:var(--text-dark);
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-toggle{
    flex:none;width:24px;height:24px;border-radius:50%;
    border:1px solid var(--line-light);position:relative;
  }
  .faq-toggle::before,.faq-toggle::after{
    content:"";position:absolute;top:50%;left:50%;
    background:var(--accent-strong);
    transform:translate(-50%,-50%);
  }
  .faq-toggle::before{width:10px;height:1.5px;}
  .faq-toggle::after{width:1.5px;height:10px;transition:transform 0.15s ease;}
  .faq-item[open] .faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg) scaleY(0);}
  .faq-item p{margin:0.85rem 0 0;color:var(--text-dark-muted);max-width:68ch;}

  /* ---------- Contact ---------- */
  .contact{background:var(--ink);color:var(--text-light);padding:clamp(3.5rem,7vw,6rem) 0;}
  .contact-grid{
    display:grid;grid-template-columns:0.85fr 1.15fr;
    gap:clamp(2rem,4vw,3rem);
    align-items:start;
  }
  .contact-card{
    background:var(--ink-3);border:1px solid var(--line-dark);
    border-radius:var(--radius-m);
    padding:clamp(1.75rem,3vw,2.25rem);
  }
  .status-line{display:flex;align-items:center;gap:0.6rem;margin-bottom:0.75rem;}
  .status-dot{width:8px;height:8px;border-radius:50%;background:var(--status);box-shadow:0 0 0 4px rgba(232,163,61,0.16);}
  .status-line span{font-size:0.85rem;font-weight:600;color:var(--status);letter-spacing:0.02em;}
  .contact-card h3{font-size:1.15rem;margin-bottom:0.4rem;}
  .contact-card > p{color:var(--text-light-muted);font-size:0.95rem;}
  .contact-card .btn{width:100%;margin:1.1rem 0 1.6rem;}
  .contact-detail{padding:1.1rem 0;border-top:1px solid var(--line-dark);}
  .contact-detail dt{font-size:0.8rem;color:var(--text-light-muted);margin-bottom:0.35rem;}
  .contact-detail dd{margin:0;font-weight:500;}
  .contact-detail dd + dd{margin-top:0.2rem;}

  .contact-form{
    background:var(--ink-3);border:1px solid var(--line-dark);
    border-radius:var(--radius-m);
    padding:clamp(1.75rem,3vw,2.5rem);
  }
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;}
  .field{display:flex;flex-direction:column;gap:0.4rem;margin-bottom:1.1rem;}
  .field.full{grid-column:1/-1;}
  .field label{font-size:0.85rem;color:var(--text-light-muted);}
  .field input,.field textarea{
    background:var(--ink-2);
    border:1px solid var(--line-dark);
    border-radius:var(--radius-s);
    padding:0.75rem 0.9rem;
    color:var(--text-light);
    font-family:inherit;font-size:0.95rem;
    resize:vertical;
  }
  .field input:focus,.field textarea:focus{border-color:var(--accent);}
  .form-note{font-size:0.82rem;color:var(--text-light-muted);margin-top:0.75rem;}
  .form-status{font-size:0.88rem;color:var(--accent);margin-top:0.75rem;min-height:1.2em;}

  /* ---------- Footer ---------- */
  footer{background:var(--ink-2);color:var(--text-light-muted);padding:clamp(3rem,6vw,4.5rem) 0 0;}
  .footer-grid{
    display:grid;grid-template-columns:1.3fr 0.8fr 0.8fr 1fr;
    gap:2.5rem;padding-bottom:2.75rem;
    border-bottom:1px solid var(--line-dark);
  }
  .footer-brand .wordmark{margin-bottom:1rem;}
  .footer-brand p{max-width:34ch;font-size:0.92rem;}
  footer h4{
    color:var(--text-light);font-size:0.85rem;
    font-weight:600;margin-bottom:1rem;
  }
  footer .footer-col li{margin-bottom:0.65rem;font-size:0.92rem;}
  footer .footer-col a:hover{color:var(--text-light);}
  .footer-bottom{
    display:flex;justify-content:space-between;align-items:center;
    flex-wrap:wrap;gap:0.75rem;
    padding:1.5rem 0;font-size:0.85rem;
  }

  /* ---------- WhatsApp float ---------- */
  .whatsapp-float{
    position:fixed;right:1.5rem;bottom:1.5rem;z-index:150;
    width:54px;height:54px;border-radius:50%;
    background:var(--whatsapp);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 8px 20px rgba(0,0,0,0.28);
    transition:transform 0.15s ease;
  }
  .whatsapp-float:hover{transform:scale(1.06);}
  .whatsapp-float svg{width:26px;height:26px;}
  body.nav-open .whatsapp-float{display:none;}

  /* ---------- Motion ---------- */
  @keyframes pulse-dot{
    0%,100%{opacity:1;}
    50%{opacity:0.4;}
  }
  @keyframes ticket-in{
    to{opacity:1;transform:translateY(0);}
  }

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    .console-tickets li{opacity:1;transform:none;animation:none;}
    .console-dot,.status-pill-dot{animation:none;}
    *{transition:none !important;}
  }

  /* ---------- Responsive ---------- */
  @media (max-width:900px){
    .hero-grid{grid-template-columns:1fr;}
    .hero-art{max-width:420px;margin:0 auto;}
    .about-grid{grid-template-columns:1fr;}
    .contact-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .why-list li{grid-template-columns:1fr;gap:0.5rem;}
    .stats-grid{grid-template-columns:1fr 1fr;row-gap:1.5rem;}
    .stat:nth-child(3){padding-left:0;border-left:none;}
    .who-we-serve-row{grid-template-columns:1fr;}
    .service-grid-primary{grid-template-columns:1fr;}
    .service-grid-secondary{grid-template-columns:1fr 1fr;}
    .steps{grid-template-columns:1fr 1fr;row-gap:2.25rem;}
    .steps::before{display:none;}
    .cta-band .container{flex-direction:column;align-items:flex-start;}
  }

  /* Header collapses to the mobile menu earlier than the content grid does —
     the full desktop nav (status pill + 5 links + call button) needs close to
     1000px of clear width to sit on one line without wrapping. */
  @media (max-width:1024px){
    .status-pill{display:none;}
    .btn-call-header{display:none;}
    .nav-toggle{display:flex;}

    nav.primary-nav{
      position:fixed;top:72px;left:0;right:0;bottom:0;
      background:var(--ink);
      transform:translateY(-8px);
      opacity:0;visibility:hidden;
      transition:opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
      padding:2rem clamp(1.25rem,4vw,2.5rem);
      overflow-y:auto;
    }
    nav.primary-nav.open{opacity:1;visibility:visible;transform:translateY(0);}
    nav.primary-nav ul{flex-direction:column;align-items:flex-start;gap:0.25rem;}
    nav.primary-nav a{display:block;width:100%;padding:0.9rem 0;font-size:1.05rem;border-bottom:1px solid var(--line-dark);}
  }

  @media (max-width:760px){
    .service-grid-secondary{grid-template-columns:1fr;}
    .form-grid{grid-template-columns:1fr;}
  }

  @media (max-width:520px){
    .footer-grid{grid-template-columns:1fr;}
    .footer-bottom{flex-direction:column;align-items:flex-start;}
    .stats-grid{grid-template-columns:1fr 1fr;}
    .stat:nth-child(2n+1){padding-left:0;border-left:none;}
    .stat:nth-child(2n){padding-left:1.75rem;border-left:1px solid var(--line-dark);}
    .steps{grid-template-columns:1fr;}
  }