@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Montserrat:wght@400;500;600&display=swap');

.wros {
    --wros-black: #0c0b0a;
    --wros-charcoal: #171512;
    --wros-gold: #c8a554;
    --wros-gold-light: #e0c782;
    --wros-cream: #f4efe3;
    --wros-muted: #c7c0b2;
    background: var(--wros-black);
    color: var(--wros-cream);
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.8;
    margin: 0 calc(50% - 50vw);
    max-width: none;
    overflow: hidden;
    width: 100vw;
}

.wros *, .wros *::before, .wros *::after { box-sizing: border-box; }
.wros img { display: block; height: 100%; max-width: none; object-fit: cover; width: 100%; }
.wros h1, .wros h2 { color: var(--wros-cream); font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; letter-spacing: -.025em; line-height: .98; margin: 0 0 28px; }
.wros h1 { font-size: clamp(4.5rem, 9vw, 8.5rem); }
.wros h2 { font-size: clamp(3rem, 5vw, 5rem); }
.wros p { margin: 0 0 22px; }
.wros-wrap { margin: 0 auto; max-width: 1240px; padding-left: 40px; padding-right: 40px; }
.wros-section { padding: 120px 0; }
.wros-section--dark { background: var(--wros-charcoal); }
.wros-grid { align-items: center; display: grid; gap: 80px; grid-template-columns: 1fr 1.12fr; }
.wros-eyebrow, .wros-kicker { color: var(--wros-gold-light); font-size: .76rem; font-weight: 600; letter-spacing: .24em; margin-bottom: 18px; text-transform: uppercase; }
.wros-lede { color: #fff; font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.55rem; line-height: 1.45; }

.wros-hero { height: min(900px, 88vh); min-height: 680px; position: relative; }
.wros-hero__image { inset: 0; position: absolute; }
.wros-hero__shade { background: linear-gradient(90deg, rgba(6,5,4,.91) 0%, rgba(6,5,4,.58) 44%, rgba(6,5,4,.15) 72%), linear-gradient(0deg, rgba(6,5,4,.72), transparent 42%); inset: 0; position: absolute; }
.wros-hero__content { left: max(40px, calc((100vw - 1160px) / 2)); max-width: 770px; position: absolute; top: 50%; transform: translateY(-48%); }
.wros-hero__intro { color: #e8e2d6; font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.6rem; line-height: 1.45; max-width: 590px; }
.wros-scroll { border-bottom: 1px solid var(--wros-gold); color: var(--wros-gold-light); display: inline-flex; font-size: .78rem; font-weight: 600; gap: 12px; letter-spacing: .16em; padding: 10px 0; text-decoration: none; text-transform: uppercase; }

.wros-collage { display: grid; gap: 14px; grid-template-columns: 1fr 1fr; grid-template-rows: auto 240px; justify-self: end; max-width: 560px; width: 100%; }
.wros-collage img { filter: saturate(.88) contrast(1.04); }
.wros-collage__wide { aspect-ratio: 471 / 533; grid-column: 1 / -1; height: auto !important; object-fit: contain !important; object-position: center center; }
.wros-factory-grid { display: grid; gap: 18px; grid-template-columns: 1.15fr .85fr; height: 620px; }
.wros-factory-grid img:first-child { margin-top: 55px; height: calc(100% - 55px); }
.wros-heading { margin: 0 auto 58px; max-width: 850px; text-align: center; }
.wros-heading p:last-child { color: var(--wros-muted); }

.wros-grid--blender { grid-template-columns: 1.12fr .88fr; }
.wros-blender__photos { height: 680px; position: relative; }
.wros-blender__main { left: 0; position: absolute; top: 0; width: 74% !important; }
.wros-blender__detail { border: 10px solid var(--wros-black); bottom: 0; height: 52% !important; position: absolute; right: 0; width: 51% !important; }
.wros blockquote { border-left: 2px solid var(--wros-gold); color: var(--wros-gold-light); font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(1.75rem, 3vw, 2.7rem); font-style: italic; line-height: 1.28; margin: 42px 0 0; padding: 4px 0 4px 30px; }
.wros blockquote span { font-size: 4rem; line-height: 0; margin-right: 4px; vertical-align: -.42em; }

.wros-section--goldband { background: #211a0e; border-bottom: 1px solid rgba(200,165,84,.35); border-top: 1px solid rgba(200,165,84,.35); }
.wros-grid--seventeen { gap: 54px; grid-template-columns: .45fr 1fr .95fr; }
.wros-grid--seventeen img { height: 430px; }
.wros-number { color: var(--wros-gold); font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(8rem, 16vw, 13rem); font-weight: 600; letter-spacing: -.08em; line-height: .7; opacity: .9; }

.wros-final-five { text-align: center; }
.wros-final-five__images { display: grid; gap: 18px; grid-template-columns: 1.2fr .8fr; height: 520px; margin-bottom: 52px; }
.wros-button { border: 1px solid var(--wros-gold); color: var(--wros-gold-light); display: inline-block; font-size: .78rem; font-weight: 600; letter-spacing: .17em; padding: 17px 29px; text-decoration: none; text-transform: uppercase; transition: .2s ease; }
.wros-button:hover { background: var(--wros-gold); color: var(--wros-black); }

.wros-closing { background: radial-gradient(circle at 50% 0%, #302617, #0c0b0a 58%); padding: 130px 0 140px; text-align: center; }
.wros-closing__inner { max-width: 920px; }
.wros-closing__inner > p:first-child { color: var(--wros-muted); }
.wros-closing__statement { color: #fff; font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.25; margin: 38px 0 48px !important; }
.wros-rule { background: var(--wros-gold); height: 1px; margin: 0 auto 28px; width: 90px; }
.wros-tagline { font-size: .8rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.wros-tagline span { color: var(--wros-gold-light); }

@media (max-width: 900px) {
    .wros { font-size: 16px; }
    .wros-wrap { padding-left: 24px; padding-right: 24px; }
    .wros-section { padding: 82px 0; }
    .wros-grid, .wros-grid--blender, .wros-grid--seventeen { gap: 45px; grid-template-columns: 1fr; }
    .wros-hero { height: 78vh; min-height: 620px; }
    .wros-hero__shade { background: linear-gradient(0deg, rgba(6,5,4,.92), rgba(6,5,4,.18) 90%); }
    .wros-hero__content { bottom: 55px; left: 24px; max-width: calc(100% - 48px); top: auto; transform: none; }
    .wros-collage { grid-template-rows: auto 190px; justify-self: center; }
    .wros-factory-grid { height: 520px; }
    .wros-grid--blender .wros-copy { order: -1; }
    .wros-grid--seventeen { text-align: center; }
    .wros-number { margin-bottom: -10px; }
    .wros-grid--seventeen img { height: 440px; }
}

@media (max-width: 560px) {
    .wros h1 { font-size: clamp(3.8rem, 19vw, 5.3rem); }
    .wros h2 { font-size: 3rem; }
    .wros-hero__intro { font-size: 1.3rem; }
    .wros-collage { grid-template-columns: 1fr 1fr; grid-template-rows: auto 170px; }
    .wros-factory-grid { grid-template-columns: 1fr; height: auto; }
    .wros-factory-grid img { height: 310px; }
    .wros-factory-grid img:first-child { height: 310px; margin-top: 0; }
    .wros-blender__photos { height: 520px; }
    .wros-blender__main { width: 86% !important; }
    .wros-blender__detail { height: 43% !important; width: 55% !important; }
    .wros-final-five__images { grid-template-columns: 1fr; height: auto; }
    .wros-final-five__images img { height: 320px; }
    .wros-closing { padding: 95px 0; }
}

@media (prefers-reduced-motion: reduce) {
    .wros * { scroll-behavior: auto !important; transition: none !important; }
}