/* ------------------------------------------------------------------
   Marketing Quiz — styled strictly to the audited site design system
   (see BRAND.md). Sub-page hero: flat navy, 4em/2em padding, Anton
   title + breadcrumb. Body: Bg-1 light texture (fixed) with dark
   #252525 tiles — the same recipe as the site's process cards.
   Type scale, button spec and card anatomy match the Elementor kit
   exactly (75/64/36 h2, Anton 16/20 ls2 buttons, coral bg + navy
   text, 30px card padding, square corners, 3px button radius).
------------------------------------------------------------------- */

/* ============ QUIZ (embedded in the sector-page content column) ============ */
#aw-quiz-root{width:100%;margin:0 0 60px;color:#252525}

/* top row: eyebrow + counter */
#aw-quiz-root .awq-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px}
#aw-quiz-root .awq-eyebrow{color:#FF6F61;font-family:'Poppins',sans-serif;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:12px;margin:0}
#aw-quiz-root .awq-count{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#646464;white-space:nowrap}

/* progress */
#aw-quiz-root .awq-bar{height:4px;background:rgba(37,37,37,.15);overflow:hidden;margin:0 0 40px}
#aw-quiz-root .awq-bar span{display:block;height:100%;width:0;background:#FF6F61;transition:width .35s ease}

/* question — h3 scale (Anton 40/32/26), ink on light */
#aw-quiz-root .awq-q{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;font-size:40px;line-height:1.2em;margin:0 0 30px;color:#252525;text-align:left}
@media(max-width:1024px){#aw-quiz-root .awq-q{font-size:32px}}
@media(max-width:767px){#aw-quiz-root .awq-q{font-size:26px}}

/* options: flat #252525 tiles on the texture (process-card recipe) */
#aw-quiz-root .awq-options{display:flex;flex-direction:column;gap:14px;margin:0 0 26px}
#aw-quiz-root .awq-opt{display:flex;align-items:center;gap:18px;width:100%;text-align:left;padding:20px 22px;border:2px solid transparent;background:#252525;color:#fff;font-family:'Poppins',sans-serif;font-size:16px;line-height:25px;cursor:pointer;transition:border-color .15s ease,transform .12s ease}
#aw-quiz-root .awq-opt:hover{border-color:#FF6F61;transform:translateY(-2px)}
#aw-quiz-root .awq-opt:active{transform:none}
#aw-quiz-root .awq-opt.is-picked{border-color:#FF6F61;background:#162C59}
#aw-quiz-root .awq-letter{flex:0 0 auto;width:42px;height:42px;border-radius:100px;background:#FF6F61;color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Anton',sans-serif;font-weight:400;font-size:18px;line-height:1}
#aw-quiz-root .awq-opt-text{flex:1 1 auto}
@media(max-width:767px){#aw-quiz-root .awq-opt{padding:16px;gap:14px;font-size:14px;line-height:1.55}#aw-quiz-root .awq-letter{width:36px;height:36px;font-size:16px}}

/* back nav */
#aw-quiz-root .awq-nav{display:flex;align-items:center;justify-content:flex-start}
#aw-quiz-root .awq-back{background:none;border:0;color:#646464;font-family:'Poppins',sans-serif;font-size:14px;font-weight:600;cursor:pointer;padding:8px 2px}
#aw-quiz-root .awq-back:hover{color:#FF6F61}
#aw-quiz-root .awq-back[disabled]{opacity:0;pointer-events:none}

/* ============ RESULT ============ */
#aw-quiz-root .awq-result{text-align:center;animation:awqfade .4s ease}
@keyframes awqfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#aw-quiz-root .awq-badge{display:inline-block;background:#FF6F61;color:#162C59;font-family:'Poppins',sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px;margin:0 0 20px}
#aw-quiz-root .awq-result-title{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;font-size:40px;line-height:1.2em;margin:0 0 12px;color:#252525}
#aw-quiz-root .awq-result-title span{color:#FF6F61}
#aw-quiz-root .awq-lead{color:#646464;font-size:16px;line-height:25px;max-width:560px;margin:0 auto 40px}
@media(max-width:1024px){#aw-quiz-root .awq-result-title{font-size:32px}}
@media(max-width:767px){#aw-quiz-root .awq-result-title{font-size:26px}#aw-quiz-root .awq-lead{font-size:14px}}

/* recommended service cards — site card anatomy: flat, 30px padding,
   #252525 / #162C59 alternating, Anton h4-scale headings w/ full stops */
#aw-quiz-root .awq-services{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:0 0 40px;text-align:left}
#aw-quiz-root .awq-service{display:flex;flex-direction:column;padding:30px;background:#252525;text-decoration:none;color:#fff;transition:transform .15s ease}
#aw-quiz-root .awq-service:nth-child(2){background:#162C59}
#aw-quiz-root .awq-service:hover{transform:translateY(-4px)}
#aw-quiz-root .awq-service-kicker{font-family:'Poppins',sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#FF6F61;margin:0 0 12px}
#aw-quiz-root .awq-service strong{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:1.2px;font-size:32px;line-height:1.2em;margin:0 0 8px;color:#fff}
#aw-quiz-root .awq-service strong:after{content:"."}
#aw-quiz-root .awq-service-blurb{font-size:16px;line-height:25px;color:rgba(255,255,255,.85);margin:0 0 22px;border-top:1px solid rgba(255,255,255,.18);padding-top:14px}
#aw-quiz-root .awq-service-btn{margin-top:auto;align-self:flex-start;display:inline-block;background:#FF6F61;color:#162C59;font-family:'Anton',sans-serif;font-weight:400;font-size:16px;line-height:20px;letter-spacing:2px;text-transform:uppercase;padding:12px 24px;border-radius:3px;transition:color .3s}
#aw-quiz-root .awq-service:hover .awq-service-btn{color:#fff}
@media(max-width:1024px){#aw-quiz-root .awq-service strong{font-size:25px}}
@media(max-width:767px){#aw-quiz-root .awq-service strong{font-size:20px}#aw-quiz-root .awq-service-blurb{font-size:14px}}

/* DIY panel — navy card, 30px padding */
#aw-quiz-root .awq-diy{margin:0 0 40px;padding:30px;background:#162C59;text-align:left;color:#fff}
#aw-quiz-root .awq-diy h4{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:1.2px;font-size:32px;line-height:1.2em;margin:0 0 8px;color:#fff}
#aw-quiz-root .awq-diy h4:after{content:"."}
#aw-quiz-root .awq-reasons{list-style:none;padding:14px 0 0;margin:0;border-top:1px solid rgba(255,255,255,.18);display:flex;flex-direction:column;gap:13px}
#aw-quiz-root .awq-reasons li{position:relative;padding-left:34px;font-size:16px;line-height:25px;color:rgba(255,255,255,.9)}
#aw-quiz-root .awq-reasons li:before{content:"";position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:100px;background:#FF6F61 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/13px no-repeat}
#aw-quiz-root .awq-reasons li a{color:#FF6F61;text-decoration:underline}
#aw-quiz-root .awq-note{font-size:14px;color:rgba(255,255,255,.65);margin:16px 0 0;line-height:1.6;text-align:left}
@media(max-width:1024px){#aw-quiz-root .awq-diy h4{font-size:25px}}
@media(max-width:767px){#aw-quiz-root .awq-diy h4{font-size:20px}#aw-quiz-root .awq-reasons li{font-size:14px}}

/* CTAs — exact kit button spec */
#aw-quiz-root .awq-ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
#aw-quiz-root .awq-btn{display:inline-block;padding:12px 24px;border-radius:3px;font-family:'Anton',sans-serif;font-weight:400;font-size:16px;line-height:20px;letter-spacing:2px;text-transform:uppercase;text-decoration:none;cursor:pointer;border:0;transition:color .3s,border-color .3s}
#aw-quiz-root .awq-btn.primary{background:#FF6F61;color:#162C59}
#aw-quiz-root .awq-btn.primary:hover{color:#fff}
#aw-quiz-root .awq-btn.ghost{background:transparent;color:#252525;border:2px solid #252525;padding:10px 22px}
#aw-quiz-root .awq-btn.ghost:hover{border-color:#FF6F61;color:#FF6F61}
#aw-quiz-root .awq-restart{display:block;margin:26px auto 0;background:none;border:0;color:#646464;font-family:'Poppins',sans-serif;font-size:14px;font-weight:600;cursor:pointer;text-decoration:underline}
#aw-quiz-root .awq-restart:hover{color:#252525}