/* ==========================================================================
     Simple Share Buttons: cool paper by default, with one blue accent.
     [data-theme="dark"] swaps to hue-neutral graphite. The token block below is the
     dark set; the light set that overrides it is the default the markup ships with.
     Deliberately restrained: a single saturated accent, a same-hue button ledge,
     and amber reserved for ratings. Every colour is a token so both themes stay
     in sync, and every text pair clears WCAG AA.
     ========================================================================== */
  :root{
    --bg:#15181D;
    --bg-deep:#0F1216;
    --surface:#1E222A;
    --surface-2:#272C35;
    --line:#333A45;
    --line-soft:#262B33;
    --text:#F3F5F8;
    --muted:#A6AEBA;

    --accent:#2F66EA;        /* blue: fills, borders, large display text */
    --accent-ink:#FFFFFF;    /* text on the accent */
    --accent-text:#8FB3FF;   /* the accent as small text on a dark ground */
    --ledge:#1B44B0;         /* deeper accent, raised-button ledge */
    --accent-2:#E8B33E;      /* amber: swash, ticks, one feature tile */
    --accent-2-ink:#2A1E00;
    --accent-3:#2FB47C;      /* green: pill, copy-confirm */
    --accent-3-ink:#032418;
    --star:#E8B33E;          /* review stars */

    --accent-wash:rgba(47,102,234,0.16);
    --glow-1:rgba(47,102,234,0.10);
    --glow-2:rgba(255,255,255,0.03);
    --hard:rgba(0,0,0,0.55);
    --tile-ring:rgba(255,255,255,0.20);

    /* Code panels stay dark in both themes. */
    --code-bg:#0F1216;
    --code-line:#2A313B;
    --code-text:#E9EDF3;

    --maxw:1120px;
    --ff-display:'Bricolage Grotesque','Plus Jakarta Sans',sans-serif;
    --ff-body:'Plus Jakarta Sans',system-ui,sans-serif;
    --ff-mono:'JetBrains Mono',ui-monospace,monospace;
  }

  [data-theme="light"]{
    --bg:#F6F8FB;
    --bg-deep:#EAEFF6;
    --surface:#FFFFFF;
    --surface-2:#EDF2F9;
    --line:#D8E0EA;
    --line-soft:#E8EEF5;
    --text:#131822;
    --muted:#5B6675;

    --accent:#1F55D6;
    --accent-ink:#FFFFFF;
    --accent-text:#1F55D6;
    --ledge:#143C9E;
    --accent-2:#E1A62A;
    --accent-2-ink:#2A1E00;
    --accent-3:#0A7A54;
    --accent-3-ink:#FFFFFF;
    --star:#96690A;

    --accent-wash:rgba(31,85,214,0.10);
    --glow-1:rgba(31,85,214,0.08);
    --glow-2:rgba(0,0,0,0.02);
    --hard:rgba(19,24,34,0.16);
    --tile-ring:rgba(0,0,0,0.16);
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; }
  }

  body{
    margin:0;
    font-family:var(--ff-body);
    color:var(--text);
    background:var(--bg);
    -webkit-font-smoothing:antialiased;
    line-height:1.55;
    background-image:
      radial-gradient(760px 420px at 12% -6%, var(--glow-1), transparent 70%),
      radial-gradient(620px 380px at 92% 4%, var(--glow-2), transparent 70%);
    background-repeat:no-repeat;
  }
  a{ color:inherit; }
  button{ font-family:inherit; }
  :focus-visible{ outline:2.5px solid var(--accent); outline-offset:2px; border-radius:4px; }

  .wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }
  code, .mono{ font-family:var(--ff-mono); }

  h1,h2,h3,h4{ font-family:var(--ff-display); }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0;
    background:var(--bg);
    background:color-mix(in srgb, var(--bg) 82%, transparent);
    backdrop-filter:blur(12px) saturate(1.3);
    border-bottom:1px solid var(--line);
    z-index:50;
  }
  .nav{ display:flex; align-items:center; justify-content:space-between; height:88px; gap:16px; }
  .logo{ display:flex; align-items:center; text-decoration:none; flex-shrink:0; }
  .logo-img{
    display:block; height:54px; width:auto; aspect-ratio:393.16/107.78;
    color:var(--text);
  }
  .footer-brand .logo-img{ height:46px; }
  .nav-links{ display:flex; align-items:center; gap:8px; font-size:14.5px; }
  .nav-links a{
    text-decoration:none; color:var(--muted); font-weight:600;
    padding:8px 12px; border-radius:8px; transition:color .15s ease, background .15s ease;
  }
  .nav-links a:hover{ color:var(--text); background:var(--surface); }
  .nav-cta{
    background:var(--accent) !important; color:var(--accent-ink) !important;
    padding:10px 18px !important; border-radius:999px !important; font-weight:800 !important;
    transition:transform .15s ease, box-shadow .15s ease !important;
    box-shadow:0 3px 0 0 var(--ledge);
  }
  .nav-cta:hover{ transform:translateY(-2px); box-shadow:0 5px 0 0 var(--ledge); }

  .theme-toggle{
    width:38px; height:38px; flex-shrink:0;
    display:inline-flex; align-items:center; justify-content:center;
    background:var(--surface); border:1px solid var(--line);
    border-radius:10px; cursor:pointer; color:var(--text);
    transition:border-color .15s ease, color .15s ease, transform .15s ease;
  }
  .theme-toggle:hover{ border-color:var(--accent); color:var(--accent-text); transform:rotate(-12deg); }
  .theme-toggle svg{ width:17px; height:17px; }
  .theme-toggle .icon-sun{ display:none; }
  .theme-toggle .icon-moon{ display:block; }
  [data-theme="light"] .theme-toggle .icon-sun{ display:block; }
  [data-theme="light"] .theme-toggle .icon-moon{ display:none; }
  @media (max-width:700px){ .nav-links a:not(.nav-cta){ display:none; } }

  /* ---------- Hero ---------- */
  .hero-intro{ padding:76px 0 48px; }
  .eyebrow{
    font-size:12.5px; font-weight:800; letter-spacing:0.04em; text-transform:uppercase;
    display:inline-flex; align-items:center; gap:9px; margin-bottom:26px;
    color:var(--accent-text); background:var(--accent-wash);
    border:1px solid var(--accent);
    border-color:color-mix(in srgb, var(--accent) 32%, transparent);
    padding:7px 15px; border-radius:999px;
  }
  .eyebrow::before{
    content:''; width:7px; height:7px; border-radius:50%; background:var(--accent);
    box-shadow:0 0 0 4px var(--accent-wash);
  }
  h1{
    font-weight:800; font-size:clamp(44px, 7.6vw, 88px); line-height:0.92;
    letter-spacing:-0.045em; margin:0 0 22px; max-width:20ch;
  }
  h1 .swash{
    color:var(--accent); position:relative; white-space:nowrap;
  }
  h1 .swash::after{
    content:''; position:absolute; left:0; right:0; bottom:0.04em; height:0.12em;
    background:var(--accent-2); border-radius:999px;
  }
  .hero-sub{ font-size:18.5px; color:var(--muted); max-width:54ch; margin:0; font-weight:500; }
  .hero-sub strong{ color:var(--text); font-weight:800; }

  /* ---------- Builder ---------- */
  .builder{
    display:grid; grid-template-columns:352px 1fr; gap:0;
    border:2px solid var(--line); border-radius:22px; overflow:hidden;
    margin-top:44px; background:var(--surface);
    box-shadow:0 10px 0 -2px var(--hard);
  }
  .builder-left{
    padding:30px; border-right:2px solid var(--line);
    background:var(--bg-deep);
    display:flex; flex-direction:column; gap:28px;
  }
  .builder-right{
    padding:30px 34px 34px; display:flex; flex-direction:column; gap:20px; min-width:0;
  }
  @media (max-width:860px){
    .builder{ grid-template-columns:1fr; }
    .builder-left{ border-right:none; border-bottom:2px solid var(--line); }
  }

  .style-card{
    border:2px solid var(--line); background:var(--surface);
    border-radius:14px; padding:15px 17px; cursor:pointer;
    display:flex; align-items:flex-start; gap:13px;
    transition:border-color .15s ease, transform .15s ease, box-shadow .15s ease;
  }
  .style-card + .style-card{ margin-top:11px; }
  .style-card:hover{ border-color:color-mix(in srgb, var(--accent) 55%, var(--line)); }
  .style-card.active{
    border-color:var(--accent);
    box-shadow:4px 4px 0 0 var(--accent);
    transform:translate(-1px,-1px);
  }
  .style-card .radio{
    width:18px; height:18px; border-radius:50%; border:2.5px solid var(--line);
    flex-shrink:0; margin-top:3px; position:relative; transition:border-color .15s ease;
  }
  .style-card.active .radio{ border-color:var(--accent); }
  .style-card.active .radio::after{
    content:''; position:absolute; inset:3px; border-radius:50%; background:var(--accent);
  }
  .style-card h4{ font-size:15.5px; font-weight:800; margin:0 0 4px; letter-spacing:-0.02em; }
  .style-card p{ font-size:13px; color:var(--muted); margin:0; line-height:1.5; font-weight:500; }

  .control-block{ display:flex; flex-direction:column; gap:11px; }
  .control-label{
    font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:0.09em;
    color:var(--text); display:inline-flex; align-items:center; gap:8px;
  }
  .control-label::before{
    content:''; width:14px; height:3px; border-radius:999px; background:var(--accent-2);
  }
  .chip-row{ display:flex; flex-wrap:wrap; gap:7px; }
  .chip{
    font-size:12.5px; font-weight:700; padding:7px 13px;
    border:1.5px solid var(--line); background:var(--surface); border-radius:999px;
    cursor:pointer; color:var(--muted);
    transition:background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
    display:inline-flex; align-items:center; gap:7px;
  }
  .chip:hover{ border-color:var(--accent); color:var(--text); transform:translateY(-1px); }
  .chip.active{
    background:var(--accent); color:var(--accent-ink); border-color:var(--accent);
  }
  .chip .dot{ width:6px; height:6px; border-radius:50%; background:currentColor; opacity:0; }
  .chip.active .dot{ opacity:1; background:var(--accent-ink); }
  .chip .chip-icon{
    width:19px; height:19px; flex:0 0 auto;
    border-radius:5px; display:flex; align-items:center; justify-content:center;
    box-shadow:0 0 0 1px var(--tile-ring) inset;
  }
  .chip .chip-icon svg{ display:block; width:62%; height:62%; }
  .chip:has(.chip-icon){ padding:5px 13px 5px 6px; gap:8px; }

  .more-row{
    display:grid; grid-template-rows:0fr; opacity:0;
    transition:grid-template-rows .22s ease, opacity .18s ease, margin-top .22s ease;
    margin-top:-11px;
  }
  .more-row > .chip-row-inner{ overflow:hidden; display:flex; flex-wrap:wrap; gap:7px; }
  .more-row.expanded{ grid-template-rows:1fr; opacity:1; margin-top:0; }
  .more-toggle{
    display:inline-flex; align-items:center; gap:7px;
    font-size:12.5px; font-weight:800; color:var(--accent-text);
    background:none; border:none; padding:2px 0; cursor:pointer;
    align-self:flex-start; transition:gap .15s ease;
  }
  .more-toggle:hover{ gap:11px; }
  .more-toggle svg{ width:13px; height:13px; transition:transform .22s ease; }
  .more-toggle.expanded svg{ transform:rotate(180deg); }

  .control-note{
    font-size:12px; color:var(--muted); margin:0; line-height:1.55; font-weight:500;
    padding:10px 12px; border-radius:10px;
    background:var(--surface);
    background:color-mix(in srgb, var(--accent-2) 12%, transparent);
    border-left:3px solid var(--accent-2);
  }
  .control-block[hidden]{ display:none; }

  /* ---------- Right: preview + code ---------- */
  .preview-title{ font-size:20px; font-weight:800; margin:0; letter-spacing:-0.025em; }
  .preview-area{
    border:2px dashed var(--line); border-radius:16px; padding:30px;
    display:flex; align-items:center; justify-content:center;
    background:var(--bg-deep);
    min-height:120px;
  }
  .btn-bar{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; align-items:center; }
  .btn-bar.stack{ flex-direction:column; flex-wrap:nowrap; }
  .btn-bar.stack.align-left{ align-items:flex-start; }
  .btn-bar.stack.align-right{ align-items:flex-end; }
  .st-btn{
    display:inline-flex; align-items:center; overflow:hidden;
    color:#fff; border-radius:6px; cursor:grab;
    transition:transform .15s ease, opacity .15s ease, box-shadow .15s ease;
    -webkit-user-select:none; user-select:none;
  }
  .st-btn{ box-shadow:0 0 0 1px var(--tile-ring) inset; }
  .st-btn:hover{ transform:translateY(-3px) scale(1.04); }
  .st-btn.dragging{ opacity:.35; cursor:grabbing; }
  .st-btn.drop-target{ box-shadow:0 0 0 2px var(--accent); }
  .st-btn.dragging{ box-shadow:none; }
  .st-btn .st-icon{ display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
  .st-btn .st-icon svg{ display:block; width:56%; height:56%; }
  .st-btn .st-text{
    font-family:var(--ff-body); font-weight:800; line-height:1;
    white-space:nowrap; padding-right:.85em;
  }
  .st-total{
    display:inline-flex; flex-direction:column; align-items:center; justify-content:center;
    border:2px solid var(--line); border-radius:6px; background:var(--surface);
    color:var(--text); font-family:var(--ff-display); font-weight:800; line-height:1.15;
  }
  .st-total .st-total-label{
    font-family:var(--ff-body); font-weight:700; color:var(--muted);
    font-size:9px; text-transform:uppercase; letter-spacing:.08em;
  }
  .preview-hint{
    font-size:12.5px; color:var(--muted); margin:0; text-align:center; font-weight:600;
  }

  .code-instruction{ font-size:14px; color:var(--muted); margin:4px 0 0; font-weight:500; }
  .code-instruction b{ color:var(--text); font-weight:800; }
  .code-instruction code{
    font-size:12.5px; background:var(--surface-2); color:var(--text);
    padding:2px 6px; border-radius:5px;
  }
  .code-panel{
    border-radius:14px; background:var(--code-bg); border:1.5px solid var(--code-line);
    padding:17px 19px;
    display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
  }
  .code-panel code{
    font-size:12.5px; color:var(--code-text);
    white-space:pre-wrap; overflow-wrap:anywhere;
    flex:1; min-width:0; line-height:1.65; display:block;
  }
  .code-panel .tag{ color:#8FB8FF; }
  .code-panel .attr{ color:var(--accent-2); }
  .code-panel .val{ color:#7FE7C6; }
  .copy-btn{
    flex-shrink:0; background:transparent; border:1.5px solid var(--code-line);
    color:var(--code-text); font-size:12.5px; font-weight:800;
    padding:8px 15px; border-radius:999px; cursor:pointer;
    transition:all .15s ease; margin-top:1px;
  }
  .copy-btn:hover{ border-color:var(--accent); color:var(--accent-text); }
  .copy-btn.copied{ background:var(--accent-3); border-color:var(--accent-3); color:var(--accent-3-ink); }

  .steps-block{ display:flex; flex-direction:column; gap:12px; margin-top:4px; }
  .steps-title{
    font-family:var(--ff-body);
    font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:0.09em;
    color:var(--text); display:inline-flex; align-items:center; gap:8px; margin:0;
  }
  .steps-title::before{
    content:''; width:14px; height:3px; border-radius:999px; background:var(--accent-2);
  }
  .steps{ margin:0; padding:0; list-style:none; display:grid; gap:12px; }
  .steps li{
    display:flex; gap:12px; font-size:14px; color:var(--muted);
    align-items:flex-start; font-weight:500;
  }
  .steps li .n{
    flex-shrink:0; width:24px; height:24px; border-radius:8px;
    background:var(--accent-wash); border:1.5px solid var(--accent);
    border-color:color-mix(in srgb, var(--accent) 40%, transparent);
    font-family:var(--ff-display); font-size:12px; font-weight:800; color:var(--accent-text);
    display:flex; align-items:center; justify-content:center; margin-top:1px;
  }
  .steps li span.t{ color:var(--text); font-weight:800; }

  /* ---------- Trust line ---------- */
  .trust-line{
    padding:60px 0; text-align:center;
    border-top:2px solid var(--line); border-bottom:2px solid var(--line);
    margin-top:64px; background:var(--surface);
  }
  .trust-line p{
    font-family:var(--ff-display); font-size:clamp(24px,3.6vw,40px); font-weight:800;
    letter-spacing:-0.035em; margin:0; color:var(--text); line-height:1.1;
  }
  .trust-line span{ color:var(--muted); }
  .trust-line b{ color:var(--accent); }

  /* ---------- Features ---------- */
  section.features{ padding:84px 0; }
  .section-head{ margin-bottom:44px; max-width:52ch; }
  .kicker{
    font-size:12.5px; font-weight:800; color:var(--accent-text);
    text-transform:uppercase; letter-spacing:0.09em; margin-bottom:12px;
  }
  h2{
    font-size:clamp(28px, 4.2vw, 46px); font-weight:800;
    letter-spacing:-0.04em; margin:0; line-height:1.02;
  }
  .feature-grid{
    display:grid; grid-template-columns:repeat(2, 1fr); gap:16px;
  }
  .feature{
    background:var(--surface); padding:32px 28px;
    border:2px solid var(--line); border-radius:18px;
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  }
  .feature:hover{
    transform:translate(-2px,-2px);
    box-shadow:6px 6px 0 0 var(--hard);
    border-color:color-mix(in srgb, var(--accent) 45%, var(--line));
  }
  .feature-icon{
    width:46px; height:46px; border-radius:13px;
    display:flex; align-items:center; justify-content:center; margin-bottom:20px;
  }
  .feature-icon svg{ width:21px; height:21px; }
  .feature:nth-child(1) .feature-icon{ background:var(--accent);   color:var(--accent-ink); }
  .feature:nth-child(2) .feature-icon{ background:var(--accent-2); color:var(--accent-2-ink); }
  .feature:nth-child(3) .feature-icon{ background:var(--accent-3); color:var(--accent-3-ink); }
  .feature:nth-child(4) .feature-icon{ background:var(--text);     color:var(--bg); }
  .feature h3{ font-size:18.5px; font-weight:800; margin:0 0 9px; letter-spacing:-0.025em; }
  .feature p{ color:var(--muted); font-size:14.5px; margin:0; line-height:1.6; font-weight:500; }
  @media (max-width:760px){ .feature-grid{ grid-template-columns:1fr; } }

  /* ---------- WordPress plugin ---------- */
  .wordpress-plugin{ padding:76px 0; }
  .wp-card{
    display:flex; align-items:center; justify-content:space-between; gap:44px;
    border:2px solid var(--line); border-radius:24px;
    background:var(--surface); padding:44px 48px;
    box-shadow:10px 10px 0 -2px var(--hard);
  }
  .wp-card-left{ max-width:46ch; }
  .tag-pill{
    display:inline-flex; font-size:11.5px; font-weight:800; text-transform:uppercase;
    letter-spacing:0.08em; padding:6px 14px; border-radius:999px;
    background:var(--accent-3); color:var(--accent-3-ink); margin-bottom:18px;
  }
  .wp-card-left h2{ margin-bottom:14px; }
  .wp-card-left p{ color:var(--muted); font-size:16px; margin:0 0 28px; font-weight:500; }
  .wp-btn{
    display:inline-flex; align-items:center; gap:9px;
    background:var(--text); color:var(--bg); text-decoration:none;
    padding:14px 22px; border-radius:999px; font-size:15.5px; font-weight:800;
    letter-spacing:-0.01em;
    transition:transform .15s ease, box-shadow .15s ease;
    box-shadow:0 4px 0 0 var(--ledge);
  }
  .wp-btn:hover{ transform:translateY(-2px); box-shadow:0 6px 0 0 var(--ledge); }
  .wp-btn svg{ width:15px; height:15px; }
  .wp-card-right{ display:flex; gap:36px; flex-shrink:0; }
  .wp-stat{ display:flex; flex-direction:column; align-items:center; text-align:center; }
  .wp-stat-num{
    font-family:var(--ff-display); font-size:clamp(30px,4vw,44px); font-weight:800;
    letter-spacing:-0.04em; color:var(--accent); line-height:1;
  }
  .wp-stat-label{
    font-size:11.5px; font-weight:700; color:var(--muted);
    text-transform:uppercase; letter-spacing:0.06em; margin-top:9px; white-space:nowrap;
  }
  @media (max-width:760px){
    .wp-card{ flex-direction:column; align-items:flex-start; padding:34px; }
    .wp-card-right{ width:100%; justify-content:space-between; gap:16px; }
  }

  /* ---------- Reviews ---------- */
  section.reviews{ padding:84px 0; }
  .reviews-head{
    display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap;
    gap:22px; margin-bottom:40px; max-width:none;
  }
  .reviews-head > div{ flex:1 1 300px; max-width:30ch; }
  .reviews-rating{
    display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--text);
    padding:13px 20px; border:2px solid var(--line); border-radius:999px;
    background:var(--surface); transition:transform .15s ease, box-shadow .15s ease;
  }
  .reviews-rating:hover{ transform:translateY(-2px); box-shadow:0 4px 0 0 var(--ledge); }
  .reviews-rating-num{ font-family:var(--ff-display); font-size:24px; font-weight:800; letter-spacing:-0.03em; }
  .reviews-stars{ color:var(--star); font-size:15px; letter-spacing:1px; }
  .reviews-rating-label{ font-size:12.5px; font-weight:700; color:var(--muted); white-space:nowrap; }
  .review-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; }
  .review-card{
    background:var(--surface); padding:28px 26px;
    border:2px solid var(--line); border-radius:18px;
    display:flex; flex-direction:column; gap:16px;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .review-card:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 0 var(--hard); }
  .review-stars{ color:var(--star); font-size:14px; letter-spacing:1.5px; }
  .review-card p{
    font-family:var(--ff-display); font-size:16px; color:var(--text); margin:0;
    line-height:1.5; flex:1; font-weight:500; letter-spacing:-0.015em;
  }
  .review-author{ display:flex; flex-direction:column; gap:2px; padding-top:12px; border-top:2px solid var(--line-soft); }
  .review-source{ font-size:11.5px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:0.05em; }
  @media (max-width:860px){ .review-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:600px){ .review-grid{ grid-template-columns:1fr; } .reviews-head{ align-items:flex-start; } }

  /* ---------- FAQ ---------- */
  section.faq{ padding:84px 0; }
  .faq-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:16px; }
  .faq-item{
    background:var(--surface); padding:28px 26px;
    border:2px solid var(--line); border-radius:18px;
  }
  .faq-item h3{
    font-size:17.5px; font-weight:800; margin:0 0 10px; letter-spacing:-0.02em;
    line-height:1.3;
  }
  .faq-item p{ color:var(--muted); font-size:14.5px; margin:0; line-height:1.6; font-weight:500; }
  .faq-item p + p{ margin-top:10px; }
  .faq-item code{
    font-size:12.5px; background:var(--surface-2); color:var(--text);
    padding:2px 6px; border-radius:5px;
  }
  @media (max-width:760px){ .faq-grid{ grid-template-columns:1fr; } }

  /* ---------- Heritage ---------- */
  .heritage{ padding:64px 0; }
  .heritage .wrap{ max-width:760px; }
  .heritage p{
    font-family:var(--ff-display); color:var(--muted); font-size:clamp(17px,2.2vw,22px);
    margin:0; text-align:center; line-height:1.5; font-weight:500; letter-spacing:-0.02em;
  }
  .heritage p span{ color:var(--accent); font-weight:800; }

  /* ---------- Footer ---------- */
  footer{ padding:60px 0 34px; border-top:2px solid var(--line); background:var(--bg-deep); }
  .footer-top{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:36px; margin-bottom:38px; }
  .footer-brand .logo{ margin-bottom:14px; }
  .footer-brand p{ color:var(--muted); font-size:14.5px; max-width:32ch; margin:0; font-weight:500; }
  .footer-links{ display:flex; gap:56px; }
  .footer-col h5{
    font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:0.09em;
    color:var(--accent-text); margin:0 0 16px;
  }
  .footer-col a{
    display:block; font-size:14.5px; font-weight:600; text-decoration:none;
    color:var(--text); margin-bottom:11px; transition:color .15s ease;
  }
  .footer-col a:hover{ color:var(--accent-text); }
  .footer-bottom{
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
    padding-top:26px; border-top:2px solid var(--line); font-size:13px;
    color:var(--muted); font-weight:600;
  }
  .powered-by{ display:flex; align-items:center; gap:8px; }
  .powered-by .st-mark{
    width:16px; height:16px; border-radius:5px; background:var(--accent-3); display:inline-block;
  }
  @media (max-width:600px){ .footer-links{ gap:32px; } .footer-top{ flex-direction:column; } }

  @media (max-width:560px){
    .nav-cta{ display:none; }
    .nav{ height:72px; gap:10px; }
    .logo-img{ height:40px; }
    .theme-toggle{ width:34px; height:34px; }

    .reviews-rating{ flex-wrap:wrap; border-radius:18px; padding:12px 18px; }
    .reviews-rating-label{ white-space:normal; }

    .wp-card-right{ flex-direction:column; align-items:flex-start; gap:22px; }
    .wp-stat{ align-items:flex-start; text-align:left; }
    .wp-stat-label{ white-space:normal; }

    .builder-left{ padding:22px; }
    .builder-right{ padding:22px 20px 26px; }
    .code-panel{ padding:14px; }
  }