/* awards.dad-look.com - The Dad Awards: black tie, gold, a red carpet and spotlights */
body { margin: 0; background: #0b0a08; color: #f5efe0; font-family: Helvetica, Arial, sans-serif; }
[hidden] { display: none !important; }
a { color: inherit; }
a:focus-visible, button:focus-visible { outline: 3px solid #f6d77a; outline-offset: 3px; }
.aw-kicker { margin: 0 0 8px; font-size: 13px; font-weight: 800; letter-spacing: 0.28em; text-transform: uppercase; color: #d9b24c; }
.aw-small { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: #a99f8a; }
.aw-label { margin: 14px 0 6px; font-size: 11px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; color: #8f8670; }

/* Hero with spotlights and the trophy */
.aw-hero { position: relative; overflow: hidden; padding: 70px 24px 80px; text-align: center; background: radial-gradient(ellipse at 50% 0%, #2a2214, #0b0a08 70%); }
.aw-lights span { position: absolute; top: -40%; width: 40%; height: 180%; background: linear-gradient(to bottom, rgba(255, 236, 180, 0.22), rgba(255, 236, 180, 0) 70%); filter: blur(6px); transform-origin: top center; pointer-events: none; }
.aw-lights span:first-child { left: 8%; transform: rotate(18deg); }
.aw-lights span:last-child { right: 8%; transform: rotate(-18deg); }
.aw-trophy { position: relative; display: block; width: 110px; height: auto; margin: 0 auto 18px; filter: drop-shadow(0 10px 30px rgba(246, 215, 122, 0.35)); }
.aw-hero h1 { position: relative; margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(46px, 9vw, 96px); font-weight: 400; line-height: 1; letter-spacing: 0.02em; background: linear-gradient(90deg, #a57d22, #f6d77a 40%, #fff3c4 50%, #f6d77a 60%, #a57d22); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }
.aw-sub { position: relative; margin: 16px auto 0; max-width: 640px; font-size: 18px; color: #d8cfb8; }
.aw-sub b { color: #f6d77a; }
.aw-scroll { position: relative; display: inline-block; margin-top: 26px; padding: 12px 26px; border: 1px solid #d9b24c; border-radius: 999px; color: #f6d77a; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; font-size: 14px; }
.aw-scroll:hover { background: #d9b24c; color: #0b0a08; }

.aw-page { max-width: 1000px; margin: 0 auto; padding: 0 24px; display: flex; flex-direction: column; gap: 64px; }
.aw-section-title, .aw-carpet h2, .aw-speech h2, .aw-people h2 { margin: 0; font-family: Georgia, serif; font-size: clamp(30px, 5vw, 42px); font-weight: 400; color: #f5efe0; }

/* Red carpet */
.aw-carpet { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; align-items: center; margin-top: -20px; padding: 28px; border-radius: 6px; background: linear-gradient(180deg, #7d1414, #5a0d0d); box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5); }
.aw-photo { position: relative; overflow: hidden; border-radius: 4px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); }
.aw-photo img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.aw-flash { position: absolute; inset: 0; background: #ffffff; opacity: 0; pointer-events: none; }
.aw-carpet .aw-kicker { color: #ffd88a; }
.aw-quote { margin: 16px 0 0; font-family: Georgia, serif; font-size: 22px; font-style: italic; line-height: 1.45; }
.aw-carpet .aw-small { color: #e8c3b8; }

/* Categories and envelopes */
.aw-intro { margin: 8px 0 24px; color: #a99f8a; }
.aw-list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.aw-category { padding: 24px; border: 1px solid #3a3226; border-radius: 6px; background: linear-gradient(180deg, #17140f, #100e0a); }
.aw-category h3 { margin: 0; font-family: Georgia, serif; font-size: 24px; font-weight: 400; color: #f6d77a; }
.aw-presenter { margin: 8px 0 0; font-size: 14px; font-style: italic; line-height: 1.5; color: #a99f8a; }
.aw-nominees { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.aw-nominees li { padding: 6px 10px; border-radius: 4px; background: #1d1912; }
.aw-category.is-open .aw-nominees .is-winner, html:not(.js) .aw-nominees .is-winner { background: #d9b24c; color: #0b0a08; font-weight: 800; }
.aw-open { display: inline-flex; align-items: center; gap: 10px; margin-top: 16px; min-height: 46px; padding: 0 18px; border: 1px solid #d9b24c; border-radius: 999px; background: none; color: #f6d77a; font: inherit; font-size: 15px; font-weight: 800; cursor: pointer; }
.aw-open:hover { background: rgba(217, 178, 76, 0.12); }
.aw-envelope { position: relative; width: 22px; height: 15px; border-radius: 2px; background: #f5efe0; overflow: hidden; }
.aw-envelope::after { content: ""; position: absolute; left: 0; right: 0; top: -9px; height: 18px; background: #d9b24c; transform: rotate(45deg) scale(0.75); transform-origin: center; }
.js .aw-winner { display: none; }
.js .aw-category.is-open .aw-winner { display: block; }
.js .aw-category.is-open .aw-open { display: none; }
.aw-winner { margin-top: 16px; padding: 18px; border-radius: 6px; background: #f5efe0; color: #0b0a08; text-align: center; }
.aw-goes { margin: 0; font-family: Georgia, serif; font-size: 16px; font-style: italic; color: #6b5a2e; }
.aw-name { margin: 6px 0 0; font-family: Georgia, serif; font-size: 26px; line-height: 1.2; }
.aw-share-award { margin-top: 12px; padding: 6px 14px; border: 1px solid #0b0a08; border-radius: 999px; background: none; font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.aw-share-award:hover { background: #0b0a08; color: #f6d77a; }

/* Acceptance speech */
.aw-speech { padding: 32px; border-radius: 6px; border: 1px solid #3a3226; background: radial-gradient(ellipse at 50% 0%, #241d11, #100e0a 70%); text-align: center; }
.aw-play { display: inline-flex; align-items: center; gap: 10px; margin-top: 18px; min-height: 54px; padding: 0 26px; border: 0; border-radius: 999px; background: #d9b24c; color: #0b0a08; font: inherit; font-size: 17px; font-weight: 900; cursor: pointer; }
.aw-play:hover { background: #f6d77a; }
.aw-transcript { max-width: 640px; margin: 24px auto 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-family: Georgia, serif; font-size: 19px; line-height: 1.5; text-align: left; }
.aw-transcript li { color: #d8cfb8; transition: color 0.3s ease; }
.aw-transcript.is-started li { color: #6f6754; }
.aw-transcript.is-started li.is-said { color: #f5efe0; }
.aw-transcript.is-started li.is-now { color: #f6d77a; }
.aw-playoff { font-style: italic; }

/* People's Choice */
.aw-people { padding: 32px; border-radius: 6px; border: 1px solid #3a3226; background: #100e0a; }
.aw-choices { margin: 18px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.aw-choice { display: grid; grid-template-columns: 170px minmax(0, 1fr) 56px; align-items: center; gap: 14px; width: 100%; min-height: 50px; padding: 0 16px; border: 1px solid #3a3226; border-radius: 6px; background: #17140f; color: #f5efe0; font: inherit; font-size: 16px; font-weight: 700; text-align: left; cursor: pointer; }
.aw-choice:hover:not([disabled]) { border-color: #d9b24c; }
.aw-choice[disabled] { cursor: default; }
.aw-choice.is-mine { border-color: #d9b24c; box-shadow: inset 0 0 0 1px #d9b24c; }
.aw-choice-bar { height: 10px; border-radius: 5px; background: #2a241a; overflow: hidden; }
.aw-choice-bar i { display: block; height: 100%; background: linear-gradient(90deg, #a57d22, #f6d77a); transition: width 0.8s ease; }
.aw-choice-result { text-align: right; font-variant-numeric: tabular-nums; color: #f6d77a; }
.aw-status-line { margin: 12px 0 0; font-weight: 700; color: #f6d77a; }
.aw-status-line:empty { display: none; }

/* Bottom */
.aw-bottom { max-width: 1000px; margin: 0 auto; padding: 72px 24px 48px; display: flex; flex-direction: column; gap: 28px; }
.aw-cta { padding: 44px 24px; border-radius: 6px; background: #f5efe0; color: #0b0a08; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.aw-cta .aw-kicker { color: #8a6a1f; }
.aw-cta h2 { margin: 0; font-family: Georgia, serif; font-size: 40px; font-weight: 400; }
.aw-cta p { margin: 0; max-width: 560px; font-size: 17px; line-height: 1.5; }
.aw-cta-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; box-sizing: border-box; width: 100%; max-width: 560px; min-height: 72px; padding: 18px 24px; border-radius: 999px; background: #ec6e6a; color: #ffffff; font-size: 21px; font-weight: 900; text-transform: uppercase; text-decoration: none; }
.aw-cta-button:hover { background: #d95450; }
.aw-cta-arrow { display: inline-block; }
.aw-share { min-height: 48px; padding: 0 22px; border: 2px solid #0b0a08; border-radius: 999px; background: none; color: #0b0a08; font: inherit; font-size: 16px; font-weight: 900; cursor: pointer; }
.aw-share:hover { background: #0b0a08; color: #f6d77a; }
.aw-status { margin: 0; font-size: 14px; font-weight: 700; color: #2e7d32; }
.aw-status:empty { display: none; }
.aw-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; font-size: 13px; line-height: 1.5; color: #8f8670; border-top: 1px solid #3a3226; padding-top: 14px; }

@media (max-width: 760px) {
	.aw-hero { padding: 50px 16px 64px; }
	.aw-page { padding: 0 16px; gap: 48px; }
	.aw-carpet { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 18px; }
	.aw-quote { font-size: 19px; }
	.aw-list { grid-template-columns: minmax(0, 1fr); }
	.aw-category { padding: 20px 16px; }
	.aw-speech, .aw-people { padding: 24px 16px; }
	.aw-transcript { font-size: 17px; }
	.aw-choice { grid-template-columns: minmax(0, 1fr) 48px; gap: 6px 10px; padding: 10px 14px; }
	.aw-choice-bar { grid-column: 1 / -1; grid-row: 2; }
	.aw-bottom { padding: 56px 16px 40px; }
	.aw-cta h2 { font-size: 32px; }
	.aw-cta-button { font-size: 18px; min-height: 64px; }
}

/* Animations - only with JavaScript and when the visitor allows motion */
@media (prefers-reduced-motion: no-preference) {
	.aw-lights span:first-child { animation: aw-sweep-left 7s ease-in-out infinite alternate; }
	.aw-lights span:last-child { animation: aw-sweep-right 8s ease-in-out infinite alternate; }
	.aw-hero h1 { animation: aw-shine 5s linear infinite; }
	.js .aw-trophy { animation: aw-rise 1s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
	.aw-flash { animation: aw-flash 4.5s 1s infinite; }
	.js .aw-category.is-open .aw-winner { animation: aw-reveal 0.6s cubic-bezier(0.2, 1.3, 0.4, 1) both; }
	.js .aw-category.is-open .is-winner { animation: aw-glow-row 1.2s ease 0.3s both; }
	.aw-open:hover .aw-envelope::after { transform: rotate(45deg) scale(0.75) translateY(-3px); transition: transform 0.2s ease; }
	.aw-transcript li.is-now { animation: aw-pulse 1.2s ease-in-out infinite; }
	.aw-cta-button { animation: aw-glow 2.2s ease-in-out infinite; transition: transform 0.15s ease; }
	.aw-cta-button:hover { transform: scale(1.02); }
	.aw-cta-arrow { animation: aw-nudge 1.1s ease-in-out infinite; }
}

@keyframes aw-sweep-left { from { transform: rotate(10deg); } to { transform: rotate(28deg); } }
@keyframes aw-sweep-right { from { transform: rotate(-10deg); } to { transform: rotate(-28deg); } }
@keyframes aw-shine { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@keyframes aw-rise { from { opacity: 0; transform: translateY(30px) scale(0.9); } to { opacity: 1; transform: none; } }
@keyframes aw-flash { 0%, 92%, 100% { opacity: 0; } 93% { opacity: 0.85; } 96% { opacity: 0; } 97% { opacity: 0.6; } }
@keyframes aw-reveal { from { opacity: 0; transform: translateY(-10px) scale(0.9); } to { opacity: 1; transform: none; } }
@keyframes aw-glow-row { 0% { box-shadow: 0 0 0 0 rgba(246, 215, 122, 0.8); } 100% { box-shadow: 0 0 0 10px rgba(246, 215, 122, 0); } }
@keyframes aw-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }
@keyframes aw-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(236, 110, 106, 0.5); } 50% { box-shadow: 0 0 0 12px rgba(236, 110, 106, 0); } }
@keyframes aw-nudge { 0%, 100% { transform: none; } 50% { transform: translateX(8px); } }