.chooser { min-height: 100vh; padding: 48px 28px 80px; background: #f3f3f3; color: #111; }
.chooser h1 { font-family: var(--font-display), sans-serif; font-size: clamp(2.8rem, 6vw, 5.5rem); margin: 8px 0 8px; }
.chooser-grid { display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 28px; }
.chooser-grid a { display: grid; grid-template-columns: 180px 1fr; min-height: 180px; background: #fff; color: #111; overflow: hidden; }
.chooser-grid .shot { min-height: 180px; }
.shot-1 { background: linear-gradient(90deg, #111 34%, #f4f4f4 34%); }
.shot-2 { background: #e10600; }
.shot-3 { background: #fff; border-right: 12px solid #111; }
.chooser-grid div { padding: 22px; display: grid; align-content: center; gap: 8px; }
.chooser-grid strong { font-size: 28px; }

.w1 { display: grid; grid-template-columns: 280px 1fr; min-height: 100vh; background: #f7f7f7; color: #111; }
.w1 aside { position: sticky; top: 0; height: 100vh; background: #111; color: #fff; padding: 28px; display: flex; flex-direction: column; justify-content: space-between; }
.w1 aside a { color: #fff; }
.w1 aside b { font-family: var(--font-display), sans-serif; font-size: 28px; display: block; }
.w1 aside nav { display: grid; gap: 10px; margin: 28px 0; }
.w1 .go { display: inline-block; background: #e10600; color: #fff; padding: 12px 16px; }
.w1 main { padding: 48px 40px 80px; }
.w1-hero h1 { font-family: var(--font-display), sans-serif; font-size: clamp(3.2rem, 6vw, 6.2rem); line-height: 0.9; margin: 8px 0 16px; max-width: 8ch; }
.w1-work { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 36px 0; }
.w1-work img { width: 100%; height: 280px; object-fit: cover; }
.w1-work strong { display: block; margin-top: 8px; font-size: 20px; }

.w2 { background: #fff; color: #111; }
.w2 header { display: flex; justify-content: space-between; padding: 18px 24px; }
.w2-hero { min-height: 78vh; background: #e10600; color: #fff; display: grid; align-content: end; padding: 40px 28px 48px; }
.w2-hero h1 { font-family: var(--font-poster), sans-serif; font-size: clamp(4.5rem, 12vw, 9rem); line-height: 0.82; letter-spacing: 0.01em; margin: 0 0 16px; max-width: 10ch; }
.w2-hero a { display: inline-block; margin-top: 18px; background: #fff; color: #e10600; padding: 14px 18px; font-weight: 700; }
.w2-services { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.w2-services a { padding: 28px; border-right: 1px solid #eee; min-height: 240px; }
.w2-services em { color: #e10600; font-style: normal; }
.w2-services h2 { font-family: var(--font-poster), sans-serif; font-size: 42px; margin: 10px 0; }
.w2 #work a { display: grid; grid-template-columns: 1.4fr 0.6fr; min-height: 360px; border-top: 1px solid #eee; }
.w2 #work img { width: 100%; height: 360px; object-fit: cover; }
.w2 #work div { display: grid; align-content: end; padding: 24px; }
.w2 #work strong { font-family: var(--font-poster), sans-serif; font-size: 48px; }
.w2-price { padding: 40px 28px 80px; }

.w3 { background: #fffdf8; color: #1b1b1b; }
.w3 header { display: flex; justify-content: space-between; align-items: center; padding: 22px 32px; border-bottom: 1px solid #e7e1d8; }
.w3 header nav { display: flex; gap: 18px; }
.w3-hero { display: grid; grid-template-columns: 1.4fr 0.6fr; gap: 32px; padding: 48px 32px 20px; align-items: end; }
.w3-hero h1 { font-family: var(--font-reader), serif; font-size: clamp(3.4rem, 6vw, 6rem); line-height: 0.95; margin: 0; }
.w3 #services { padding: 10px 32px 20px; }
.w3-work { padding: 10px 32px 40px; display: grid; gap: 8px; }
.w3-work a { display: grid; grid-template-columns: 180px 1fr; gap: 18px; align-items: center; background: #fff; border: 1px solid #ece7df; }
.w3-work img { width: 180px; height: 110px; object-fit: cover; }
.w3-work strong { font-family: var(--font-reader), serif; font-size: 32px; }
.w3-end { margin: 20px 32px 60px; background: #111; color: #fff; padding: 48px; }
.w3-end h2 { font-family: var(--font-reader), var(--font-bn), serif; font-size: clamp(2.4rem, 5vw, 4.5rem); }
.w3-end a { color: #fff; border-bottom: 2px solid #e10600; }

@media (max-width: 900px) {
  .w1, .w2-services, .w2 #work a, .w3-hero, .chooser-grid a { grid-template-columns: 1fr; }
  .w1 aside { position: relative; height: auto; }
  .w3-work a { grid-template-columns: 120px 1fr; }
}
