/* ===========================================================================
   ATS DESTINAIRE — page extras (builds on jkg / anandita / ajnara / strings /
   fusion CSS). Falling-leaf hero · Miyawaki forest band · two-unit grid
   =========================================================================== */

/* ---------- Hero: a few gold leaves drifting down ---------- */
.at-hero .jk-slide img { object-position: 60% 45%; }
.at-leaves { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.at-leaves i {
    position: absolute; top: -40px; width: 14px; height: 22px; opacity: .55;
    background: linear-gradient(160deg, #F1C64A, #7FB069); border-radius: 0 100% 0 100%;
    animation: atFall 14s linear infinite;
}
.at-leaves i:nth-child(1) { left: 58%; animation-delay: 0s; }
.at-leaves i:nth-child(2) { left: 66%; animation-delay: -3s; animation-duration: 17s; transform: scale(.7); }
.at-leaves i:nth-child(3) { left: 74%; animation-delay: -6s; }
.at-leaves i:nth-child(4) { left: 82%; animation-delay: -9s; animation-duration: 19s; }
.at-leaves i:nth-child(5) { left: 90%; animation-delay: -2s; animation-duration: 15s; transform: scale(.8); }
.at-leaves i:nth-child(6) { left: 70%; animation-delay: -11s; animation-duration: 21s; }
.at-leaves i:nth-child(7) { left: 86%; animation-delay: -7s; animation-duration: 16s; transform: scale(.6); }
@keyframes atFall {
    0% { transform: translate3d(0, 0, 0) rotate(0); opacity: 0; }
    10% { opacity: .6; }
    50% { transform: translate3d(-40px, 50vh, 0) rotate(180deg); }
    90% { opacity: .5; }
    100% { transform: translate3d(20px, 105vh, 0) rotate(360deg); opacity: 0; }
}

/* ---------- Miyawaki forest band ---------- */
.at-forest { position: relative; overflow: hidden; isolation: isolate; padding: clamp(70px, 9vw, 120px) 0; background: linear-gradient(180deg, #06120B 0%, #0A1F12 50%, #06120B 100%); }
.at-forest-canopy {
    position: absolute; inset: 0; z-index: -1; opacity: .85;
    background:
        radial-gradient(120px 90px at 6% 18%, rgba(47, 120, 70, .55), transparent 70%),
        radial-gradient(160px 120px at 18% 82%, rgba(36, 102, 58, .5), transparent 70%),
        radial-gradient(140px 110px at 34% 12%, rgba(58, 138, 80, .4), transparent 70%),
        radial-gradient(200px 140px at 52% 92%, rgba(30, 90, 52, .5), transparent 70%),
        radial-gradient(170px 120px at 70% 8%, rgba(52, 128, 74, .45), transparent 70%),
        radial-gradient(220px 150px at 88% 70%, rgba(36, 110, 62, .55), transparent 70%),
        radial-gradient(130px 100px at 96% 22%, rgba(60, 140, 82, .4), transparent 70%),
        radial-gradient(60% 80% at 50% 50%, rgba(241, 198, 74, .06), transparent 70%);
    animation: atSway 12s ease-in-out infinite alternate;
}
@keyframes atSway { from { transform: scale(1) translateX(0); } to { transform: scale(1.04) translateX(-12px); } }
.at-forest-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(28px, 5vw, 70px); align-items: center; }
.at-forest-copy h2 { margin: 10px 0 16px; }
.at-forest-copy p { color: #E1E8E0; line-height: 1.75; margin-bottom: 14px; }
.at-forest-copy b { color: #9FE0B0; font-weight: 600; }
.at-forest-ctas { margin-top: 22px; }
.at-forest-facts { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.at-forest-facts li {
    position: relative; overflow: hidden; padding: 24px 20px; border-radius: 22px;
    background: linear-gradient(160deg, rgba(20, 60, 36, .65), rgba(8, 20, 12, .85)); border: 1px solid rgba(127, 224, 160, .25);
    transition: transform .5s var(--ease-lux), border-color .4s;
}
.at-forest-facts li::after { content: ''; position: absolute; right: -20px; top: -20px; width: 80px; height: 80px; border-radius: 0 100% 0 100%; background: rgba(127, 200, 140, .08); transform: rotate(20deg); }
.at-forest-facts li:hover { transform: translateY(-4px); border-color: rgba(241, 198, 74, .5); }
.at-forest-facts strong { display: block; font: 400 clamp(34px, 3.6vw, 48px)/1 'Fraunces', Georgia, serif; color: var(--gold-bright); margin-bottom: 8px; }
.at-forest-facts span { font-size: 13.5px; color: #DCE6DB; }

/* ---------- Two unit cards ---------- */
.at-unit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.at-plan-media, .at-plan-img { background: #fff !important; }
.at-plan-media { aspect-ratio: 16 / 10; }
.at-plan-media img { object-fit: contain !important; padding: 8px 8px 50px !important; }

/* ---------- Amenities ---------- */
.at-amen-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 16px; align-items: stretch; }
.at-amen-hero { min-height: 420px; }
.at-zones { grid-template-columns: repeat(3, 1fr) !important; }

/* ---------- Site plan + map ---------- */
.at-site-grid { grid-template-columns: 1fr 1fr; }
.at-site-grid .jk-site-img { height: 420px; background: #fff; }
.at-site-grid .jk-site-img img { object-fit: contain; object-position: center; }

/* Brochure band */
.at-cta { background:
    linear-gradient(100deg, rgba(8, 11, 9, .96) 0%, rgba(8, 11, 9, .8) 55%, rgba(8, 11, 9, .35) 100%),
    url('ats/clubhouse.jpg') right 60% / cover !important; }

@media (max-width: 1100px) {
    .at-amen-grid { grid-template-columns: 1fr; }
    .at-amen-hero { min-height: 300px; }
}
@media (max-width: 900px) {
    .at-forest-grid { grid-template-columns: 1fr; }
    .at-unit-grid { grid-template-columns: 1fr; }
    .at-zones { grid-template-columns: 1fr 1fr !important; }
    .at-site-grid { grid-template-columns: 1fr; }
    .at-site-grid .jk-site-img { height: 320px; }
}
@media (max-width: 640px) {
    .at-zones { grid-template-columns: 1fr !important; }
    .at-forest-facts li { padding: 18px 16px; }
    .at-leaves i:nth-child(n+5) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .at-leaves { display: none; }
    .at-forest-canopy { animation: none; }
}
