/* CIDES process hero refinement: straight agricultural process layout. */

/* Seamless header-to-hero canvas on the homepage. */
body.home .cides-df-header,
body.home .cides-site-header,
body.home .cides-topbar,
body.home .cides-df-hero {
    background: var(--cides-hero-canvas, #f4f9f3);
}
body.home .cides-df-header,
body.home .cides-site-header,
body.home .cides-topbar,
body.home .cides-topbar__inner,
body.home .cides-df-header-shell {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

/* Keep both hero columns visually balanced. */
body.home .cides-df-hero {
    padding-top: 50px;
    padding-bottom: 78px;
}
body.home .cides-df-hero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(600px, 1fr);
    gap: 72px;
    align-items: stretch;
}
body.home .cides-df-hero__copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Straight four-card process: Waste -> Biogas -> recycle hub -> two outputs. */
.cides-process-chain {
    width: min(100%, 690px);
    min-height: 780px;
    height: 100%;
    margin-left: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(300px, 1fr) 94px minmax(300px, 1fr);
    column-gap: 34px;
    row-gap: 24px;
    align-self: stretch;
}
.cides-process-card {
    min-height: 0;
    border-width: 7px;
    border-radius: 30px;
    transform: none !important;
}
.cides-process-card:nth-child(n) {
    transform: none !important;
}
.cides-process-card--waste {
    grid-column: 1;
    grid-row: 1;
}
.cides-process-card--biogas {
    grid-column: 2;
    grid-row: 1;
}
.cides-process-card--cooking {
    grid-column: 1;
    grid-row: 3;
}
.cides-process-card--slurry {
    grid-column: 2;
    grid-row: 3;
}
.cides-process-card img {
    transform: none;
}
.cides-process-card:hover img {
    transform: scale(1.025);
}
.cides-process-card__label {
    left: 20px;
    right: 20px;
    bottom: 19px;
}
.cides-process-card__copy strong {
    font-size: 19px;
}
.cides-process-card__copy small {
    font-size: 11px;
}

/* Explicit flow arrows. */
.cides-process-arrow {
    width: 60px;
    height: 60px;
    border-width: 7px;
}
.cides-process-arrow svg {
    display: none;
}
.cides-process-arrow::before {
    display: block;
    color: var(--cides-hero-green, #0c4b25);
    font-size: 29px;
    font-weight: 800;
    line-height: 1;
}
.cides-process-arrow--waste {
    top: 23.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.cides-process-arrow--waste::before {
    content: "→";
}
.cides-process-arrow--cook {
    top: 56.5%;
    left: 43%;
    transform: translate(-50%, -50%);
}
.cides-process-arrow--cook::before {
    content: "↙";
}
.cides-process-arrow--slurry {
    top: 56.5%;
    left: 57%;
    transform: translate(-50%, -50%);
}
.cides-process-arrow--slurry::before {
    content: "↘";
}

/* Recycling hub only: no Circular Flow text or flame mark. */
.cides-process-badge {
    top: 50%;
    left: 50%;
    width: 96px;
    height: 96px;
    border-width: 8px;
    background: var(--cides-hero-green, #0c4b25);
}
.cides-process-badge span,
.cides-process-badge svg {
    display: none !important;
}
.cides-process-badge::before {
    content: "♻";
    display: block;
    color: #ffffff;
    font-family: Arial, sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 1;
}

/* Agricultural atmosphere: crops, seedlings, farm buildings and field rows. */
.cides-hero-float svg {
    display: none !important;
}
.cides-hero-float::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background: currentColor;
    -webkit-mask: var(--agri-icon) center / contain no-repeat;
    mask: var(--agri-icon) center / contain no-repeat;
}
.cides-hero-float--1,
.cides-hero-float--4 {
    --agri-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V3M12 7C9 7 7 5 7 3c3 0 5 2 5 4Zm0 4c3 0 5-2 5-4-3 0-5 2-5 4Zm0 4c-3 0-5-2-5-4 3 0 5 2 5 4Zm0 4c3 0 5-2 5-4-3 0-5 2-5 4Z'/%3E%3C/g%3E%3C/svg%3E");
}
.cides-hero-float--2,
.cides-hero-float--5 {
    --agri-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V11l7-5 7 5v10M8 21v-6h8v6M3 12l9-7 9 7'/%3E%3Cpath d='M2 8c3-1 5-3 7-6M22 8c-3-1-5-3-7-6'/%3E%3C/g%3E%3C/svg%3E");
}
.cides-hero-float--3,
.cides-hero-float--6 {
    --agri-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V12M12 14c-4 0-7-3-7-7 4 0 7 3 7 7Zm0-3c4 0 7-3 7-7-4 0-7 3-7 7Z'/%3E%3Cpath d='M3 22c2-2 4-3 6-3m6 0c2 0 4 1 6 3'/%3E%3C/g%3E%3C/svg%3E");
}
.cides-hero-float--1 { width: 96px; height: 96px; left: 2%; top: 11%; opacity: .05; transform: rotate(-10deg); }
.cides-hero-float--2 { width: 78px; height: 78px; left: 45%; top: 7%; opacity: .045; color: #0c4b25; transform: rotate(7deg); }
.cides-hero-float--3 { width: 88px; height: 88px; right: 2%; top: 18%; opacity: .05; color: #1f7d3f; transform: rotate(10deg); }
.cides-hero-float--4 { width: 104px; height: 104px; left: 31%; bottom: 3%; opacity: .04; color: #a0522d; transform: rotate(-14deg); }
.cides-hero-float--5 { width: 82px; height: 82px; right: 35%; bottom: 7%; opacity: .04; color: #0c4b25; transform: rotate(4deg); }
.cides-hero-float--6 { width: 72px; height: 72px; left: 6%; bottom: 16%; opacity: .05; color: #1f7d3f; transform: rotate(8deg); }

@media (max-width: 1250px) {
    body.home .cides-df-hero__inner {
        grid-template-columns: minmax(0, 1fr) minmax(500px, .95fr);
        gap: 44px;
    }
    .cides-process-chain {
        min-height: 700px;
        grid-template-rows: minmax(265px, 1fr) 86px minmax(265px, 1fr);
        column-gap: 28px;
        row-gap: 20px;
    }
}

@media (max-width: 980px) {
    body.home .cides-df-hero__inner {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    .cides-process-chain {
        width: min(100%, 720px);
        min-height: 720px;
        margin: 0 auto;
    }
}

@media (max-width: 700px) {
    body.home .cides-df-hero {
        padding-top: 28px;
    }
    .cides-process-chain {
        min-height: 590px;
        grid-template-rows: minmax(220px, 1fr) 72px minmax(220px, 1fr);
        column-gap: 18px;
        row-gap: 15px;
    }
    .cides-process-card {
        border-width: 5px;
        border-radius: 22px;
    }
    .cides-process-card__copy strong {
        font-size: 14px;
    }
    .cides-process-card__copy small {
        font-size: 9px;
    }
    .cides-process-arrow {
        width: 46px;
        height: 46px;
        border-width: 5px;
    }
    .cides-process-arrow::before {
        font-size: 22px;
    }
    .cides-process-badge {
        width: 76px;
        height: 76px;
        border-width: 5px;
    }
    .cides-process-badge::before {
        font-size: 38px;
    }
}

@media (max-width: 480px) {
    .cides-process-chain {
        min-height: 510px;
        grid-template-rows: minmax(190px, 1fr) 64px minmax(190px, 1fr);
        column-gap: 12px;
        row-gap: 12px;
    }
    .cides-process-card__label {
        left: 11px;
        right: 11px;
        bottom: 11px;
    }
    .cides-process-card__copy small {
        display: none;
    }
    .cides-process-card__copy strong {
        font-size: 12px;
    }
    .cides-process-arrow--cook { left: 41%; }
    .cides-process-arrow--slurry { left: 59%; }
}

@media (prefers-reduced-motion: reduce) {
    .cides-process-card img {
        transition: none !important;
    }
}
