/*
Theme Name: Affinity Accountancy
Author: Affinity Accountancy
Description: Affinity Accountancy website.
Version: 0.3.1
Requires at least: 5.6
Requires PHP: 7.3
Text Domain: affinity-accountancy
*/

    :root { --ink:#172b35; --muted:#52636b; --paper:#f7faf9; --white:#fff; --accent:#006e99; --line:#d9e2e4; --pale:#e9f5f8; --gold:#91b928; --acca-coral:#cf4b38; }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif; }
    a { color:inherit; }
    a:focus-visible, summary:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
    .skip { position:absolute; left:-9999px; top:0; background:var(--ink); color:white; padding:.6rem 1rem; z-index:5; }
    .skip:focus { left:1rem; top:1rem; }
    .wrap { width:min(1160px,calc(100% - 48px)); margin-inline:auto; }
    header { background:rgba(247,245,239,.96); border-bottom:1px solid var(--line); }
    .nav { display:flex; align-items:center; justify-content:space-between; gap:2rem; min-height:92px; }
    .brand { display:block; width:260px; flex:none; line-height:0; text-decoration:none; }
    .brand svg { width:100%; height:auto; }
    nav { display:flex; align-items:center; gap:1.7rem; font-size:.9rem; font-weight:600; }
    nav a:not(.button) { text-decoration:none; }
    nav a:not(.button):hover { color:var(--accent); }
    .button { display:inline-flex; align-items:center; justify-content:center; min-height:47px; padding:.7rem 1.2rem; border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:5px; text-decoration:none; font-weight:650; font-size:.91rem; line-height:1.3; transition:background .2s,transform .2s; }
    .button:hover { background:#075675; transform:translateY(-1px); }
    .button.alt { background:transparent; color:var(--accent); }
    .button.alt:hover { background:var(--pale); }
    .button[aria-disabled="true"] { opacity:.6; cursor:default; pointer-events:none; }
    .mobile-nav { display:none; }
    main h1,main h2,main h3 { font-family:Georgia,"Times New Roman",serif; font-weight:400; letter-spacing:-.043em; line-height:1.12; }
    .eyebrow { color:var(--accent); font-size:.76rem; text-transform:uppercase; letter-spacing:.18em; font-weight:750; }
    .hero { display:grid; grid-template-columns:1.1fr .9fr; min-height:622px; align-items:center; gap:6rem; padding-block:5rem; }
    h1 { max-width:700px; margin:1.25rem 0 1.45rem; font-size:clamp(3rem,5.2vw,5.45rem); }
    .lead { max-width:580px; color:var(--muted); font-size:1.15rem; line-height:1.7; }
    .actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
    .hero-art { position:relative; height:470px; border-radius:190px 190px 8px 8px; background:#dceef6; overflow:hidden; box-shadow:18px 19px 0 rgba(0,110,153,.08); }
    .hero-art svg { display:block; width:100%; height:100%; }
    .art-card { position:absolute; z-index:1; bottom:25px; left:0; width:72%; padding:1.2rem 1.5rem; background:#fff; border-radius:0 6px 6px 0; box-shadow:0 12px 40px rgba(18,44,47,.08); }
    .art-card span { color:var(--accent); font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
    .art-card strong { display:block; font:400 1.48rem/1.2 Georgia,serif; margin-top:.55rem; }
    .stripe { background:var(--ink); color:white; }
    .stripe .wrap { display:grid; grid-template-columns:1fr 1.2fr; align-items:center; gap:3rem; padding-block:3rem; }
    .stripe p { color:#e0e9ec; margin:0; font-size:1.04rem; }
    .stripe h2 { font-size:2.25rem; margin:.4rem 0 0; }
    section { scroll-margin-top:30px; }
    .section { padding-block:6rem; }
    .section-head { max-width:730px; margin-bottom:2.4rem; }
    .section-head h2 { font-size:clamp(2.3rem,3.5vw,3.45rem); margin:.7rem 0 1rem; }
    .section-head p { color:var(--muted); margin:0; font-size:1.08rem; }
    .services { background:var(--white); }
    .service .detail:hover { text-decoration-thickness:2px; }
    .useful { background:#fff; }
    .link-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
    .link-grid a { display:block; padding:1.2rem 1.4rem; border:1px solid var(--line); border-radius:7px; text-decoration:none; font-weight:650; }
    .link-grid a:hover { background:var(--pale); text-decoration:underline; }
    .link-grid small { display:block; font-weight:400; color:var(--muted); }
    .news { background:var(--ink); color:white; overflow:hidden; }
    .news .section-head p { color:#e0e9ec; }
    .ticker { border-block:1px solid #ffffff55; overflow:hidden; padding:.85rem 0; }
    .ticker-track { display:flex; width:max-content; animation:news-scroll 38s linear infinite; }
    .ticker-group { display:flex; gap:3rem; padding-right:3rem; flex:none; }
    .news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2rem; }
    .news-card { padding:1.55rem; border:1px solid #ffffff44; border-top:3px solid var(--acca-coral); background:#ffffff0c; border-radius:8px; }
    .news-card span { color:#b8e83e; font-size:.76rem; letter-spacing:.13em; text-transform:uppercase; font-weight:800; }
    .news-card h3 { font-size:1.58rem; margin:.65rem 0; }
    .news-card p { margin:0 0 1.2rem; color:#e0e9ec; }
    .news-card a { color:#fff; text-underline-offset:4px; }
    .ticker:hover .ticker-track,.ticker:focus-within .ticker-track,.ticker.paused .ticker-track { animation-play-state:paused; }
    .ticker a { color:white; white-space:nowrap; text-decoration:none; }
    .ticker a:hover { text-decoration:underline; }
    .ticker .source { color:#b8e83e; font-weight:750; margin-right:.6rem; }
    .news-control { margin-top:1rem; background:transparent; border:1px solid #fff; color:#fff; padding:.45rem .8rem; border-radius:4px; cursor:pointer; }
    @keyframes news-scroll { to { transform:translateX(-50%); } }
    .grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
    .service { display:flex; flex-direction:column; min-height:255px; padding:1.65rem; background:var(--paper); border:1px solid var(--line); border-radius:7px; }
    .service { --ribbon:#006e99; --stripe:#0095da; --wash:#e9f5f8; position:relative; overflow:hidden; padding-top:2.05rem; transition:box-shadow .2s, transform .2s; }
    .service::before { content:""; position:absolute; inset:0 0 auto; height:9px; background:var(--stripe); }
    .service:nth-child(3n + 2) { --ribbon:#527516; --stripe:#b8e83e; --wash:#f0f7df; }
    .service:nth-child(3n) { --ribbon:#a83829; --stripe:#cf4b38; --wash:#fdf0ed; }
    .service:hover { transform:translateY(-3px); box-shadow:0 12px 25px #172b3514; }
    .service .number { align-self:flex-start; padding:.37rem .68rem; border-radius:3px; font-size:.77rem; color:#fff; background:var(--ribbon); letter-spacing:.11em; font-weight:750; }
    .service-icon { width:54px; height:54px; padding:7px; border-radius:12px; color:var(--ribbon); background:var(--wash); margin-top:1.1rem; }
    .service h3 { margin-top:.65rem; }
    .service-detail { display:none; background:#fff; border-top:1px solid var(--line); }
    .service-detail:target { display:block; }
    .detail-inner { max-width:820px; padding-block:4rem; }
    .service-detail h2 { font-size:clamp(2.3rem,4vw,3.6rem); margin:.6rem 0 1rem; }
    .service-detail h3 { font-size:2rem; margin:2.2rem 0 .7rem; }
    .service-detail .lead { font-size:1.25rem; }
    .service-detail li { margin:.5rem 0; }
    .service-detail .callout { padding:1.5rem 2rem; background:var(--pale); border-radius:8px; margin-top:2rem; }
    .service-detail .callout h3 { margin-top:0; }
    .back-link { color:var(--accent); font-weight:700; text-underline-offset:4px; }
    .detail-tip { color:var(--muted); font-size:.95rem; }
    .service h3 { margin:1.5rem 0 .7rem; font-size:1.5rem; }
    .service p { margin:0; color:var(--muted); font-size:.95rem; }
    .service .detail { margin-top:auto; padding-top:1.2rem; font-size:.8rem; font-weight:700; color:var(--ribbon); }
    .acca-header { line-height:0; flex:none; }
    .acca-header img { display:block; width:58px; height:58px; object-fit:contain; }
    .booking { background:var(--pale); }
    .booking-grid { display:grid; grid-template-columns:1fr; gap:1.2rem; max-width:790px; }
    .booking-panel { background:white; border:1px solid var(--line); border-left:4px solid var(--acca-coral); padding:2rem; border-radius:8px; }
    .booking-panel p { color:var(--muted); margin:.3rem 0 1.4rem; }
    .person { background:#fff; border:1px solid var(--line); border-radius:8px; padding:2rem; }
    .person .avatar { display:grid; place-items:center; width:51px; height:51px; border-radius:50%; background:#e0f2f8; color:var(--accent); font:400 1.45rem Georgia,serif; }
    .person h3 { font-size:1.75rem; margin:1rem 0 .5rem; }
    .person p { color:var(--muted); min-height:3.1rem; margin:0 0 1.3rem; }
    .person small { display:block; color:var(--muted); margin-top:.8rem; }
    .resources { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:5rem; }
    .resource-art { min-height:360px; padding:2rem; background:var(--ink); color:white; border-radius:8px; display:flex; flex-direction:column; justify-content:space-between; }
    .resource-art .play { width:75px; height:75px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.65); border-radius:50%; font-size:1.4rem; padding-left:4px; }
    .resource-art strong { max-width:260px; font:400 2.1rem/1.15 Georgia,serif; letter-spacing:-.035em; }
    .resources .section-head { margin:0; }
    .resources .note { margin-top:1.5rem; color:var(--accent); font-weight:650; font-size:.92rem; }
    footer { border-top:1px solid var(--line); padding-block:3rem 2rem; background:#eff4f5; color:var(--muted); font-size:.86rem; }
    .footer-grid { display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:3rem; }
    footer strong { color:var(--ink); }
    footer p { margin:.7rem 0; }
    footer a { color:var(--ink); text-decoration-thickness:1px; text-underline-offset:3px; }
    .fine { border-top:1px solid var(--line); margin-top:2rem; padding-top:1.3rem; font-size:.75rem; }
    @media(max-width:900px) { nav { gap:.85rem; } .hero { gap:2rem; } .hero-art { height:400px; } .resources { gap:2rem; } }
    @media(max-width:700px) {
      .wrap { width:min(100% - 34px,550px); }
      .nav { min-height:75px; gap:.7rem; } .brand { width:200px; } .acca-header img { width:46px; height:46px; } nav { display:none; } .mobile-nav { display:block; position:relative; }
      .mobile-nav summary { cursor:pointer; list-style:none; font-weight:700; padding:.7rem; }
      .mobile-nav summary::-webkit-details-marker { display:none; }
      .mobile-nav[open] .mobile-links { position:absolute; z-index:3; right:0; top:46px; width:215px; display:grid; gap:.7rem; padding:1rem; background:#fff; box-shadow:0 12px 24px #172c3722; border:1px solid var(--line); border-radius:5px; }
      .mobile-links a { text-decoration:none; font-weight:600; }
      .hero { grid-template-columns:1fr; min-height:0; gap:3rem; padding-block:3.5rem; } h1 { font-size:clamp(3rem,11vw,4.5rem); } .hero-art { height:320px; max-width:450px; width:100%; margin-inline:auto; }
      .stripe .wrap,.resources,.footer-grid { grid-template-columns:1fr; gap:1.2rem; } .stripe h2 { font-size:1.9rem; }
      .section { padding-block:4.1rem; } .grid,.booking-grid,.link-grid,.news-grid { grid-template-columns:1fr; } .service { min-height:0; } .resources { gap:2rem; } .resource-art { min-height:260px; }
    }
    @media(max-width:380px) { .brand { width:160px; } .nav { gap:.35rem; } .acca-header img { width:40px; height:40px; } }
    @media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } .ticker-track { animation:none; } .ticker { overflow-x:auto; } }
  
