/*
Theme Name: Donation.se
Theme URI: https://donation.se/
Author: Mikael Linder
Description: Enkel personlig stödsida för donation.se.
Version: 1.0.2
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: donation-se
*/
:root { color-scheme: light; --ink:#172336; --muted:#536174; --blue:#111c2b; --orange:#f0aa48; --cream:#f7f5f0; --line:#dce1e6; }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { margin:0; background:var(--cream); color:var(--ink); font: 17px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
    .wrap { width:min(100% - 40px, 1060px); margin-inline:auto; }
    header { background:var(--blue); color:white; }
    .nav { min-height:75px; display:flex; align-items:center; justify-content:space-between; gap:18px; border-bottom:1px solid #ffffff24; }
    .brand { color:white; font-weight:800; font-size:1.3rem; letter-spacing:-.045em; text-decoration:none; }
    .nav small { color:#d4dee7; font-size:.83rem; }
    .hero { display:grid; grid-template-columns:minmax(0,1.14fr) minmax(290px,.86fr); align-items:center; gap:clamp(32px,6vw,76px); padding-block:clamp(50px,7vw,98px); }
    .eyebrow { color:#ffc77b; text-transform:uppercase; letter-spacing:.14em; font-size:.76rem; font-weight:800; }
    h1 { font-size:clamp(2.6rem,5.6vw,5rem); line-height:1.04; letter-spacing:-.065em; margin:18px 0 24px; max-width:12ch; }
    .lead { color:#e0e7ed; font-size:clamp(1.05rem,2vw,1.27rem); max-width:53ch; margin:0 0 30px; }
    .scope { display:inline-flex; align-items:center; gap:10px; border:1px solid #ffffff4a; padding:10px 15px; border-radius:999px; color:#f7f8fa; font-size:.87rem; }
    .scope i { display:block; width:8px; height:8px; background:var(--orange); border-radius:50%; }
    .payment { background:#fff; color:var(--ink); border-radius:24px; padding:clamp(24px,4vw,38px); box-shadow:0 25px 65px #07111f55; }
    .payment-label { text-transform:uppercase; font-size:.74rem; letter-spacing:.12em; font-weight:800; color:#566679; }
    .recipient { font-size:1.55rem; line-height:1.18; letter-spacing:-.04em; font-weight:800; margin:8px 0 4px; }
    .recipient-type { color:var(--muted); margin:0 0 28px; }
    .swish-number { border:1px dashed #9daab9; background:#f4f7f9; border-radius:13px; padding:16px; font-size:1.12rem; font-weight:750; letter-spacing:.025em; margin-bottom:15px; overflow-wrap:anywhere; }
    button { appearance:none; width:100%; border:0; border-radius:12px; padding:15px 18px; font-family:inherit; font-size:1rem; font-weight:700; line-height:1.3; background:var(--orange); color:#172336; cursor:pointer; min-height:52px; }
    button:hover:not(:disabled) { background:#ffc377; }
    button:focus-visible,a:focus-visible { outline:3px solid #46a9ef; outline-offset:3px; }
    button:disabled { background:#e7ebef; color:#5f6b78; cursor:not-allowed; }
    .payment-note { font-size:.82rem; color:var(--muted); margin:15px 0 0; }
    #feedback { min-height:1.5em; color:#175d43; font-size:.83rem; margin:10px 0 0; }
    main { padding-block:clamp(50px,7vw,85px); }
    .details { display:grid; grid-template-columns:1fr 1fr; gap:clamp(25px,5vw,75px); }
    h2 { font-size:clamp(1.55rem,3vw,2.3rem); letter-spacing:-.045em; line-height:1.16; margin:0 0 18px; }
    .details p { margin:0 0 17px; }
    .details ul { padding-left:1.25em; margin:0; }
    .details li { padding-left:.15em; margin:0 0 10px; }
    .projects { margin-top:clamp(48px,7vw,78px); }
    .projects-intro { max-width:72ch; color:var(--muted); margin:0 0 25px; }
    .project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
    .project-card { display:flex; flex-direction:column; min-height:148px; padding:21px; border:1px solid var(--line); background:#fff; border-radius:16px; text-decoration:none; color:var(--ink); transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease; }
    .project-card:hover { transform:translateY(-2px); border-color:#b5c3cf; box-shadow:0 9px 28px #18253514; }
    .project-card strong { font-size:1.12rem; letter-spacing:-.025em; overflow-wrap:anywhere; }
    .project-card span { color:var(--muted); font-size:.9rem; margin-top:7px; }
    .project-card em { font-style:normal; font-size:.8rem; font-weight:750; color:#8b5617; margin-top:auto; padding-top:14px; }
    .notice { margin-top:54px; padding:25px 29px; border-left:5px solid #d28825; background:#fff; border-radius:0 14px 14px 0; }
    .notice strong { display:block; margin-bottom:5px; }
    .notice p { margin:0; color:var(--muted); }
    footer { border-top:1px solid var(--line); color:var(--muted); padding:27px 0 40px; font-size:.85rem; }
    footer .wrap { display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }
    @media(max-width:750px) { .hero,.details { grid-template-columns:1fr; } .hero { gap:36px; padding-block:45px 55px; } h1 { max-width:13ch; } .payment { max-width:540px; width:100%; } .project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .notice { margin-top:34px; } }
    @media(max-width:550px) { .project-grid { grid-template-columns:1fr; } .project-card { min-height:126px; } }
    @media(max-width:420px) { .wrap { width:min(100% - 32px, 1060px); } .nav small { display:none; } .scope { border-radius:14px; } }