/* Section colours and edge shapes for the public partner page (owner, 26 Oct 2026: "do that
   and improve the partner page too"). The shape rules are the homepage's (homepage.css, which
   keeps its own copy for the homepage's critical CSS): Taskovery's own motifs only, the logo's
   chevron and tick, rounded tiles, fading corner arcs and plus grids. Never Taskrabbit's blobs,
   rings, dot grids or stripes (owner: "don't just copy them"). */
.partner-landing { --deco-deep: #0E3BA8; --deco-blue: #1B62E8; --deco-sky: #7FB2FF; --deco-ice: #D3E3FF;
  --deco-coral: #1B62E8; --deco-ink: #0C1B33; }
.partner-landing > section { position: relative; isolation: isolate; overflow: clip; }
.partner-landing > .hero { background: #FFFFFF; }
.partner-landing > #growing { background: #F7F9FC; }
.partner-landing > #plans { background: #E8F0FC; }
.partner-landing > #reachable { background: #F7F9FC; }
.partner-landing > #verification { background: #FFFFFF; }
.partner-landing > #replying { background: #F7F9FC; }
.partner-landing > #partner-faq { background: #E8F0FC; }

/* The same brand artwork carries through the public information pages. */
.brand-info-page{--deco-deep:#0E3BA8;--deco-blue:#1B62E8;--deco-sky:#7FB2FF;--deco-ice:#D3E3FF;--deco-coral:#1B62E8;--deco-ink:#0C1B33}
.brand-info-page>section{position:relative;isolation:isolate;overflow:clip}
.brand-info-page>section.hero{background:var(--surface)}
.brand-info-page>section:nth-of-type(3n+2){background:#E8F0FC}
.brand-info-page>section:nth-of-type(3n+3){background:#F7F9FC}
.brand-info-page>section:nth-of-type(3n+4){background:#FFFFFF}
.brand-info-page>section>.wrap{position:relative}
.brand-info-page .hp-deco{user-select:none}
html[data-theme="dark"] .brand-info-page>section:nth-of-type(3n+2){background:#102342}
html[data-theme="dark"] .brand-info-page>section:nth-of-type(3n+3){background:#121A2B}
html[data-theme="dark"] .brand-info-page>section:nth-of-type(3n+4){background:#191F3D}
html[data-theme="dark"] .brand-info-page .hp-deco{opacity:.4}
@media(max-width:760px){.brand-info-page>section.hero .hp-deco i:not(.is-phone){display:none}.brand-info-page>section:not(.hero) .hp-deco{opacity:.5}}
@media print{.brand-info-page .hp-deco{display:none}}

/* The closing band in Taskovery blue, so the last thing on the page is the clearest. */
.partner-landing > .cta-band { background: linear-gradient(160deg, #2A6FF0 0%, #1B62E8 45%, #1146C4 100%); color: #FFFFFF; }
.partner-landing > .cta-band h2 { color: #FFFFFF; }
.partner-landing > .cta-band .lede, .partner-landing > .cta-band .note-line { color: rgba(255,255,255,.86); }
.partner-landing > .cta-band .note-line a { color: #FFFFFF; }
.partner-landing > .cta-band .note-line .ic { color: #FFFFFF; }
.partner-landing > .cta-band .btn--primary { background: #FFFFFF; color: #1146C4; box-shadow: 0 10px 30px rgba(8,30,90,.25); }
.partner-landing > .cta-band .btn--primary:hover { background: #EAF1FF; color: #0E3BA8; }
.partner-landing > .cta-band .btn--ghost { color: #FFFFFF; border-color: rgba(255,255,255,.55); background: transparent; }
.partner-landing > .cta-band .btn--ghost:hover { background: rgba(255,255,255,.12); color: #FFFFFF; }

.hp-deco { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hp-deco i { position: absolute; display: block; left: var(--l, auto); right: var(--r, auto); top: var(--t, auto); bottom: var(--b, auto);
  width: var(--w); height: var(--h, var(--w)); transform: rotate(var(--rot, 0deg)); opacity: var(--o, 1); }
/* Taskovery's own shapes, not borrowed ones: the logo's chevron and tick, rounded app
   tiles, concentric arcs out of a corner, and a small grid of plus signs. */
.hp-deco .d-chev { background: var(--c, var(--deco-blue)); aspect-ratio: 397 / 204.4; height: auto;
  clip-path: polygon(0 70.2%, 49.9% 0, 100% 70.2%, 100% 100%, 49.9% 29.8%, 0 100%); }
.hp-deco .d-tick { background: var(--c, var(--deco-coral)); aspect-ratio: 194 / 152.5; height: auto;
  clip-path: polygon(17.8% 26.7%, 39.2% 53.9%, 81.7% 0, 100% 23.3%, 39.7% 100%, 0 49.5%); }
.hp-deco .d-tile { background: var(--c, var(--deco-ice)); border-radius: 30%; }
.hp-deco .d-arcs { border-radius: 0; background: repeating-radial-gradient(circle at var(--at, 100% 0),
  var(--c, var(--deco-sky)) 0 4px, transparent 4px 22px);
  /* Fade out with distance, so the arcs never end on a hard square edge. */
  -webkit-mask: radial-gradient(circle at var(--at, 100% 0), #000 35%, transparent 70%);
  mask: radial-gradient(circle at var(--at, 100% 0), #000 35%, transparent 70%); }
.hp-deco .d-plus { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Cpath d='M14 8v12M8 14h12' stroke='%230C1B33' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") 0 0 / 28px 28px; }
.hp-deco .d-plus.is-light { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Cpath d='M14 8v12M8 14h12' stroke='%23ffffff' stroke-opacity='.4' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E"); }
.hp-deco .d-pill { background: var(--c, var(--deco-sky)); border-radius: 999px; }

/* Narrower screens: smaller, and further out to the edges. */
@media (max-width: 1180px) {
  .hp-deco i { width: calc(var(--w) * .7); }
  .hp-deco i:not(.d-chev):not(.d-tick) { height: calc(var(--h, var(--w)) * .7); }
  .hp-deco i[style*="--l"] { left: calc(var(--l) - 40px); }
  .hp-deco i[style*="--r"] { right: calc(var(--r) - 40px); }
}
@media (max-width: 760px) {
  .hp-deco i { width: calc(var(--w) * .4); opacity: calc(var(--o, 1) * .6); }
  .hp-deco i:not(.d-chev):not(.d-tick) { height: calc(var(--h, var(--w)) * .4); }
  .hp-deco i[style*="--l"] { left: calc(var(--l) * .3 - 30px); }
  .hp-deco i[style*="--r"] { right: calc(var(--r) * .3 - 30px); }
  .hp-deco .d-plus, .hp-deco .is-wide { display: none; }
  /* The hero's text runs edge to edge on a phone: one faint corner piece only. */
  .partner-landing > .hero .hp-deco i:not(.is-phone) { display: none; }
}
