/* The current subscription offer is the visual source for the whole web funnel. */
body.morning {
  --font-display: 'Quiz Manrope', sans-serif;
  --font-text: 'Quiz Manrope', sans-serif;
  --column: 640px;
  --gutter: 24px;
  --color-ink: #fff;
  --color-ink-raise: #f6f6f6;
  --color-card-hover: #eeeeee;
  --color-bone: #f5f5f5;
  --color-bone-hover: #eeeeee;
  --color-bone-line: #dfdfdf;
  --color-text-muted: #666;
  --color-text-on-bone-muted: #666;
  --color-lacquer: var(--color-oxblood);
  --color-lacquer-hover: var(--color-oxblood-deep);
  --color-lacquer-tint: #f7eded;
  --shadow-glow: none;
  --radius-md: 16px;
  --type-hero-size: clamp(32px,8vw,44px);
  --type-hero-weight: 500;
  --type-hero-line: 1.12;
  --type-hero-tracking: -.03em;
  --type-hero-case: none;
  --type-question-size: clamp(25px,6.4vw,32px);
  --type-question-weight: 500;
  --type-question-line: 1.2;
  --type-question-tracking: -.02em;
  --type-question-case: none;
  --type-title-weight: 500;
  --type-title-case: none;
  --type-title-tracking: -.01em;
  --type-label-weight: 500;
  --type-label-case: none;
  --type-label-tracking: 0;
  --type-action-weight: 500;
  --type-action-size: 16px;
  --type-action-case: none;
  --type-action-tracking: 0;
  --field-bg: #fff;
  --field-raise: #f5f5f5;
  --field-surface: #f5f5f5;
  --field-surface-hover: #eee;
  --field-line: #dfdfdf;
  --field-line-strong: #aaa;
  --field-text: #1a1a1a;
  --field-text-muted: #666;
  --field-text-faint: #777;
  --field-focus: var(--color-oxblood);
  --field-veil: #00000008;
  --field-veil-line: #00000018;
  --field-action-bg: var(--color-oxblood);
  --field-action-bg-hover: var(--color-oxblood-deep);
  --field-action-text: #fff;
  --field-action-shadow: none;
  background: #fff;
  color: #1a1a1a;
}
.morning .screen:not(.subscription-offer) { max-width: 640px; padding: 24px 24px 100px; background: #fff; }
.morning .screen.morning-result, .morning .screen.morning-hero { padding-bottom: 32px; }
.morning .btn-primary { border-radius: 12px; min-height: 54px; box-shadow: none; text-transform: none; letter-spacing: 0; font-weight: 500; }
.morning .nav-row__step { background: #f1f1f1; font-weight: 500; }
.morning .progress { background: #eee; height: 3px; }
.morning .option-card { border-color: transparent; min-height: 58px; padding: 16px; }
.morning .option-card[aria-pressed='true'], .morning .option-card[aria-checked='true'] { border-color: var(--color-oxblood); background: var(--color-lacquer-tint); box-shadow: none; }
.morning .option-card__title { font-weight: 400; }
.morning .option-card__desc { font-weight: 400; }
.morning .action-zone { height: auto; padding: 12px 24px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #eee; }
.morning .question__title { margin-top: 28px; }
.morning .question__help { color: #666; }
.morning-hero h1 { margin: 16px 0 0; }
.morning-hero-accent { color: var(--color-oxblood); }
.morning-hero-promise { margin-top: 20px; }
.morning-hero-portrait { height: 240px; position: relative; overflow: hidden; border-radius: 16px; background: #f5f5f5; margin-top: 28px; }
.morning-hero-portrait::before { content: ''; position: absolute; inset: 30% 0 0; background: var(--color-oxblood); border-radius: 16px; }
.morning-hero-portrait img { position: relative; height: 100%; width: 100%; object-fit: cover; object-position: 50% 22%; max-width: 380px; display: block; margin: auto; }
.morning-hero-caption { margin: 12px 0 24px; font-size: 13px; color: #666; text-align: center; }
.morning-hero > .btn-primary { width: 100%; }
.morning-hero > .morning-note { text-align: center; }
.morning .morning-pause h1 { color: var(--color-oxblood); }
.morning .morning-pause-photo { background: #f5f5f5; border-radius: 16px; padding-top: 16px; }
.morning .cases__eyebrow { display: none; }
.morning .case { background: #f5f5f5; border-radius: 16px; box-shadow: none; }
.morning .case__name { font-family: var(--font-text); font-weight: 500; text-transform: none; }
.morning .cases__hint { color: #666; }
.morning .case-compare__labels span { background: #fff; }
.morning .morning-personal-pick { background: #f5f5f5; }
.morning .morning-picked-lesson h2, .morning .morning-product-features dt { font-weight: 500; }
.morning .morning-product > h2 { color: var(--color-oxblood); }
.morning .morning-personal-more summary { font-weight: 500; }
@media (min-width: 700px) {
  .morning .screen:not(.subscription-offer) { padding-left: 40px; padding-right: 40px; padding-top: 32px; }
  .morning .action-zone > * { max-width: 560px; }
}
@media (max-width: 359px) {
  .morning .screen:not(.subscription-offer) { padding-left: 16px; padding-right: 16px; }
  .morning .action-zone { padding-left: 16px; padding-right: 16px; }
  .morning-hero-portrait { height: 210px; }
}

.morning-look-card { position: relative; }
.morning-look-zoom { position: absolute; top: 17px; left: 17px; width: var(--morning-option-photo); height: calc(var(--morning-option-photo) * 1.25); padding: 0; border: 0; border-radius: var(--radius-sm); background: transparent; cursor: zoom-in; display: flex; align-items: flex-end; justify-content: flex-end; }
.morning-look-zoom-icon { width: 28px; height: 28px; padding: 5px; margin: 4px; border-radius: 50%; background: #fff; color: var(--color-oxblood); }
.morning-look-zoom:focus-visible { outline: 2px solid var(--color-oxblood); outline-offset: 3px; }

/* Full-photo opening, based on the existing quiz-entry landing. */
.morning .screen.morning-hero.morning-cover { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; width: 100%; max-width: none; min-height: 100svh; padding: max(28px,env(safe-area-inset-top)) 24px max(24px,env(safe-area-inset-bottom)); margin: 0; background: #570912; color: #fff; overflow: hidden; }
.morning-cover-photo { position: absolute; inset: 0; z-index: -2; display: block; width: 100%; height: 100%; object-fit: cover; object-position: 48% top; }
.morning-cover::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg,rgba(55,0,8,.55),rgba(55,0,8,.05) 28%,rgba(55,0,8,.12) 42%,rgba(55,0,8,.85) 76%,#570912); }
.morning-cover h1 { margin: 0; font-size: clamp(32px,8.4vw,44px); line-height: 1.08; font-weight: 500; max-width: 400px; color: #fff; }
.morning-cover h1 span { display: block; }
.morning-cover-content { width: 100%; max-width: 400px; padding-top: 280px; }
.morning-cover-promise { font-size: 17px; line-height: 1.45; margin-bottom: 20px; }
.morning .morning-cover .btn-primary { width: 100%; color: #83191d; background: #fff; min-height: 56px; }
.morning .morning-cover .btn-primary:hover { background: #f3eded; }
.morning .morning-cover .morning-note { color: #fff; text-align: center; margin-top: 14px; }
.morning-cover-disclaimer { color: #f0dfe1; font-size: 12px; line-height: 1.45; margin: 10px auto 0; max-width: 340px; text-align: center; }
.morning-cover .text-action { color: #fff; display: block; margin: 8px auto 0; }
.morning-cover :is(button,a):focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
@media(min-width:741px) {
 .morning .screen.morning-hero.morning-cover { padding: 64px 7%; align-items: flex-end; }
 .morning-cover-photo { object-position: 35% 12%; }
 .morning-cover::before { background: linear-gradient(90deg,transparent 20%,rgba(75,4,14,.25) 48%,#610b16 90%); }
 .morning-cover h1, .morning-cover-content { width: 42%; max-width: 500px; }
 .morning-cover h1 { font-size: clamp(38px,4.3vw,64px); }
 .morning-cover-content { padding-top: 100px; }
}
@media(max-height:740px) and (max-width:740px) {
 .morning .screen.morning-hero.morning-cover { padding-top: 20px; padding-bottom: 16px; }
 .morning-cover h1 { font-size: 30px; max-width: 340px; }
 .morning-cover-content { padding-top: 210px; }
 .morning-cover-promise { font-size: 15px; margin-bottom: 14px; }
}

/* Same three-line heading grammar as the subscription offer. */
.morning-cover h1.morning-cover-title { font: 500 clamp(34px,9vw,46px)/1 'Quiz Manrope',sans-serif; letter-spacing: -.035em; text-align: center; }
.morning-cover-title > span:first-child { text-transform: uppercase; }
.morning-cover-title > span:last-child { font-weight: 300; }
.morning-cover-title em { display: block; position: relative; z-index: 1; font: 400 clamp(40px,11vw,54px)/.9 'Quiz Alistair',cursive; letter-spacing: 0; margin: -8px 0 -5px; -webkit-text-stroke: .5px currentColor; }
@media(min-width:741px) { .morning-cover h1.morning-cover-title { font-size: clamp(40px,4.3vw,62px); } .morning-cover-title em { font-size: clamp(48px,5vw,72px); margin: -12px 0 -8px; } }
@media(max-width:359px) { .morning-cover h1.morning-cover-title { font-size: 30px; } .morning-cover-title em { font-size: 38px; } }
/* Oversized signature overlaps the two Manrope lines, with a fine wine outline. */
.morning-cover-title em {
  font-size: clamp(56px,16vw,72px);
  line-height: .76;
  margin: -32px -12px 2px;
  color: #fff;
  -webkit-text-stroke: 1.8px #570912;
  paint-order: stroke fill;
}
@media(min-width:741px) {
  .morning-cover-title em { font-size: clamp(72px,7.2vw,106px); margin: -40px -20px -6px; }
}
@media(max-width:359px) {
  .morning-cover-title em { font-size: 52px; margin: -26px -10px 0; }
}
.morning-cover-title > span:last-child {
  font-size: .88em;
  margin-top: -6px;
}

/* Photo-led insights use the complete source photographs, not cutout figures. */
.morning .screen.morning-insight { justify-content: space-between; }
.morning-insight .nav-row { width: 100%; position: relative; z-index: 2; }
.morning-insight .nav-row__back { color: #fff; }
.morning-insight .step-pill { color: #fff; background: #570912b3; font-weight: 400; }
.morning-insight .morning-cover-content { padding-top: 300px; }
.morning-insight .morning-cover-content h1 { width: 100%; max-width: none; font-size: clamp(28px,7.5vw,40px); line-height: 1.1; margin: 0 0 16px; }
.morning-insight .morning-cover-promise { font-size: 15px; }
.morning-insight::before { background: linear-gradient(180deg,rgba(30,0,5,.4),transparent 25%,rgba(30,0,5,.12) 40%,rgba(35,0,7,.88) 77%,#350007); }
@media(min-width:741px) {
 .morning-insight .morning-cover-content { padding-top: 180px; }
 .morning-insight::before { background: linear-gradient(90deg,transparent 20%,rgba(35,0,7,.2) 45%,rgba(35,0,7,.94) 90%); }
}
@media(max-height:740px) and (max-width:740px) { .morning-insight .morning-cover-content { padding-top: 210px; } }
/* Product contents: separate rounded, outlined blocks. */
.morning .morning-product-features { display: grid; gap: 12px; }
.morning .morning-product-features > div {
  padding: 18px;
  border: 1px solid #dfdfdf;
  border-radius: 16px;
  background: #f7f7f7;
}
