/**
 * SEND Support page (templates/send-support.php). Request-a-therapist design
 * language, self-contained. Buttons are plain <a>, so Elementor's kit button
 * rule never touches them - styled explicitly here.
 */
.ss-page{color:#384048;font-size:17px;background:#fff}
.ss-wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.ss-eyebrow{font:700 12.5px 'Heebo',sans-serif;letter-spacing:1.2px;text-transform:uppercase;color:#9ecbf0;margin:0 0 12px}
.ss-eyebrow--dark{color:#1578cc}
.ss-h2{font:700 28px 'Heebo',sans-serif;color:#00070e;margin:0 0 30px;text-align:center}

/* Button (green, families-friendly size) */
.ss-page .ss-btn{display:inline-flex;align-items:center;justify-content:center;background:#0d7d3f;color:#fff;font:500 12px 'Heebo',sans-serif;letter-spacing:.125em;text-transform:uppercase;text-decoration:none;padding:13px 30px;border-radius:4px;transition:background .2s ease}
.ss-page .ss-btn:hover{background:#109e50;color:#fff}

/* Hero */
.ss-hero{background:linear-gradient(135deg,#0b2f52 0%,#124a80 62%,#1578cc 130%);color:#fff;padding:72px 0 64px;position:relative;overflow:hidden}
.ss-hero__grid{display:grid;grid-template-columns:1.15fr 1fr;gap:50px;align-items:center}
.ss-hero__h1{font:700 40px/1.1 'Heebo',sans-serif;color:#fff;margin:0 0 22px}
.ss-hero__intro p{font-size:17px;line-height:1.62;color:#dbe9f6;margin:0 0 16px}
.ss-hero__cta{margin-top:32px}
/* Hero image (unique to this page): soft rounded frame (squared bottom-right corner),
   a layered blue->green colour block behind, a dotted-grid accent, and floating SEND-topic pills. */
.ss-hero__media{position:relative;min-width:0}
.ss-hero__accent{position:absolute;inset:0;transform:translate(20px,20px);border-radius:34px 34px 8px 34px;background:linear-gradient(135deg,rgba(21,120,204,.45),rgba(13,125,63,.38));z-index:0}
.ss-hero__dots{position:absolute;top:-22px;left:-24px;width:96px;height:96px;z-index:0;opacity:.5;background-image:radial-gradient(rgba(255,255,255,.7) 2px,transparent 2px);background-size:14px 14px}
.ss-hero__img{display:block;width:100%;height:auto;max-height:440px;object-fit:cover;border-radius:28px 28px 4px 28px;border:4px solid #fff;box-shadow:0 20px 50px rgba(2,12,22,.4);position:relative;z-index:1}
.ss-hero__pill{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:8px;background:#fff;color:#0b2f52;font:600 13.5px 'Heebo',sans-serif;padding:9px 15px;border-radius:999px;box-shadow:0 8px 22px rgba(4,26,46,.18);white-space:nowrap}
.ss-hero__pill i{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.ss-hero__pill--a{top:26px;left:-30px;animation:ss-float 6s ease-in-out infinite}
.ss-hero__pill--a i{background:#1578cc}
.ss-hero__pill--b{top:44%;right:-34px;animation:ss-float 7s .5s ease-in-out infinite}
.ss-hero__pill--b i{background:#0d7d3f}
.ss-hero__pill--c{bottom:-16px;left:34%;animation:ss-float 6.6s .9s ease-in-out infinite}
.ss-hero__pill--c i{background:#e8a33d}
@keyframes ss-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.ss-hero__pill{animation:none!important}}

/* FAQ - chat / speech-bubble style (matches request-a-therapist) */
.ss-faq{padding:64px 0;background:#f4f9fd}
.ss-faq .ss-faq__inner{max-width:760px}
.ss-chat{display:flex;flex-direction:column;gap:14px;max-width:760px;margin:0 auto}
.ss-chat__q,.ss-chat__a{width:fit-content;max-width:82%;padding:14px 20px;font-size:15.5px;line-height:1.55}
.ss-chat__q{background:#eef2f6;color:#00070e;font:600 15.5px 'Heebo',sans-serif;border-radius:18px 18px 18px 4px;cursor:pointer;list-style:none;transition:background .2s ease}
.ss-chat__q::-webkit-details-marker{display:none}
.ss-chat__q::after{content:"+";margin-left:10px;color:#1578cc;font-weight:700}
.ss-chat__item[open] .ss-chat__q::after{content:"\2212"}
.ss-chat__q:hover{background:#e3eff9}
.ss-chat__a{background:#1578cc;color:#fff;border-radius:18px 18px 4px 18px;margin:14px 0 6px auto}
.ss-chat__item[open] .ss-chat__a{animation:ss-chat-in .25s ease}
.ss-chat__a p{margin:0 0 10px;font-size:15.5px;line-height:1.55;color:#fff}
.ss-chat__a p:last-child{margin:0}
.ss-chat__a a{color:#fff;text-decoration:underline}
.ss-chat__a strong{color:#fff}
@keyframes ss-chat-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* Further reading cards */
.ss-reading{padding:64px 0;background:#fff}
.ss-reading__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.ss-card{display:flex;flex-direction:column;border:1px solid #e3ebf2;border-radius:16px;overflow:hidden;background:#fff;text-decoration:none;box-shadow:0 4px 14px rgba(4,26,46,.06);transition:transform .2s ease,box-shadow .2s ease}
.ss-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(4,26,46,.14)}
.ss-card__thumb{display:block;aspect-ratio:16/10;background:#e3f0fb;overflow:hidden}
.ss-card__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ss-card__noimg{display:block;width:100%;height:100%;background:linear-gradient(135deg,#dcecfa,#eef5fb)}
.ss-card__body{display:flex;flex-direction:column;gap:8px;padding:20px 22px 24px}
.ss-card__date{font-size:13px;color:#7c8892}
.ss-card__title{font:700 17px/1.35 'Heebo',sans-serif;color:#00070e}
.ss-card__more{margin-top:4px;font-weight:700;font-size:14.5px;color:#1578cc}

/* Final CTA - photo background, centred (matches request-a-therapist) */
.ss-center{text-align:center}
.ss-final{padding:88px 0 96px;background:linear-gradient(180deg,rgba(6,32,56,.80) 0%,rgba(6,32,56,.64) 100%),url('https://asltip.com/wp-content/uploads/01-0-16-1536x1024.jpg') center / cover no-repeat}
.ss-eyebrow--light{color:#9ecbf0}
.ss-final__h2{font:700 30px 'Heebo',sans-serif;color:#fff;margin:0 0 10px}
.ss-final__sub{font-size:17px;line-height:1.55;color:#dbe9f6;margin:0 auto;max-width:560px}
.ss-final__cta{margin-top:26px}

@media (max-width:820px){
  .ss-hero__grid{grid-template-columns:1fr;gap:34px;text-align:center}
  .ss-hero__h1{font-size:32px}
  .ss-hero__media{max-width:460px;margin:0 auto}
  .ss-hero__accent{transform:translate(12px,12px)}
  .ss-hero__pill--a{left:-12px}
  .ss-hero__pill--b{right:-14px}
  .ss-reading__grid{grid-template-columns:1fr;max-width:460px;margin:0 auto}
  .ss-chat__q,.ss-chat__a{max-width:92%}
  .ss-final__h2{font-size:26px}
}