/* sponsor.html: page-specific finish, loaded after inner.css and scoped to body[data-page="sponsor"].
   Icon tiles on the cards, numbered partnership cards with the lead partnership highlighted, the enquiry form beside
   "why partner", 2027 sponsor tiers and past logos at one size. Colours come only from the site.css tokens. */

/* ================= CARDS: icon tile, label, title, text; actions sit on the bottom edge ================= */
body[data-page="sponsor"] .cards{gap:16px}
body[data-page="sponsor"] .ic{padding:26px 26px 24px;border-radius:20px;gap:10px}
body[data-page="sponsor"] .ic h3{font-size:clamp(1.12rem,1.5vw,1.25rem);line-height:1.25}
body[data-page="sponsor"] .ic p{line-height:1.6}
body[data-page="sponsor"] .ic .acts{margin-top:10px}
body[data-page="sponsor"] .ic .xi{width:46px;height:46px;padding:12px;margin-bottom:8px;border-radius:14px;color:var(--teal);stroke-width:1.8;
  background:color-mix(in srgb,var(--teal) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--teal) 20%,transparent);
  transition:transform .6s var(--spring),background .4s var(--ease-out),color .4s var(--ease-out),box-shadow .4s var(--ease-out)}
body[data-page="sponsor"] .ic:hover .xi{transform:rotate(-8deg) scale(1.08);background:var(--teal);color:var(--teal-ink);
  box-shadow:0 10px 22px -10px color-mix(in srgb,var(--teal) 80%,transparent)}
/* alternate the accent so a row of tiles reads as a set, not a stamp */
body[data-page="sponsor"] .cards > .ic:nth-child(even) .xi{color:var(--turmeric);background:color-mix(in srgb,var(--turmeric) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--turmeric) 24%,transparent)}
body[data-page="sponsor"] .cards > .ic:nth-child(even):hover .xi{background:var(--turmeric);color:var(--surface);box-shadow:0 10px 22px -10px color-mix(in srgb,var(--turmeric) 80%,transparent)}
body[data-page="sponsor"] .ic .acts .btn-line{padding-inline:16px}
body[data-page="sponsor"] .ic .acts .btn-line:hover{border-color:var(--teal);color:var(--teal)}

/* ================= FORMS: sentence-case labels, taller fields, a quiet footer for the action ================= */
body[data-page="sponsor"] .form{padding:32px;gap:18px;border-radius:22px}
body[data-page="sponsor"] .form label{font:600 13.5px/1.3 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink);margin-bottom:8px}
body[data-page="sponsor"] .form input,body[data-page="sponsor"] .form select{min-height:48px}
body[data-page="sponsor"] .form input,body[data-page="sponsor"] .form select,body[data-page="sponsor"] .form textarea{padding:12px 14px;font-size:15px;background:var(--paper);border-color:var(--line)}
body[data-page="sponsor"] .form textarea{min-height:124px;line-height:1.55}
body[data-page="sponsor"] .form input:hover,body[data-page="sponsor"] .form select:hover,body[data-page="sponsor"] .form textarea:hover{border-color:color-mix(in srgb,var(--teal) 35%,var(--line))}
body[data-page="sponsor"] .form input::placeholder,body[data-page="sponsor"] .form textarea::placeholder{color:var(--placeholder)}
body[data-page="sponsor"] .form .actions{gap:12px 16px;margin-top:6px;padding-top:22px;border-top:1px solid color-mix(in srgb,var(--line) 75%,transparent)}
body[data-page="sponsor"] .form .actions .btn{min-height:46px;padding-inline:24px}
body[data-page="sponsor"] .form .done{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border-radius:14px;line-height:1.5;
  background:color-mix(in srgb,var(--ok) 10%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 30%,transparent);animation:sp-in .5s var(--ease-out)}
body[data-page="sponsor"] .form .done::before{content:"";flex:none;width:8px;height:8px;margin-top:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 18%,transparent)}
@keyframes sp-in{from{opacity:0;transform:translateY(6px)}}
/* a form stays still under the pointer: the shared card tilt is for reading, not typing */
@media (hover:hover) and (pointer:fine){body[data-page="sponsor"] form.card:hover,body[data-page="sponsor"] form.card:focus-within{transform:none!important}}

/* email address: a clean chip instead of a monospace run */
body[data-page="sponsor"] main .muted code{font:500 .94em/1.4 var(--sans);color:var(--ink);padding:3px 10px;border-radius:8px;overflow-wrap:anywhere;
  background:color-mix(in srgb,var(--teal) 8%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--teal) 18%,transparent)}
body[data-page="sponsor"] .lead-p{line-height:1.65}

@media (max-width:560px){
  body[data-page="sponsor"] .ic{padding:22px 20px 20px}
  body[data-page="sponsor"] .form{padding:22px 18px;gap:16px}
  body[data-page="sponsor"] .form .actions .btn{width:100%}
}

@media (prefers-reduced-motion: reduce){
  html:not(.force-motion) body[data-page="sponsor"] .form .done{animation:none}
  html:not(.force-motion) body[data-page="sponsor"] .ic .xi{transition:none}
  html:not(.force-motion) body[data-page="sponsor"] .ic:hover .xi{transform:none}
}
body[data-page="sponsor"] .sec-head .linkbtn{margin-top:6px;font-size:14.5px}

/* ================= WHY PARTNER + ENQUIRY: reasons on the left, the form on the right ================= */
body[data-page="sponsor"] #why-partner .two{gap:56px}
body[data-page="sponsor"] .sp-why{list-style:none;display:grid;gap:16px;margin:26px 0 28px;padding:0}
body[data-page="sponsor"] .sp-why li{display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;align-items:start;line-height:1.55;color:var(--ink-2)}
body[data-page="sponsor"] .sp-why b{color:var(--ink);font-weight:650}
body[data-page="sponsor"] .sp-why svg.li{width:42px;height:42px;padding:10px;border-radius:13px;color:var(--teal);stroke-width:1.8;
  background:color-mix(in srgb,var(--teal) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--teal) 20%,transparent)}
body[data-page="sponsor"] .form-h{display:grid;gap:2px;padding-bottom:14px;border-bottom:1px solid color-mix(in srgb,var(--line) 75%,transparent)}
body[data-page="sponsor"] .form-h b{font:700 18px/1.3 var(--display);color:var(--ink)}
body[data-page="sponsor"] .form-h span{font-size:14px;color:var(--ink-2)}
body[data-page="sponsor"] #enquiry{scroll-margin-top:150px}

/* ================= 2027 SPONSOR TIERS: three logo slots per tier, all the same size ================= */
body[data-page="sponsor"] .tiers{display:grid;gap:26px}
body[data-page="sponsor"] .tier{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:28px;align-items:center;padding:22px 24px;border-radius:22px;
  background:var(--surface);border:1px solid color-mix(in srgb,var(--line) 75%,transparent)}
body[data-page="sponsor"] .tier h3{margin:0;font:700 clamp(1.05rem,1.5vw,1.2rem)/1.3 var(--display);text-wrap:balance}
body[data-page="sponsor"] .tier-logos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
body[data-page="sponsor"] .tier-logos .logo-tile{height:110px}
body[data-page="sponsor"] .logo-tile.tbc{background:var(--paper);border-style:dashed}
body[data-page="sponsor"] .logo-tile.tbc span{font:500 11.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);text-align:center}
body[data-page="sponsor"] .logo-tile.tbc:hover{transform:none;box-shadow:none}

@media (max-width:900px){
  body[data-page="sponsor"] #why-partner .two{gap:28px}
  body[data-page="sponsor"] .tier{grid-template-columns:1fr;gap:14px}
}
@media (max-width:560px){
  body[data-page="sponsor"] .tier{padding:18px 16px}
  body[data-page="sponsor"] .tier-logos{gap:8px}
  body[data-page="sponsor"] .tier-logos .logo-tile{height:80px;padding:8px}
  body[data-page="sponsor"] .logo-tile.tbc span{font-size:10px;letter-spacing:.04em}
}

/* "Our Sponsors Over the Years" stays on one line: its column sizes to the heading; on phones the heading scales to the width */
body[data-page="sponsor"] #sponsors .sec-head{grid-template-columns:auto minmax(0,1fr)}
body[data-page="sponsor"] #sponsors .sec-head h2{white-space:nowrap}
@media (max-width:900px){body[data-page="sponsor"] #sponsors .sec-head{grid-template-columns:1fr}}
@media (max-width:560px){body[data-page="sponsor"] #sponsors .sec-head h2{font-size:min(2rem,7vw)}}

/* ================= SPONSOR BENEFITS: nine short promises in a quiet grid ================= */
body[data-page="sponsor"] .sp-ben{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
body[data-page="sponsor"] .sp-ben li{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);
  font:650 15.5px/1.35 var(--display);color:var(--ink)}
body[data-page="sponsor"] .sp-ben svg.li{flex:none;width:40px;height:40px;padding:10px;border-radius:12px;color:var(--teal);stroke-width:1.8;background:color-mix(in srgb,var(--teal) 9%,transparent)}
body[data-page="sponsor"] .sp-ben li:nth-child(even) svg.li{color:var(--turmeric);background:color-mix(in srgb,var(--turmeric) 10%,transparent)}

/* ================= PACKAGES: one row per package; a row opens to its benefits ================= */
body[data-page="sponsor"] .sp-pks{padding:0;overflow:hidden;border-radius:22px}
body[data-page="sponsor"] .sp-pk-top{display:flex;justify-content:space-between;align-items:center;gap:8px 16px;flex-wrap:wrap;padding:16px 22px;border-bottom:1px solid var(--line);font-size:14px;color:var(--ink-2)}
body[data-page="sponsor"] .sp-cnt{font:600 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--teal)}
body[data-page="sponsor"] .sp-pk{border-bottom:1px solid var(--line);scroll-margin-top:96px}
body[data-page="sponsor"] .sp-pk:last-child{border-bottom:0}
body[data-page="sponsor"] .sp-pk h3{margin:0;font:inherit}
body[data-page="sponsor"] .sp-pk-h{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1.2fr) minmax(0,.6fr) minmax(0,.9fr) 24px;gap:12px 24px;align-items:center;padding:20px 22px;transition:background .3s var(--ease-out)}
body[data-page="sponsor"] .sp-pk-h:hover{background:color-mix(in srgb,var(--teal) 4%,transparent)}
body[data-page="sponsor"] .sp-pk-h:focus-visible{outline:2px solid var(--teal);outline-offset:-2px}
body[data-page="sponsor"] .sp-pk .k{display:block;font:600 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-bottom:5px}
body[data-page="sponsor"] .sp-pk-n b{display:block;font:700 18px/1.25 var(--display);color:var(--ink)}
body[data-page="sponsor"] .sp-pk-n small{display:block;margin-top:4px;font-size:13.5px;line-height:1.45;color:var(--ink-2)}
body[data-page="sponsor"] .sp-pk-f b{display:block;font:800 18px/1.2 var(--display);font-variant-numeric:tabular-nums;color:var(--ink)}
body[data-page="sponsor"] .sp-pk-f b .muted{font:500 14px var(--sans);color:var(--ink-2)}
body[data-page="sponsor"] .sp-pk-p b{font-size:20px;color:var(--teal)}

body[data-page="sponsor"] .sp-pk-f small{display:block;font-size:12px;color:var(--ink-2);margin-top:2px}
body[data-page="sponsor"] .sp-pk .chev{width:22px;height:22px;color:var(--ink-2);transition:transform .35s var(--ease-out)}
body[data-page="sponsor"] .sp-pk-h[aria-expanded="true"]{background:color-mix(in srgb,var(--teal) 6%,transparent)}
body[data-page="sponsor"] .sp-pk-h[aria-expanded="true"] .chev{transform:rotate(180deg);color:var(--teal)}
body[data-page="sponsor"] .sp-pk-b{padding:4px 22px 22px;background:color-mix(in srgb,var(--teal) 3%,transparent)}
body[data-page="sponsor"] .sp-pk-b:not([hidden]){animation:sp-in .4s var(--ease-out)}
body[data-page="sponsor"] .sp-bens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
body[data-page="sponsor"] .sp-bg{padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
body[data-page="sponsor"] .sp-bg.hl{border-color:color-mix(in srgb,var(--teal) 35%,var(--line));background:color-mix(in srgb,var(--teal) 7%,var(--surface))}
body[data-page="sponsor"] .sp-bg h4{margin:0 0 8px;font:700 14.5px var(--display);color:var(--teal)}
body[data-page="sponsor"] .sp-bg ul,body[data-page="sponsor"] .sp-e ul{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px;line-height:1.5;color:var(--ink-2)}
body[data-page="sponsor"] .sp-pk-a{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;font-size:14.5px;color:var(--ink-2)}
body[data-page="sponsor"] .sp-pk-a b{color:var(--ink)}

/* ================= MORE WAYS: additional cards, entry options, other ways to engage ================= */
body[data-page="sponsor"] .sp-add{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
body[data-page="sponsor"] .sp-a,body[data-page="sponsor"] .sp-e{padding:20px;border-radius:18px;display:flex;flex-direction:column;gap:8px;scroll-margin-top:96px}
body[data-page="sponsor"] .sp-a svg.li,body[data-page="sponsor"] .sp-e svg.li{width:38px;height:38px;padding:9px;border-radius:11px;color:var(--teal);stroke-width:1.8;background:color-mix(in srgb,var(--teal) 9%,transparent)}
body[data-page="sponsor"] .sp-a h3,body[data-page="sponsor"] .sp-e h3{margin:4px 0 0;font:700 16.5px/1.25 var(--display)}
body[data-page="sponsor"] .sp-a p,body[data-page="sponsor"] .sp-e p{margin:0;font-size:14px;line-height:1.5;color:var(--ink-2)}
body[data-page="sponsor"] .sp-a p{flex:1}
body[data-page="sponsor"] .sp-a-p b{display:block;font:800 19px var(--display);font-variant-numeric:tabular-nums;color:var(--teal)}
body[data-page="sponsor"] .sp-a-p small{font-size:12px;color:var(--ink-2)}
body[data-page="sponsor"] .sp-a .btn,body[data-page="sponsor"] .sp-e .btn{align-self:flex-start;margin-top:6px}
body[data-page="sponsor"] .sp-sub{margin:40px 0 16px;font:700 21px var(--display)}
/* three equal cards in price order (Corporate, Associate, State), one height, Enquire buttons aligned along the bottom */
body[data-page="sponsor"] .sp-entry{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
body[data-page="sponsor"] .sp-e .btn{margin-top:auto}
body[data-page="sponsor"] .sp-e ul{margin-bottom:12px;font-size:15px;gap:8px}
body[data-page="sponsor"] .sp-e-h{display:flex;align-items:center;gap:12px}
body[data-page="sponsor"] .sp-e-h h3{margin:0}
body[data-page="sponsor"] .sp-e .muted{font-style:italic}
body[data-page="sponsor"] .sp-other{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
body[data-page="sponsor"] .sp-o{display:flex;align-items:center;gap:14px;padding:18px;border-radius:16px;text-align:left;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
body[data-page="sponsor"] .sp-o span{flex:1;min-width:0}
body[data-page="sponsor"] .sp-o b{display:block;font:650 15px/1.3 var(--display);color:var(--ink)}
body[data-page="sponsor"] .sp-o small{display:block;margin-top:3px;font-size:13px;line-height:1.45;color:var(--ink-2)}
body[data-page="sponsor"] .sp-o svg.li{flex:none;width:36px;height:36px;padding:8px;border-radius:10px;color:var(--teal);background:color-mix(in srgb,var(--teal) 9%,transparent)}
body[data-page="sponsor"] .sp-o svg.go{width:20px;height:20px;padding:0;background:none;color:var(--ink-2);transition:transform .3s var(--ease-out)}
body[data-page="sponsor"] .sp-o:hover svg.go{color:var(--teal)}

@media (max-width:1100px){
  body[data-page="sponsor"] .sp-add{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  body[data-page="sponsor"] .sp-ben{grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-page="sponsor"] .sp-pk-h{grid-template-columns:repeat(3,minmax(0,1fr)) 22px}
  body[data-page="sponsor"] .sp-pk-n{grid-column:1/-2}
  body[data-page="sponsor"] .sp-pk .chev{grid-column:-2;grid-row:1}
  body[data-page="sponsor"] .sp-bens{grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-page="sponsor"] .sp-entry,body[data-page="sponsor"] .sp-other{grid-template-columns:minmax(0,1fr)}
  body[data-page="sponsor"] .sp-add{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  body[data-page="sponsor"] .sp-ben,body[data-page="sponsor"] .sp-bens,body[data-page="sponsor"] .sp-add{grid-template-columns:minmax(0,1fr)}
  body[data-page="sponsor"] .sp-pk-h{padding:18px 16px;gap:10px 14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 22px}
  body[data-page="sponsor"] .sp-pk-p{grid-column:1/-1}
  body[data-page="sponsor"] .sp-pk-b{padding:4px 16px 18px}
  body[data-page="sponsor"] .sp-pk-top{padding:14px 16px}
}
@media (prefers-reduced-motion: reduce){
  html:not(.force-motion) body[data-page="sponsor"] .sp-pk-b:not([hidden]){animation:none}
}

/* header: no photo, text centred */
body[data-page="sponsor"] .sp-hero .wrap{text-align:center;display:flex;flex-direction:column;align-items:center}
body[data-page="sponsor"] .sp-hero p{margin-inline:auto}

/* header animation: past sponsors' logos drift in tilted rows behind a dark veil; a darker pool keeps the text readable.
   Shorter than the other page headers */
body[data-page="sponsor"] .sp-drift{position:relative;overflow:hidden}
body[data-page="sponsor"] .sp-drift .wrap{position:relative;z-index:2;padding-block:44px 40px}
body[data-page="sponsor"] .sp-drift h1{margin:0 0 12px}
body[data-page="sponsor"] .sp-drift p{text-wrap:balance;max-width:760px}
body[data-page="sponsor"] .sp-nowrap{white-space:nowrap}
body[data-page="sponsor"] .sp-fx{position:absolute;inset:0;z-index:1;pointer-events:none}
body[data-page="sponsor"] .sp-fx::after{content:"";position:absolute;inset:0;
  background:radial-gradient(50% 75% at 50% 50%,rgb(10 10 31 / .85),rgb(10 10 31 / .55) 65%,rgb(10 10 31 / .4))}
body[data-page="sponsor"] .sp-rows{position:absolute;left:-10%;right:-10%;top:50%;display:flex;flex-direction:column;gap:14px;transform:translateY(-50%) rotate(-7deg);opacity:.32}
body[data-page="sponsor"] .sp-row{display:flex;gap:14px;width:max-content;animation:sp-slide 70s linear infinite}
body[data-page="sponsor"] .sp-row:nth-child(2){animation-direction:reverse;animation-duration:85s;margin-left:-70px}
body[data-page="sponsor"] .sp-row span{flex:none;width:132px;height:62px;border-radius:12px;background:rgb(255 255 255 / .92);display:grid;place-items:center;padding:10px}
body[data-page="sponsor"] .sp-row img{max-width:100%;max-height:100%;object-fit:contain}
@keyframes sp-slide{to{transform:translateX(-50%)}}
@media (max-width:560px){
  body[data-page="sponsor"] .sp-drift .wrap{padding-block:36px 32px}
  body[data-page="sponsor"] .sp-row span{width:104px;height:50px;padding:8px}
}
@media (prefers-reduced-motion: reduce){html:not(.force-motion) body[data-page="sponsor"] .sp-row{animation:none}}

/* "Price on request" (no ?pricing in the link) looks the same everywhere */
body[data-page="sponsor"] .sp-pk-f b.sp-req,body[data-page="sponsor"] .sp-a-p b.sp-req{font:600 15px var(--sans);color:var(--ink-2)}