:root {
    --case-ink: #111214;
    --case-muted: #686b70;
    --case-gold: #c7a76a;
    --case-line: #e5e3df;
    --case-paper: #f6f5f2;
}

.case-study-page { color: var(--case-ink); background: #fff; }
.case-study-page h1, .case-study-page h2, .case-study-page h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -.025em; }
.case-hero { padding: 9rem 0 4rem; background: #111214; color: #fff; }
.case-hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; gap: 3rem; align-items: center; }
.case-hero-copy { max-width: 620px; }
.case-back-link { display: inline-block; margin-bottom: 2.3rem; color: #dedbd4; text-decoration: none; font-size: .88rem; }
.case-back-link:hover { color: #fff; }
.case-eyebrow { margin: 0 0 .8rem; color: var(--case-gold); font-size: .75rem; font-weight: 700; letter-spacing: .15em; line-height: 1.5; text-transform: uppercase; }
.case-hero h1, .case-index-hero h1, .royal-hero h1 { margin: 0 0 1rem; font-size: clamp(2.5rem, 5vw, 4.6rem); line-height: 1.04; }
.case-subtitle { margin: 0 0 1.5rem; color: #d0cec9; font-size: .95rem; letter-spacing: .04em; }
.case-lead { max-width: 580px; margin: 0; color: #e2e0dc; font-size: 1.1rem; line-height: 1.75; }
.case-hero-image { margin: 0; height: 420px; overflow: hidden; border-radius: 2px; background: #252525; }
.case-hero-image img { width: 100%; height: 100%; object-fit: cover; }
.case-metrics { padding: 1.7rem 0; border-bottom: 1px solid var(--case-line); }
.case-metrics-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.case-metric { display: flex; flex-direction: column; gap: .25rem; padding: .4rem 1.2rem; border-left: 1px solid var(--case-gold); }
.case-metric strong { font-family: Georgia, "Times New Roman", serif; font-size: 1.7rem; font-weight: 500; }
.case-metric span { color: var(--case-muted); font-size: .88rem; }
.case-story { max-width: 900px; padding-top: 3rem; padding-bottom: 4rem; }
.case-story-block { display: grid; grid-template-columns: 4rem 1fr; gap: 1rem; padding: 2rem 0; border-bottom: 1px solid var(--case-line); }
.case-story-index { padding-top: .2rem; color: var(--case-gold); font-size: .85rem; font-weight: 700; letter-spacing: .08em; }
.case-story-block h2 { margin: 0 0 .8rem; font-size: clamp(1.6rem, 3vw, 2.25rem); }
.case-story-block p { max-width: 720px; margin: 0; color: #55585c; font-size: 1.02rem; line-height: 1.85; }
.case-cta { padding: 3.5rem 0; background: var(--case-paper); }
.case-cta-inner { display: flex; justify-content: space-between; align-items: center; gap: 2rem; }
.case-cta h2 { max-width: 650px; margin: 0; font-size: clamp(1.7rem, 3vw, 2.7rem); }
.case-button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-height: 50px; padding: .8rem 1.35rem; border: 1px solid var(--case-gold); background: var(--case-gold); color: #111214; font-size: .9rem; font-weight: 700; text-decoration: none; transition: background .18s ease, color .18s ease; }
.case-button:hover { background: transparent; color: inherit; }
.case-index-hero { padding: 10rem 0 4.5rem; background: #111214; color: #fff; }
.case-index-hero .container { max-width: 900px; }
.case-index-hero h1 { max-width: 800px; }
.case-index-hero .container > p:last-child { max-width: 700px; color: #d0cec9; font-size: 1.08rem; line-height: 1.7; }
.case-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; padding-top: 4rem; padding-bottom: 4rem; }
.case-card { min-width: 0; border: 1px solid var(--case-line); background: #fff; transition: transform .2s ease, box-shadow .2s ease; }
.case-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgb(0 0 0 / 9%); }
.case-card a { display: block; height: 100%; color: inherit; text-decoration: none; }
.case-card img { width: 100%; height: 210px; object-fit: cover; background: #eee; }
.case-card-copy { padding: 1.4rem; }
.case-card h2 { min-height: 3.5rem; margin: .5rem 0 .7rem; font-size: 1.55rem; line-height: 1.15; }
.case-card-copy > p:not(.case-eyebrow) { min-height: 3rem; color: var(--case-muted); line-height: 1.6; }
.case-card-copy > span { display: inline-block; margin-top: .6rem; color: #5b4828; font-size: .88rem; font-weight: 700; }
.royal-hero { padding: 9rem 0 4rem; background: #111214; color: #fff; }
.royal-hero-grid { display: grid; grid-template-columns: 1fr .9fr; align-items: center; gap: 3rem; }
.royal-hero-grid > div { max-width: 590px; }
.royal-hero-grid > img { width: 100%; max-height: 520px; aspect-ratio: 4 / 3; object-fit: cover; }
.royal-tagline { margin: 0 0 1.2rem; color: var(--case-gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.5rem; }
.royal-hero .case-button { margin-top: 1.7rem; }
.royal-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; padding-top: 3rem; padding-bottom: 3rem; }
.royal-gallery figure { margin: 0; background: var(--case-paper); }
.royal-gallery img { display: block; width: 100%; height: 360px; object-fit: cover; }
.royal-gallery figcaption { padding: .8rem 1rem; color: var(--case-muted); font-size: .85rem; }
.royal-intro { padding: 4rem 0; background: var(--case-paper); }
.royal-intro .container { max-width: 860px; }
.royal-intro h2, .royal-use-cases h2 { max-width: 760px; margin: 0 0 1rem; font-size: clamp(2rem, 3.5vw, 3rem); }
.royal-intro p:last-child { max-width: 760px; margin: 0; color: #55585c; font-size: 1.04rem; line-height: 1.8; }
.royal-details { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; padding-top: 4rem; padding-bottom: 4rem; }
.royal-details > div { padding: 2rem; border: 1px solid var(--case-line); }
.royal-details h2 { margin: 0 0 1.2rem; font-size: 2rem; }
.royal-details ul { padding-left: 1.2rem; color: #55585c; line-height: 2; }
.royal-details a { color: #5b4828; font-weight: 700; text-decoration: none; }
.royal-price { display: block; margin: .8rem 0; font-family: Georgia, "Times New Roman", serif; font-size: 3rem; font-weight: 500; }
.royal-note { color: var(--case-muted); font-size: .9rem; }
.royal-use-cases { padding: 4rem 0; background: #111214; color: #fff; }
.royal-use-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin-top: 2rem; }
.royal-use-grid article { padding: 1.4rem; border-top: 1px solid var(--case-gold); background: #1d1e20; }
.royal-use-grid article > span { color: var(--case-gold); font-size: .8rem; font-weight: 700; letter-spacing: .1em; }
.royal-use-grid h3 { margin: 1rem 0 .6rem; font-size: 1.45rem; }
.royal-use-grid p { margin: 0; color: #d0cec9; line-height: 1.65; }

@media (max-width: 767.98px) {
    .case-hero, .royal-hero { padding-top: 7rem; }
    .case-hero-grid, .royal-hero-grid { grid-template-columns: 1fr; gap: 2rem; }
    .case-hero-image { height: 280px; }
    .case-metrics-grid { grid-template-columns: 1fr; gap: .7rem; }
    .case-metric { padding: .35rem .9rem; }
    .case-story-block { grid-template-columns: 2.5rem 1fr; gap: .6rem; }
    .case-cta-inner { align-items: flex-start; flex-direction: column; }
    .case-card-grid, .royal-use-grid { grid-template-columns: 1fr; }
    .case-card h2, .case-card-copy > p:not(.case-eyebrow) { min-height: 0; }
    .royal-gallery, .royal-details { grid-template-columns: 1fr; }
    .royal-gallery img { height: 260px; }
}

/* Added for distinct case-study artwork and embedded footage. */
.case-hero-visual, .case-card-visual { display: flex; align-items: flex-end; position: relative; overflow: hidden; color: #fff; background: radial-gradient(ellipse at 78% 20%, #5b4828 0, transparent 42%), linear-gradient(135deg, #242528, #0c0d0f 72%); }
.case-hero-visual { min-height: 420px; padding: 2.2rem; border-radius: 2px; }
.case-hero-visual::before, .case-card-visual::before { content: ""; position: absolute; inset: 12% 8% auto auto; width: 42%; aspect-ratio: 1; border: 1px solid rgb(199 167 106 / 40%); border-radius: 50%; }
.case-hero-visual span, .case-card-visual span { position: relative; color: #e7d4ac; font-size: .8rem; font-weight: 700; letter-spacing: .16em; }
.case-card-visual { height: 210px; padding: 1.2rem; }
.case-card-visual span { font-size: .68rem; }
.case-video-section { padding: 3.5rem 0; background: var(--case-paper); }
.case-video-inner { display: grid; grid-template-columns: .72fr 1.28fr; gap: 2rem; align-items: center; }
.case-video-inner h2 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.5rem); }
.case-video-inner video { display: block; width: 100%; max-height: 540px; background: #111; }
.case-video-note { margin: .8rem 0 0; color: var(--case-muted); font-size: .9rem; }
@media (max-width: 767.98px) { .case-hero-visual { min-height: 280px; } .case-video-inner { grid-template-columns: 1fr; gap: 1.2rem; } }