/* Landscape recipe heroes, with prepared square photographs for print. */
.recipe__photograph picture { display: contents; }

@media screen and (max-width: 47.999rem) {
  .recipe--landscape .recipe__photograph { aspect-ratio: 2 / 1; }
}

@media screen and (min-width: 48rem) {
  .recipe--landscape {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 0;
    padding: 1.5rem 2.5rem 4rem;
  }

  /* White lettering for dark backgrounds. Review this list when replacing photographs. */
  .recipe--landscape:is(
    .recipe--100-year-old-cigar,
    .recipe--151-swizzle,
    .recipe--absinthe-cocktail,
    .recipe--absinthe-suissesse,
    .recipe--adonis,
    .recipe--affinity,
    .recipe--aku-aku,
    .recipe--alexander,
    .recipe--algonquin,
    .recipe--amaro-sour,
    .recipe--americano,
    .recipe--ancient-mariner,
    .recipe--apple-cart,
    .recipe--bamboo,
    .recipe--beachcomber,
    .recipe--bensonhurst,
    .recipe--black-manhattan,
    .recipe--blackthorn-irish,
    .recipe--blood-and-sand,
    .recipe--bobby-burns,
    .recipe--boulevardier,
    .recipe--bramble,
    .recipe--brancolada,
    .recipe--brandy-crusta,
    .recipe--brandy-daisy,
    .recipe--brandy-scaffa,
    .recipe--brown-derby,
    .recipe--camerons-kick,
    .recipe--carajillo-43,
    .recipe--chartreuse-swizzle,
    .recipe--clairin-regal-sour,
    .recipe--closing-argument,
    .recipe--cobble-hill,
    .recipe--coffee-cocktail,
    .recipe--conference,
    .recipe--coronation-cocktail-joseph-rose,
    .recipe--coronation-no-1,
    .recipe--corpse-reviver-no-1,
    .recipe--demerara-dry-float,
    .recipe--diamondback,
    .recipe--diki-diki,
    .recipe--dirty-martini,
    .recipe--donga-punch,
    .recipe--drunk-uncle,
    .recipe--east-india-cocktail,
    .recipe--eeyores-requiem,
    .recipe--el-presidente,
    .recipe--espresso-martini,
    .recipe--fancy-free,
    .recipe--final-ward,
    .recipe--fog-cutter,
    .recipe--formidable-dragon,
    .recipe--fourth-regiment,
    .recipe--french-connection,
    .recipe--gin-alexander,
    .recipe--gin-and-tonic,
    .recipe--gold-rush,
    .recipe--golden-dawn,
    .recipe--golden-dream,
    .recipe--grasshopper,
    .recipe--greenpoint,
    .recipe--gunner,
    .recipe--halekulani,
    .recipe--heart-of-glass,
    .recipe--hoffman-house-cocktail,
    .recipe--horsefeather,
    .recipe--hot-toddy,
    .recipe--hotel-nacional,
    .recipe--humuhumunukunukuapua-a,
    .recipe--hurricane,
    .recipe--improved-whiskey-cocktail,
    .recipe--irish-coffee,
    .recipe--japanese-cocktail,
    .recipe--jet-pilot,
    .recipe--journalist-cocktail,
    .recipe--jungle-bird,
    .recipe--la-guildive,
    .recipe--la-louisiane,
    .recipe--leche-de-pantera-spanish,
    .recipe--left-hand,
    .recipe--little-italy,
    .recipe--lost-lake,
    .recipe--lucien-gaudin,
    .recipe--mai-tai,
    .recipe--mamie-taylor,
    .recipe--manhattan,
    .recipe--martinez,
    .recipe--mary-pickford,
    .recipe--metropole-cocktail,
    .recipe--midnight-stinger,
    .recipe--mint-julep,
    .recipe--missionarys-downfall,
    .recipe--monte-carlo,
    .recipe--monte-cassino,
    .recipe--moscow-mule,
    .recipe--mr-bali-hai,
    .recipe--mundo-perdido,
    .recipe--new-orleans-brandy-milk-punch,
    .recipe--new-york-sour,
    .recipe--nuclear-daiquiri,
    .recipe--nui-nui,
    .recipe--oaxaca-old-fashioned,
    .recipe--obituary,
    .recipe--old-fashioned,
    .recipe--old-pal,
    .recipe--oriental-cocktail,
    .recipe--pago-pago-cocktail,
    .recipe--paper-plane,
    .recipe--penicillin,
    .recipe--perfect-manhattan,
    .recipe--picon-punch,
    .recipe--pina-verde,
    .recipe--poolside-in-italy,
    .recipe--port-au-prince,
    .recipe--port-light,
    .recipe--porto-flip,
    .recipe--preakness,
    .recipe--presbyterian,
    .recipe--prince-of-wales-1887,
    .recipe--qb-cooler,
    .recipe--queens-park-hotel-super-cocktail,
    .recipe--queens-park-swizzle,
    .recipe--red-hook,
    .recipe--remember-the-alimony,
    .recipe--remember-the-maine,
    .recipe--rob-roy,
    .recipe--roman-holiday,
    .recipe--rusty-nail,
    .recipe--samoan-fog-cutter,
    .recipe--scofflaw,
    .recipe--seelbach,
    .recipe--sharpie-mustache,
    .recipe--sherry-flip,
    .recipe--shrunken-skull,
    .recipe--sidecar,
    .recipe--sidewinders-fang,
    .recipe--sidra-ponche,
    .recipe--sloe-gin-fizz,
    .recipe--southside,
    .recipe--soyer-au-champagne,
    .recipe--steves-rum-barrel,
    .recipe--stinger,
    .recipe--suffering-bastard,
    .recipe--the-joy-division,
    .recipe--tipperary,
    .recipe--toronto,
    .recipe--tradewinds,
    .recipe--trinidad-sour,
    .recipe--twenty-seventy-swizzle,
    .recipe--up-to-date,
    .recipe--vieux-carre,
    .recipe--ward-eight,
    .recipe--whiskey-smash,
    .recipe--whiskey-sour,
    .recipe--whisky-mac,
    .recipe--white-cargo,
    .recipe--widows-kiss,
    .recipe--zombie
  ) { --hero-text: var(--paper); }

  .recipe--landscape .recipe__body { display: contents; }

  .recipe--landscape .recipe__photograph {
    position: relative;
    grid-column: 1 / -1;
    grid-row: 1;
    width: 100%;
    aspect-ratio: 2;
    border-radius: 0.25rem;
  }

  /* Optional warm shading; the photographs are shown without it by default. */
  .recipe--landscape .recipe__photograph::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgb(18 15 11 / 72%) 0%, rgb(18 15 11 / 64%) 50%, transparent 65%);
    opacity: var(--hero-overlay-opacity, 0);
    content: "";
  }

  .recipe--landscape .recipe__identity {
    z-index: 1;
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    min-height: 0;
    padding: clamp(1.5rem, 3.5vw, 3rem);
    padding-bottom: 0;
    color: var(--hero-text, var(--ink));
  }

  .recipe--landscape .recipe__header h1 {
    color: inherit;
    font-size: clamp(2.75rem, 5vw, 3.75rem);
    line-height: 1;
    text-wrap: initial;
  }

  .recipe--landscape .recipe__header p { color: inherit; }

  .recipe--landscape .recipe__identity .recipe__details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.5rem;
    margin-top: 1.75rem;
    padding: 0;
  }

  .recipe--landscape .recipe__identity .recipe__details div { min-width: 0; }
  .recipe--landscape .recipe__identity .recipe__details .recipe__garnish { grid-column: 1 / -1; }
  .recipe--landscape .recipe__identity dd { font-size: 0.875rem; }
  .recipe--landscape .recipe__identity small { display: inline; margin-top: 0; }
  .recipe--landscape .recipe__identity dt,
  .recipe--landscape .recipe__identity small { color: inherit; }

  .recipe--landscape .recipe__work {
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 2.75rem 0 0;
  }

  .recipe--landscape .recipe__related {
    grid-column: 1 / -1;
    grid-row: 3;
    margin: 3.5rem 0 0;
  }
}

@media screen and (min-width: 48rem) and (max-width: 69.999rem) {
  .recipe--landscape { padding-inline: 1rem; }
  .recipe--landscape .recipe__identity { padding: 1rem 1.25rem 0; }
  .recipe--landscape .recipe__header h1 { font-size: 2rem; }
  .recipe--landscape .recipe__header p { margin-top: 0.75rem; font-size: 0.875rem; line-height: 1.45; }
  .recipe--landscape .recipe__identity .recipe__details {
    gap: 0.75rem;
    margin-top: 0.75rem;
  }
}

@media screen and (min-width: 48rem) {
  .recipe--landscape .recipe__work { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media screen and (forced-colors: active) and (min-width: 48rem) {
  .recipe--landscape .recipe__identity { color: CanvasText; background: Canvas; }
  .recipe--landscape .recipe__header p,
  .recipe--landscape .recipe__identity dt,
  .recipe--landscape .recipe__identity small { color: CanvasText; }
}
