/*
Theme Name: Ian's Sensory Garden
Theme URI: https://www.youtube.com/watch?v=B_rmOB4iT0U
Author: Ian's Sensory Garden
Description: A bright, child-friendly fundraising theme for Ian Subaskaran's charity walk and the new sensory garden for children with special educational needs in Woodford Green, Redbridge. The home page opens with a bright photo collage, followed by a fundraising progress bar, the walk video, the garden, Ian's story, latest news and a school visit booking form that emails you and saves each request in the dashboard. Edit the total, links, video and text in Appearance › Customize › Sensory Garden.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ians-sensory-garden
Tags: one-column, custom-logo, custom-menu, featured-images, footer-widgets, threaded-comments, translation-ready, accessibility-ready, blog, education
*/
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@1,600;1,700&display=swap');


/* ---------- Accessibility helpers ---------- */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background:var(--surface);clip:auto!important;clip-path:none;color:var(--ink);display:block;font-weight:700;height:auto;left:8px;padding:14px 20px;top:8px;width:auto;z-index:100000;border-radius:12px;box-shadow:0 6px 0 var(--purple)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- Header and menu ---------- */
.brand-logo{width:auto;max-height:44px;display:block}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px}
.nav li{margin:0}
.nav .current-menu-item > a{color:var(--primary)}
.nav-donate{margin-left:8px}
.menu-toggle{display:none;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-weight:700;cursor:pointer}
@media (max-width:760px){
	.menu-toggle{display:inline-flex}
	.nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:4px;padding-block:8px}
	.nav.is-open{display:flex}
	.nav ul{flex-direction:column;align-items:stretch;gap:0}
	.nav ul a{display:block;padding:12px 4px;border-bottom:1px solid var(--line)}
	.nav-donate{margin:12px 0 4px}
}

@media (max-width:760px){
  .topbar .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;row-gap:0}
  .topbar .nav{grid-column:1/-1}
  .brand{font-size:19px;gap:10px;min-width:0;line-height:1.2}
  .menu-toggle{padding:8px 14px}
}
@media (max-width:360px){.brand{font-size:17px}.menu-toggle span{display:none}}

/* ---------- Home extras ---------- */
.garden-section{padding-top:24px}
.video-embed{position:relative;overflow:hidden}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.admin-hint{margin:0}
.admin-hint a{display:inline-block;background:var(--surface);color:var(--ink);border:2px dashed var(--yellow);border-radius:14px;padding:10px 14px;font-size:15px;font-weight:700;text-decoration:none}
.visit-form .btn{justify-self:start;width:max-content}
.form-status.is-success{border-color:var(--green);background:color-mix(in srgb,var(--green) 12%,var(--surface))}
.form-status.is-error{border-color:var(--red);background:color-mix(in srgb,var(--red) 10%,var(--surface))}
.home-content{padding-block:72px 0}
.updates{background:var(--surface);border-top:2px solid var(--line)}
.text-link{font-weight:700;color:var(--primary);text-decoration:underline;text-underline-offset:4px}

/* ---------- Posts and pages ---------- */
.page-header{background:var(--surface);border-bottom:2px solid var(--line);padding-block:64px 48px;position:relative}
.page-header::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:6px;background:linear-gradient(90deg,var(--red) 0 16%,var(--orange) 16% 32%,var(--yellow) 32% 48%,var(--green) 48% 64%,var(--blue) 64% 80%,var(--pink) 80% 100%)}
.page-header .wrap{display:flex;flex-direction:column;gap:12px}
.page-title{font-size:clamp(34px,5vw,56px);line-height:1.05;font-weight:800;letter-spacing:-0.02em}
.page-header .eyebrow a{color:inherit;text-decoration:none}
.wrap.narrow{max-width:808px}
.page-body{padding-block:56px 88px;display:flex;flex-direction:column;gap:28px}
.entry-meta{color:var(--label);font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.entry-thumb{margin-top:40px}
.entry-thumb img{width:100%;height:auto;border-radius:24px;box-shadow:0 10px 0 var(--orange)}
.entry-content{padding-block:40px 24px}
.entry-content > *{margin-block:0 1.1em}
.entry-content h2{font-size:clamp(26px,3vw,34px);margin-top:1.6em}
.entry-content h3{font-size:24px;margin-top:1.4em}
.entry-content a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.entry-content ul,.entry-content ol{padding-left:1.3em}
.entry-content li + li{margin-top:.35em}
.entry-content blockquote{margin-inline:0;padding:4px 0 4px 22px;border-left:5px solid var(--yellow);font-family:var(--display);font-weight:700;font-size:1.2em;line-height:1.35}
.entry-content img,.entry-content video{height:auto;border-radius:16px}
.entry-content figure{margin-inline:0}
.entry-content figcaption,.wp-caption-text{color:var(--label);font-size:15px;margin-top:8px}
.entry-content .alignwide{margin-inline:calc(50% - min(600px,50vw - 24px));max-width:none}
.entry-content .alignfull{margin-inline:calc(50% - 50vw);max-width:100vw;width:100vw}
.entry-content .alignfull img{border-radius:0}
.alignleft{float:left;margin:0 1.4em 1em 0}
.alignright{float:right;margin:0 0 1em 1.4em}
.aligncenter{display:block;margin-inline:auto}
.entry-content .wp-block-button__link{border-radius:999px;background:var(--primary);color:var(--on-primary);font-weight:700;padding:12px 26px;text-decoration:none;box-shadow:0 6px 0 var(--primary-edge)}
.entry-content table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.entry-content pre{overflow-x:auto;background:var(--bg);border:2px solid var(--line);border-radius:14px;padding:16px}
.entry-footer{padding-bottom:56px;display:flex;flex-direction:column;gap:24px}
.tags a{display:inline-block;margin:0 6px 6px 0;padding:4px 12px;border-radius:999px;border:2px solid var(--line);text-decoration:none;font-size:15px;font-weight:700}
.post-navigation .nav-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
.post-navigation a{display:flex;flex-direction:column;gap:2px;text-decoration:none;font-weight:700;max-width:340px}
.post-navigation .nav-next a{text-align:right;margin-left:auto}
.nav-label{color:var(--label);font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.page-links{display:flex;gap:8px;font-weight:700}

.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.post-card{background:var(--surface);border:2px solid var(--line);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 0 var(--line)}
.post-card:nth-child(4n+1){box-shadow:0 8px 0 var(--blue)}
.post-card:nth-child(4n+2){box-shadow:0 8px 0 var(--orange)}
.post-card:nth-child(4n+3){box-shadow:0 8px 0 var(--purple)}
.post-card:nth-child(4n+4){box-shadow:0 8px 0 var(--green)}
.post-card-thumb img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.post-card-body{padding:24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.post-card-title{font-size:22px}
.post-card-title a{text-decoration:none}
.post-card-title a:hover{color:var(--primary)}
.post-card-excerpt p{color:var(--muted);font-size:17px}
.sticky .post-card-title::before{content:"★ ";color:var(--yellow)}

.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 14px;border-radius:999px;border:2px solid var(--line);text-decoration:none;font-weight:700;background:var(--surface)}
.pagination .page-numbers.current{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}

/* ---------- Search form ---------- */
.search-form{display:flex;flex-wrap:wrap;gap:10px;max-width:520px}
.search-form label{flex:1 1 240px;display:flex}
.search-form .search-field{flex:1}
.search-form .search-submit{min-height:50px;padding:0 24px;border-radius:999px;border:0;background:var(--primary);color:var(--on-primary);font:inherit;font-weight:700;cursor:pointer}

/* ---------- Comments ---------- */
.comments-area{padding-block:24px 88px;display:flex;flex-direction:column;gap:24px}
.comments-title{font-size:30px}
.comment-list,.comment-list .children{list-style:none;margin:0;padding:0}
.comment-list .children{padding-left:24px;border-left:3px solid var(--line);margin-top:16px}
.comment-body{background:var(--surface);border:2px solid var(--line);border-radius:18px;padding:20px;margin-bottom:16px}
.comment-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:15px;color:var(--label)}
.comment-author{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--ink)}
.comment-author .avatar{border-radius:50%}
.comment-author .says{display:none}
.comment-metadata a{color:inherit;text-decoration:none}
.comment-content{margin-top:10px}
.reply a{font-weight:700;color:var(--primary);font-size:15px}
.comment-form{display:flex;flex-direction:column;gap:14px}
.comment-form p{display:flex;flex-direction:column;gap:6px}
.comment-form .comment-form-cookies-consent{flex-direction:row;align-items:flex-start;gap:10px}
.comment-form .comment-form-cookies-consent input{width:auto;min-height:0;margin-top:5px}
.comment-form .form-submit{align-items:flex-start}

/* ---------- Footer ---------- */
.site-footer a{color:#FFFFFF}
.footer-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.footer-widgets{margin-top:32px;padding-top:32px;border-top:1px solid rgba(255,255,255,.14);display:grid !important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.footer-widgets .widget-title{font-family:var(--display);font-size:18px;color:#FFFFFF;margin-bottom:10px}
.footer-widgets ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.footer-base{margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);font-size:15px}

/* =====================================================================
   Design polish (v1.1) – layered on top of the original styles.
   Remove this block to return to the original look.
   ===================================================================== */
:root{
  --shadow-sm:0 1px 2px rgba(24,33,58,.06),0 2px 8px rgba(24,33,58,.06);
  --shadow-md:0 4px 10px rgba(24,33,58,.06),0 18px 40px rgba(24,33,58,.10);
  --radius-lg:28px;
}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--yellow);color:#2A1E00}

/* Sticky, frosted header */
.topbar{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--surface) 86%,transparent);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);transition:box-shadow .25s ease,padding .25s ease}
.admin-bar .topbar{top:32px}
@media (max-width:782px){.admin-bar .topbar{top:46px}}
.topbar.is-scrolled{box-shadow:0 6px 24px rgba(24,33,58,.08)}
.nav ul a:not(.btn){position:relative}
.nav ul a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:3px;border-radius:3px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.nav ul a:not(.btn):hover::after{transform:scaleX(1)}
@media (max-width:760px){.nav ul a:not(.btn)::after{display:none}}

/* Hero: soft colour glows behind the headline and collage */
.hero{overflow:hidden;isolation:isolate}
.hero::before,.hero::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(60px);opacity:.55;pointer-events:none}
.hero::before{width:520px;height:520px;left:-180px;top:-160px;background:radial-gradient(circle,color-mix(in srgb,var(--yellow) 55%,transparent),transparent 70%)}
.hero::after{width:620px;height:620px;right:-200px;bottom:-260px;background:radial-gradient(circle,color-mix(in srgb,var(--purple) 35%,transparent),transparent 70%)}
.hero .eyebrow{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:8px 16px 8px 12px;box-shadow:var(--shadow-sm);color:var(--ink)}
.hero .eyebrow::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 22%,transparent)}
.hero-main{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.hero-photos:hover .hero-main{transform:rotate(-.6deg) scale(1.01)}
.hero-snap{transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.hero-photos:hover .hero-snap{transform:rotate(-2deg) translateY(-6px)}

/* Buttons: a touch more depth on hover */
.btn-primary:hover{box-shadow:0 8px 0 var(--edge),0 14px 28px color-mix(in srgb,var(--primary) 35%,transparent)}
.btn-sun:hover{box-shadow:0 8px 0 var(--edge),0 14px 28px rgba(255,200,20,.35)}

/* Section headings get a small rainbow accent */
.section-head h2::after,#ian .side h2::after,.visit .side h2::after{content:"";display:block;width:72px;height:6px;margin-top:18px;border-radius:6px;background:linear-gradient(90deg,var(--red) 0 20%,var(--orange) 20% 40%,var(--yellow) 40% 60%,var(--green) 60% 80%,var(--blue) 80% 100%)}

/* Donate band: richer colour, subtle dotted texture, progress card */
.band{position:relative;overflow:hidden;background:radial-gradient(1200px 400px at 85% -10%,color-mix(in srgb,var(--pink) 45%,transparent),transparent 60%),radial-gradient(900px 380px at 0% 120%,color-mix(in srgb,var(--blue) 45%,transparent),transparent 60%),var(--band)}
.band::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.12) 1.2px,transparent 1.2px);background-size:22px 22px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40%,#000 60%,transparent);mask-image:linear-gradient(90deg,transparent,#000 40%,#000 60%,transparent);pointer-events:none}
.band .wrap{position:relative}
.band .amount{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:8px 18px}
.band .amount strong{font-family:var(--display);font-size:1.25em}
.track{height:26px;padding:4px;background:rgba(255,255,255,.16);box-shadow:inset 0 2px 6px rgba(0,0,0,.18)}
.fill{min-width:18px;position:relative;overflow:hidden}
.fill::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.45) 45%,transparent 70%);transform:translateX(-100%);animation:ians-shine 3.2s ease-in-out infinite}
@keyframes ians-shine{60%,100%{transform:translateX(100%)}}

/* Video */
.video{box-shadow:0 12px 0 var(--blue),var(--shadow-md)}
.date-chip{box-shadow:var(--shadow-sm);border-width:1px}

/* Garden cards */
.card{border-width:1px;box-shadow:0 8px 0 var(--c),var(--shadow-sm);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 14px 0 var(--c),var(--shadow-md)}
.tile{width:60px;height:60px;border-radius:20px;box-shadow:inset 0 -4px 0 rgba(0,0,0,.14);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.card:hover .tile{transform:rotate(-8deg) scale(1.08)}

/* Quote: big decorative mark */
.quote figure{position:relative;padding-top:56px}
.quote figure::before{content:"\201C";position:absolute;top:-40px;left:-6px;font-family:var(--display);font-weight:800;font-size:180px;line-height:1;color:var(--yellow);opacity:.9}
.quote figcaption{display:flex;align-items:center;gap:12px}
.quote figcaption::before{content:"";width:36px;height:3px;border-radius:3px;background:var(--yellow)}

/* Ian's story: framed photo and a connected timeline */
.photo{box-shadow:0 10px 0 var(--orange),var(--shadow-md)}
.timeline{position:relative}
.timeline li{border-top:0;border-bottom:0!important;padding:22px 24px;margin-bottom:14px;background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-sm);border-left:6px solid var(--c);transition:transform .25s ease,box-shadow .25s ease}
.timeline li:hover{transform:translateX(4px);box-shadow:var(--shadow-md)}
.timeline li:last-child{margin-bottom:0}
.when{color:var(--ink)}

/* News cards */
.post-card{border-width:1px;transition:transform .25s ease}
.post-card:hover{transform:translateY(-4px)}

/* Visit form sits on a card */
.visit{background:linear-gradient(180deg,var(--bg),var(--surface))}
.visit-form{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-md)}
@media (max-width:560px){.visit-form{padding:22px}}
input:not([type=checkbox]):not([type=radio]):not([type=submit]),textarea{transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
input:not([type=checkbox]):not([type=radio]):not([type=submit]):hover,textarea:hover{border-color:color-mix(in srgb,var(--purple) 45%,var(--field-line))}
input:focus,textarea:focus{background:var(--surface)}

/* Footer: rainbow edge, tidy widget headings */
.site-footer{position:relative}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--red) 0 16%,var(--orange) 16% 32%,var(--yellow) 32% 48%,var(--green) 48% 64%,var(--blue) 64% 80%,var(--pink) 80% 100%)}
.footer-widgets h2,.footer-widgets .wp-block-heading{font-family:var(--display);font-size:18px!important;line-height:1.3;color:#FFFFFF;margin:0 0 10px}
.footer-widgets a{color:var(--foot-ink);text-decoration:none}
.footer-widgets a:hover{color:#FFFFFF;text-decoration:underline}

/* Gentle scroll-in (only when JavaScript adds .js-reveal, and never with reduced motion) */
.js-reveal .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.js-reveal .reveal.is-visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .fill::after{animation:none}
  .card,.tile,.hero-main,.hero-snap,.timeline li,.post-card{transition:none}
  .js-reveal .reveal{opacity:1;transform:none;transition:none}
}

/* =====================================================================
   Sky blue & sunshine colour layer (v1.3).
   Remove this block to return to the v1.1 look.
   ===================================================================== */
:root{
  --bg:#F3FAFF; --surface:#FFFFFF; --ink:#10263D; --muted:#3E5670; --label:#2F6E9E; --line:#D6E8F5;
  --red:#F25C54; --orange:#FF9F1C; --yellow:#FFC93C; --green:#2BAE66; --blue:#1E88E5; --purple:#14B8C4; --pink:#FFB703;
  --rose:#1E88E5; --blush:#E3F3FF; --peach:#FFF7DB; --lilac:#E2F8F8;
  --primary:#1E88E5; --on-primary:#FFFFFF; --primary-edge:#1360A8;
  --band:#1E88E5; --band-ink:#FFFFFF; --band-muted:#E3F3FF; --track:#5FB0F0;
  --foot:#0E2A47; --foot-ink:#CFE3F5;
  --field:#F8FCFF; --field-line:#B8D4EA;
  --script:'Playfair Display', Georgia, 'Times New Roman', serif;
  --romance:linear-gradient(120deg,#1E88E5 0%,#14B8C4 50%,#FFC93C 100%);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0B1A2B; --surface:#13263B; --ink:#EAF4FF; --muted:#BFD3E8; --label:#8CC4F0; --line:#24405E;
  --blush:#10243A; --peach:#2A2512; --lilac:#0E2A30;
  --primary:#6CC4FF; --on-primary:#062033; --primary-edge:#3A8FCC;
  --band:#0F3A66; --band-muted:#D3EAFF; --track:#1D5A92;
  --foot:#06111D; --foot-ink:#B9CFE6; --field:#0F2034; --field-line:#33557A }}
:root[data-theme="dark"]{
  --bg:#0B1A2B; --surface:#13263B; --ink:#EAF4FF; --muted:#BFD3E8; --label:#8CC4F0; --line:#24405E;
  --blush:#10243A; --peach:#2A2512; --lilac:#0E2A30;
  --primary:#6CC4FF; --on-primary:#062033; --primary-edge:#3A8FCC;
  --band:#0F3A66; --band-muted:#D3EAFF; --track:#1D5A92;
  --foot:#06111D; --foot-ink:#B9CFE6; --field:#0F2034; --field-line:#33557A }

::selection{background:#FFE58A;color:#10263D}

/* Elegant italic accents */
.hero h1 span{font-family:var(--script);font-style:italic;font-weight:700;letter-spacing:-.01em}
.hero h1 .c1{color:#2BAE66} .hero h1 .c2{color:#F77F00} .hero h1 .c3{color:#1E88E5} .hero h1 .c4{color:#0FA3B1}
.quote blockquote{font-family:var(--script);font-style:italic;font-weight:600;letter-spacing:-.005em}
.hero-snap figcaption{font-family:var(--script);font-style:italic;font-size:17px;color:#1360A8}
.brand-name{background:var(--romance);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Little hearts beside the section labels */
.section-head .eyebrow::before,#ian .eyebrow::before,.visit .eyebrow::before{content:"\2600";color:#F5A700;margin-right:8px;font-size:1.05em}

/* Rose gradient buttons */
.btn-primary{background:linear-gradient(135deg,#2BA3F0,#1E88E5 55%,#1477C8);color:#FFFFFF}
.btn-ghost{border-color:var(--primary);color:var(--primary);--edge:var(--primary-edge)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .btn-primary{background:linear-gradient(135deg,#9AD8FF,#6CC4FF 55%,#5FE0E8);color:#062033}}
:root[data-theme="dark"] .btn-primary{background:linear-gradient(135deg,#9AD8FF,#6CC4FF 55%,#5FE0E8);color:#062033}

/* Hero: blush sky with peach and lilac glows and floating petals */
.hero{background:linear-gradient(180deg,var(--blush) 0%,var(--bg) 100%)}
.hero::before{background:radial-gradient(circle,rgba(255,201,60,.55),transparent 70%)}
.hero::after{background:radial-gradient(circle,rgba(30,136,229,.30),transparent 70%)}
.hero .eyebrow::before{background:#FFC93C;box-shadow:0 0 0 4px rgba(255,201,60,.3)}
.hero-main{box-shadow:0 12px 0 var(--yellow),0 30px 60px rgba(30,136,229,.22)}
.hero .wrap{position:relative}
.hero .wrap::before{content:"";position:absolute;inset:-40px 0 -40px 0;pointer-events:none;z-index:-1;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 4c8 6 10 18 0 32C10 22 12 10 20 4z' fill='%23FFD54F'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 4c8 6 10 18 0 32C10 22 12 10 20 4z' fill='%237CC8FF'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 4c8 6 10 18 0 32C10 22 12 10 20 4z' fill='%238EE3E8'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 4c8 6 10 18 0 32C10 22 12 10 20 4z' fill='%23FFE58A'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:34px,26px,28px,22px;
  background-position:6% 8%,46% 2%,40% 92%,2% 70%;
  opacity:.8;animation:ians-petals 9s ease-in-out infinite alternate}
@keyframes ians-petals{to{background-position:8% 14%,49% 8%,37% 86%,4% 64%}}

/* Donate band: sunset gradient */
.band{background:radial-gradient(900px 380px at 92% -20%,rgba(255,213,79,.6),transparent 60%),radial-gradient(900px 380px at 0% 120%,rgba(20,184,196,.5),transparent 60%),linear-gradient(120deg,#1E88E5,#1C9AD6 55%,#14B8C4)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .band{background:radial-gradient(900px 380px at 90% -20%,rgba(255,201,60,.18),transparent 60%),linear-gradient(120deg,#0F3A66,#0B4B5A)}}
:root[data-theme="dark"] .band{background:radial-gradient(900px 380px at 90% -20%,rgba(255,201,60,.18),transparent 60%),linear-gradient(120deg,#0F3A66,#0B4B5A)}
.fill{background:linear-gradient(90deg,#FFE58A,#FFC93C 50%,#FF9F1C)}

/* Rainbow accents become a sunset ribbon */
.section-head h2::after,#ian .side h2::after,.visit .side h2::after,.site-footer::before,.page-header::after{background:var(--romance)}

/* Soft tinted bands for each section */
#walk{background:linear-gradient(180deg,var(--bg),var(--peach))}
.video{box-shadow:0 12px 0 var(--blue),0 30px 50px rgba(30,136,229,.22)}
.date-chip b{background:#FFC93C}
#garden{background:linear-gradient(180deg,var(--peach),var(--lilac))}
.card{background:linear-gradient(180deg,var(--surface) 60%,color-mix(in srgb,var(--c) 7%,var(--surface)))}
.quote{background-image:linear-gradient(135deg,rgba(10,60,120,.6),rgba(5,25,50,.68)),url(assets/img/sunset.jpg)}
.quote figure::before{color:#FFC93C}
.quote figcaption{color:#DDEFFF}
.quote figcaption::before{background:#FFC93C}
#ian{background:linear-gradient(180deg,var(--lilac),var(--blush))}
.photo{box-shadow:0 10px 0 var(--yellow),0 24px 50px rgba(30,136,229,.2)}
.updates{background:var(--blush);border-top:0}
.visit{background:linear-gradient(180deg,var(--blush),var(--bg));border-top:0}
input:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(30,136,229,.22)}
.nav ul a:not(.btn)::after{background:var(--romance)}
.nav a:not(.btn):hover{color:var(--primary)}

@media (prefers-reduced-motion:reduce){.hero .wrap::before{animation:none}}