/* ============ What is RAIN page (loads after styles.css) ============ */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wir-cap { margin-top: 14px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink); }

/* 1. hero */
.wir-hero { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(24px, 4vw, 64px); align-items: center; margin-top: 0; padding-top: clamp(32px, 4vw, 56px); }
.wir-hero__text { display: flex; flex-direction: column; gap: 24px; }
.wir-hero h1 { font-family: var(--serif); font-weight: 300; font-size: clamp(42px, 5.6vw, 84px); line-height: 1.02; letter-spacing: -.01em; text-wrap: balance; }
.wir-copy { margin: 0; }
.wir-copy__svg { width: 100%; height: auto; display: block; }
.wir-copy__hand { opacity: 0; }
.has-gsap .wir-copy__box rect, .has-gsap .wir-copy__box path, .has-gsap .wir-copy__hand path, .has-gsap .wir-copy__hand circle { stroke-dasharray: 1000; stroke-dashoffset: 1000; }
.has-gsap .wir-hero .reveal { opacity: 1; transform: none; }

/* 2. today */
.wir-today { display: flex; flex-direction: column; gap: clamp(32px, 4vw, 56px); }
.wir-today__head { display: flex; flex-direction: column; gap: 18px; max-width: 900px; }
.wir-today__intro { font-size: 17px; color: var(--ink-2); max-width: 66ch; }
.guardians { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.guardian { display: flex; flex-direction: column; gap: 16px; padding-top: 22px; border-top: 2px solid var(--ink); position: relative; }
.has-gsap .guardian { border-top-color: transparent; }
.has-gsap .guardian::before { content: ""; position: absolute; left: 0; top: -2px; height: 2px; width: 100%; background: var(--ink); transform: scaleX(var(--sx, 0)); transform-origin: left; }
.guardian p:last-child { font-size: 15px; color: var(--ink-2); }
.seal { width: 64px; height: 64px; }
.seal__crack { stroke: #ff5c47; stroke-width: 1.6; stroke-linejoin: round; stroke-dasharray: 200; stroke-dashoffset: 200; }
.seal__core { transition: fill .6s; }
.guardian.is-cracked .seal__core { fill: #ff5c47; }
.wir-today__close { font-family: var(--serif); font-size: clamp(24px, 2.4vw, 34px); line-height: 1.2; max-width: 22ch; border-left: 2px solid var(--green); padding-left: 20px; }

/* 3. idea */
.wir-idea { display: flex; flex-direction: column; gap: 0; }
.wir-idea__band { background: var(--green); color: var(--paper); margin: 0 calc(-1 * var(--gutter)); padding: clamp(64px, 10vw, 140px) var(--gutter); display: flex; flex-direction: column; gap: 22px; }
.wir-idea__band .eyebrow { color: var(--green-tint); }
.wir-idea__line { font-size: clamp(34px, 4.6vw, 68px); max-width: 18ch; color: var(--paper); }
.has-gsap .wir-idea__line .dw > span { color: rgba(246,243,236,.48); }
.wir-idea__body { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(24px, 4vw, 64px); align-items: center; padding-top: clamp(40px, 5vw, 72px); }
.wir-split { margin: 0; }
.wir-split__svg { width: 100%; height: auto; display: block; font-family: var(--sans); }
.has-gsap .split-nodes circle, .has-gsap .split-labels text, .has-gsap .split-links path { opacity: 0; }
.wir-idea__text p { font-size: clamp(17px, 1.35vw, 19px); color: var(--ink-2); max-width: 44ch; }

/* 4. why */
.wir-why { display: flex; flex-direction: column; gap: clamp(28px, 3.5vw, 48px); }
.wir-why__head { display: flex; flex-direction: column; gap: 12px; }
.whys { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.why { display: flex; flex-direction: column; gap: 14px; padding: 28px; background: var(--white); border: 1px solid var(--rule); }
.why p:last-child { font-size: 15px; color: var(--ink-2); }
.wir-why__eng { font-size: 15px; color: var(--ink-2); max-width: 70ch; }
.wir-why__eng .link { margin-left: 6px; }

/* 5. fires */
.wir-fires { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.wir-fires__head { display: flex; flex-direction: column; gap: 14px; }
.wir-fires__head h2 { font-size: clamp(24px, 2.4vw, 34px); }
.fires { border-top: 1px solid var(--ink); }
.fire { display: grid; grid-template-columns: 28px 160px 1fr; gap: 20px; align-items: baseline; padding: 20px 0; border-bottom: 1px solid var(--rule); }
.fire strong { font-family: var(--serif); font-weight: 400; font-size: 22px; line-height: 1.1; }
.fire span:last-child { font-size: 15px; color: var(--ink-2); }
.fire__mark { width: 10px; height: 10px; border-radius: 50%; background: #ff5c47; align-self: center; transition: background .8s, border-radius .8s, transform .8s; }
.fire.is-rained .fire__mark { background: var(--green); border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }

/* 6. data centers */
.wir-dc { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.wir-dc__head { display: flex; flex-direction: column; gap: 14px; }
.wir-dc__body { display: flex; flex-direction: column; gap: 22px; max-width: 62ch; }
.wir-dc__body p:not(.wir-dc__creed) { font-size: 17px; color: var(--ink-2); }
.wir-dc__creed { font-size: clamp(24px, 2.6vw, 36px); line-height: 1.2; margin-top: 12px; border-left: 2px solid var(--green); padding-left: 20px; }

/* asks */
.asks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.ask { display: flex; flex-direction: column; gap: 14px; padding: 32px; background: var(--white); border: 1px solid var(--rule); }
.ask p { font-size: 15px; color: var(--ink-2); max-width: 44ch; }
.ask__form { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.ask__form input { flex: 1 1 220px; height: 50px; padding: 0 16px; font: inherit; font-size: 15px; color: var(--ink); background: var(--paper); border: 1px solid var(--rule-2); }
.ask__form input:focus { border-color: var(--green); outline: none; }
.ask__form input:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.ask .btn--outline { align-self: flex-start; margin-top: 6px; }
.ask__note { font-size: 13px; }

/* finale */
.rainband--wir { margin-top: clamp(72px, 9vw, 130px); }
.finale { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; min-height: 70vh; justify-content: center; margin-top: 0; padding: clamp(48px, 6vw, 96px) 0; }
.finale__l1 { font-size: clamp(22px, 2.4vw, 34px); color: var(--ink-2); max-width: 30ch; }
.finale__l2 { font-size: clamp(56px, 9vw, 150px); line-height: .98; letter-spacing: -.015em; color: var(--ink); }

@media (max-width: 1100px) {
  .guardians { grid-template-columns: 1fr; gap: 28px; }
  .whys { grid-template-columns: 1fr; }
  .wir-fires, .wir-dc { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .wir-hero { grid-template-columns: 1fr; min-height: 0; gap: 28px; }
  .wir-copy { max-width: 340px; }
  .wir-idea__body { grid-template-columns: 1fr; }
  .asks { grid-template-columns: 1fr; }
  .fire { grid-template-columns: 20px 1fr; }
  .fire span:last-child { grid-column: 2; }
  .finale { min-height: 50vh; }
}
@media (prefers-reduced-motion: reduce) {
  .seal__crack { stroke-dashoffset: 0; }
  .wir-copy__hand { opacity: 1; }
}
