.cfg-page{--wine:#7f0034;--warm:#f7f2ec;color:#26352f}
.cfg-page .section-inner{width:calc(100% - 48px);max-width:1180px;margin:auto}
.cfg-opening{padding-top:36px}
.cfg-opening .detail-breadcrumb{margin-bottom:48px;font-size:.8rem}
.cfg-page .kicker{font-size:.73rem;letter-spacing:.14em;text-transform:uppercase;color:var(--wine);font-weight:700}
.cfg-page h1{font-size:clamp(2.8rem,6vw,5.5rem);line-height:1.08;letter-spacing:-.055em;font-weight:650;margin:16px 0 28px}
.cfg-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;margin:0 0 40px}
.cfg-intro p{margin:0;color:#57665f;max-width:48ch;line-height:1.8}
.cfg-intro .cfg-deck{font-size:clamp(1.3rem,2.3vw,1.8rem);line-height:1.35;color:#3d5147;letter-spacing:-.025em}

.cfg-showcase{background:radial-gradient(ellipse at 50% 10%,#fff 0,#f7f2ec 65%);overflow:hidden}
.cfg-scene{position:relative;max-width:1440px;margin:auto;aspect-ratio:2.08;container-type:inline-size}
.cfg-scene-label{position:absolute;top:4cqw;left:6cqw;font-size:1.2cqw;font-weight:600;color:#6e2540}
.cfg-scene-label span{display:block;font-size:.8cqw;color:#75685e;margin-top:.5cqw;font-weight:400;letter-spacing:.07em;text-transform:uppercase}

.cfg-desktop{position:absolute;left:12cqw;top:9cqw;width:55cqw}
.cfg-monitor{padding:.8cqw;background:linear-gradient(120deg,#343c3e,#101819);border-radius:1.1cqw;box-shadow:0 1cqw 2.4cqw #3e302520;border:1px solid #697171}
.cfg-browser-bar{display:flex;align-items:center;gap:.35cqw;background:#eeeae4;height:1.7cqw;border-radius:.35cqw .35cqw 0 0;padding:0 .7cqw}
.cfg-browser-bar i{width:.35cqw;height:.35cqw;background:#bcb5ab;border-radius:50%}
.cfg-browser-bar span{font-size:.55cqw;margin:auto;color:#6e6a62;padding-right:3cqw}
.cfg-monitor-view{height:26.5cqw;overflow:hidden;background:#fff}
.cfg-monitor-view img{width:100%;height:auto;transform:translateY(-8cqw)}
.cfg-monitor-neck{width:11cqw;height:4cqw;margin:auto;background:linear-gradient(90deg,#b9babc,#dfdfe0,#a1a3a5);clip-path:polygon(22% 0,78% 0,88% 100%,12% 100%)}
.cfg-monitor-foot{height:.7cqw;width:21cqw;background:linear-gradient(#bfc1c2,#e8e8e8,#989a9b);border-radius:50% 50% .3cqw .3cqw;margin:auto;box-shadow:0 .7cqw 1.3cqw #493e2c20}

.cfg-tablet{position:absolute;left:64cqw;top:10cqw;width:24.5cqw;height:33.8cqw;padding:.65cqw;background:linear-gradient(135deg,#4f5453,#172022);border-radius:1.3cqw;border:1px solid #858a87;box-shadow:0 1.3cqw 2.5cqw #40342330;overflow:hidden;transform:rotate(3deg)}
.cfg-tablet img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:.7cqw}
.cfg-phone{position:absolute;left:54.3cqw;top:22cqw;width:12.3cqw;height:25.4cqw;background:#172022;border:.2cqw solid #8b8e8d;border-radius:2cqw;padding:.6cqw .4cqw .4cqw;box-shadow:0 1cqw 2cqw #40342333;overflow:hidden;transform:rotate(-3deg)}
.cfg-phone img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:1.4cqw}
.cfg-island{position:absolute;top:.7cqw;left:3.7cqw;width:4.5cqw;height:1.1cqw;background:#172022;border-radius:2cqw}
.cfg-project-logo{position:absolute;left:7.5cqw;top:35cqw;width:9cqw;box-shadow:0 .8cqw 1.5cqw #4c253421;transform:rotate(-3deg)}
.cfg-scene-footer{position:absolute;left:6cqw;right:6cqw;bottom:1.2cqw;display:flex;justify-content:space-between;font-size:.75cqw;color:#766459;letter-spacing:.06em;text-transform:uppercase}

.cfg-image-note{font-size:.73rem;color:#677169;margin:14px 0 24px}
.cfg-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;border-top:1px solid #e0e4df;border-bottom:1px solid #e0e4df;padding:28px 0;margin:0}
.cfg-facts dt{color:#677169;font-size:.75rem;margin-bottom:8px}
.cfg-facts dd{margin:0;font-size:.95rem;font-weight:600}
.cfg-page h2{font-size:clamp(1.9rem,3.1vw,2.8rem);line-height:1.15;letter-spacing:-.04em;font-weight:600;margin:16px 0 24px}
.cfg-page h3{font-size:1.2rem;line-height:1.35;letter-spacing:-.025em;font-weight:650}
.cfg-challenge{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;padding:80px 0 60px}
.cfg-challenge p:not(.kicker),.cfg-columns p{color:#57665f;line-height:1.85;margin-top:0}
.cfg-text-link{display:inline-block;color:var(--wine);font-size:.9rem;text-decoration:underline;text-underline-offset:4px;font-weight:600;margin-top:8px}
.cfg-contribution{padding:16px 0 80px}
.cfg-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:36px}
.cfg-columns article{border-top:1px solid #bcb9ac;padding-top:20px}
.cfg-number{color:#80465b;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase}
.cfg-columns p{font-size:.95rem}
.cfg-details{background:#f7f2ec;padding:64px 0}
.cfg-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:36px}
.cfg-detail-grid figure{margin:0;min-width:0}
.cfg-detail-image{aspect-ratio:1/1.12;overflow:hidden;background:#fff;border-radius:6px;box-shadow:0 8px 25px #573f2a0a}
.cfg-detail-image img{width:100%;height:auto}
.cfg-plate-image img{transform:translateY(-2.5%)}
.cfg-recipes-image img{transform:translateY(-8%)}
.cfg-detail-grid figcaption{padding-top:24px}
.cfg-detail-grid h3{margin:12px 0}
.cfg-detail-grid p{max-width:46ch;line-height:1.8;color:#57665f;font-size:.95rem;margin:0}
.cfg-reach{padding:80px 0;display:grid;grid-template-columns:1fr 1fr;gap:60px;border-bottom:1px solid #e0e4df}
.cfg-reach p:not(.kicker){color:#677169;max-width:40ch;line-height:1.7;font-size:.85rem}
.cfg-reach dl{display:flex;align-items:center;gap:48px;margin:0}
.cfg-reach dt{font-size:.75rem;color:#677169;margin-bottom:10px}
.cfg-reach dd{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.2;letter-spacing:-.04em;color:var(--wine);margin:0;font-weight:600}
.cfg-reach dd span{display:block;font-size:.9rem;letter-spacing:0;margin-top:8px;color:#57665f;font-weight:400}
.cfg-closing{text-align:center;padding:72px 0}
.cfg-closing p:not(.kicker){color:#57665f;max-width:48ch;margin:0 auto 28px;line-height:1.8}
.cfg-closing .button{background:var(--wine);border-color:var(--wine)}
.cfg-related{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;border-top:1px solid #e0e4df;padding:24px 0 48px;font-size:.85rem;color:var(--wine)}

@media(max-width:900px){.cfg-challenge,.cfg-reach{gap:32px}
.cfg-columns{gap:24px}
.cfg-reach dl{gap:24px}
.cfg-detail-grid{gap:24px}
}

@media(max-width:600px){.cfg-page .section-inner{width:calc(100% - 40px)}
.cfg-opening{padding-top:24px}
.cfg-opening .detail-breadcrumb{margin-bottom:32px;font-size:.7rem}
.cfg-page h1{font-size:clamp(2.5rem,11vw,3.5rem)}
.cfg-intro{grid-template-columns:1fr;gap:20px;margin-bottom:30px}
.cfg-scene{aspect-ratio:1.3}
.cfg-scene-label{left:5cqw;top:5cqw;font-size:2.6cqw}
.cfg-scene-label span{font-size:1.9cqw}
.cfg-desktop{left:5cqw;top:20cqw;width:72cqw}
.cfg-monitor{padding:1.2cqw;border-radius:1.8cqw}
.cfg-browser-bar{height:3cqw}
.cfg-browser-bar span{font-size:.9cqw}
.cfg-monitor-view{height:35cqw}
.cfg-tablet{left:63cqw;top:28cqw;width:31cqw;height:42cqw;padding:1cqw;border-radius:2cqw}
.cfg-phone{left:49cqw;top:42cqw;width:16cqw;height:32cqw;border-radius:2.5cqw;padding:1cqw .6cqw .5cqw}
.cfg-island{top:1cqw;left:4.9cqw;width:5.5cqw;height:1.4cqw}
.cfg-project-logo{left:6cqw;top:59cqw;width:12cqw}
.cfg-scene-footer{display:none}
.cfg-facts{grid-template-columns:1fr;gap:20px}
.cfg-facts dt{margin:0}
.cfg-facts>div{display:flex;justify-content:space-between;gap:20px}
.cfg-facts dd{font-size:.78rem;text-align:right}
.cfg-challenge{grid-template-columns:1fr;gap:12px;padding:44px 0}
.cfg-contribution{padding:0 0 44px}
.cfg-columns{grid-template-columns:1fr;gap:20px}
.cfg-columns h3{margin:12px 0}
.cfg-columns p{margin:0}
.cfg-details{padding:40px 0}
.cfg-detail-grid{grid-template-columns:1fr;gap:40px}
.cfg-detail-image{aspect-ratio:1/1.2}
.cfg-reach{grid-template-columns:1fr;gap:24px;padding:44px 0}
.cfg-reach dl{justify-content:space-between;padding-right:20px}
.cfg-reach dd{font-size:2.2rem}
.cfg-closing{padding:44px 0}
.cfg-related{justify-content:start;gap:16px}
}

/* Upright devices with a shared baseline and an offset foreground phone. */
.cfg-tablet,.cfg-phone,.cfg-project-logo{transform:none}

.cfg-desktop{left:9cqw;width:56cqw}

.cfg-tablet{left:67cqw}

.cfg-phone{left:61cqw;top:18.4cqw;z-index:2}

.cfg-monitor-view{display:flex;justify-content:center;align-items:flex-start;background:#fff}

.cfg-monitor-view img{width:31cqw;max-width:none;height:auto;transform:translateY(-5.5cqw);flex-shrink:0}

@media(max-width:600px){
.cfg-desktop{left:5cqw;top:20cqw;width:72cqw}

.cfg-tablet{left:63cqw;top:28cqw}

.cfg-phone{left:57cqw;top:40cqw}

.cfg-monitor-view img{width:40cqw;transform:translateY(-7.1cqw)}

}

