/*
 * Premium Ecológica
 * Home R3.1 visual refinement
 */

.premium-home.premium-home-r3 {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

.premium-home-r3 {
    --r31-green: #07543d;
    --r31-dark: #073c30;
    --r31-yellow: #ffc625;
    --r31-mint: #eff8f3;
    --r31-line: #d9e8e0;
    --r31-text: #526d63;
    --r31-shadow:
        0 18px 50px rgba(4,65,45,.10);
}

.premium-home-r3 > section,
.premium-home-r3 > .premium-r3-trust,
.premium-home-r3 .premium-products {
    width: min(1460px, calc(100vw - 56px)) !important;
    max-width: none !important;
}


/* CAMPAIGNS */

.premium-home-r3 > .premium-campaign {
    left: 50% !important;

    width: min(1600px, calc(100vw - 20px)) !important;
    max-width: none !important;
    height: clamp(450px, 37vw, 590px) !important;

    margin-top: 20px !important;
    margin-left: -50vw !important;

    transform: none !important;

    border-radius: 24px !important;
}

.premium-r31-campaign {
    position: absolute;
    inset: 0;

    display: grid;
    grid-template-columns: 1.05fr .95fr;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 78% 18%,
            rgba(255,198,37,.23),
            transparent 25%
        ),
        linear-gradient(
            118deg,
            #063b2e 0%,
            #07543d 54%,
            #0d6a4a 100%
        );
}

.premium-r31-campaign::after {
    content: "";

    position: absolute;

    right: -80px;
    bottom: -170px;

    width: 430px;
    height: 430px;

    border: 80px solid rgba(255,198,37,.13);
    border-radius: 50%;
}

.premium-r31-campaign__copy {
    position: relative;
    z-index: 3;

    padding:
        clamp(60px, 7vw, 105px)
        clamp(50px, 6vw, 100px);

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

    color: white;
}

.premium-r31-kicker {
    display: block;

    margin-bottom: 13px;

    color: #e6b721;

    font-size: 11px;
    font-weight: 850;

    letter-spacing: .12em;
    text-transform: uppercase;
}

.premium-r31-campaign .premium-r31-kicker {
    color: #ffd64b;
}

.premium-r31-campaign__copy > strong {
    max-width: 700px;

    color: white;

    font-size: clamp(38px, 4.2vw, 65px);
    line-height: .98;
    font-weight: 850;
    letter-spacing: -.045em;
}

.premium-r31-campaign__copy > p {
    max-width: 620px;

    margin: 20px 0 26px;

    color: rgba(255,255,255,.82);

    font-size: 16px;
    line-height: 1.65;
}

.premium-r31-campaign__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
}

.premium-r31-btn {
    min-height: 48px;

    padding: 0 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 11px;

    background: var(--r31-green);
    color: white !important;

    font-size: 13px;
    font-weight: 800;
}

.premium-r31-btn--yellow {
    background: var(--r31-yellow);
    color: #17372d !important;
}

.premium-r31-btn--outline {
    border: 1px solid #a9cab9;

    background: white;
    color: var(--r31-green) !important;
}

.premium-r31-text-link {
    color: white !important;

    font-size: 13px;
    font-weight: 750;

    border-bottom: 1px solid rgba(255,255,255,.45);
}

.premium-r31-campaign__proof {
    margin-top: 34px;

    display: flex;
    flex-wrap: wrap;
    gap: 22px;
}

.premium-r31-campaign__proof span {
    display: flex;
    gap: 7px;
    align-items: center;

    color: rgba(255,255,255,.77);

    font-size: 11px;
}

.premium-r31-campaign__proof b {
    color: var(--r31-yellow);
}

.premium-r31-campaign__visual {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;
}

.premium-r31-campaign__visual > img {
    position: relative;
    z-index: 3;

    width: 80%;
    height: 88%;

    object-fit: contain;

    filter:
        drop-shadow(
            0 36px 30px rgba(0,0,0,.25)
        );
}

.premium-r31-campaign__halo {
    position: absolute;

    width: 430px;
    height: 430px;

    border-radius: 50%;

    background:
        rgba(255,198,37,.13);
}

.premium-r31-campaign__badge {
    position: absolute;
    z-index: 5;

    right: 8%;
    top: 13%;

    width: 145px;
    height: 145px;

    padding: 18px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 7px solid rgba(255,255,255,.72);
    border-radius: 50%;

    background: var(--r31-yellow);
    color: #17372d;

    text-align: center;

    transform: rotate(6deg);

    box-shadow:
        0 18px 40px rgba(0,0,0,.22);
}

.premium-r31-campaign__badge small {
    font-size: 10px;
    font-weight: 900;
}

.premium-r31-campaign__badge b {
    font-size: 20px;
    line-height: 1;
}

.premium-r31-campaign__badge span {
    margin-top: 4px;

    font-size: 11px;
}

.premium-r31-campaign--freight {
    background:
        radial-gradient(
            circle at 78% 38%,
            rgba(255,198,37,.28),
            transparent 28%
        ),
        linear-gradient(
            115deg,
            #073c30,
            #0a6147
        );
}

.premium-r31-freight-word {
    position: absolute;
    z-index: 2;

    left: -5%;
    top: 18%;

    color: rgba(255,255,255,.11);

    font-size: clamp(70px, 9vw, 135px);
    line-height: .78;
    font-weight: 900;
}

.premium-r31-freight-word b {
    display: block;

    color: rgba(255,198,37,.19);
}


/* TRUST */

.premium-r3-trust {
    margin-top: 14px !important;
}

.premium-r31-trust {
    display: grid;
    grid-template-columns: repeat(4,1fr);

    overflow: hidden;

    border: 1px solid var(--r31-line);
    border-radius: 14px;

    background: white;
}

.premium-r31-trust > div {
    padding: 16px 20px;

    display: flex;
    gap: 12px;
    align-items: center;

    border-right: 1px solid var(--r31-line);
}

.premium-r31-trust > div:last-child {
    border-right: 0;
}

.premium-r31-trust > div > b {
    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #edf7f1;
    color: var(--r31-green);
}

.premium-r31-trust strong,
.premium-r31-trust span {
    display: block;
}

.premium-r31-trust strong {
    color: var(--r31-green);

    font-size: 12px;
}

.premium-r31-trust span {
    color: var(--r31-text);

    font-size: 10px;
}


/* SPECIES */

.premium-r31-species {
    padding-top: 60px;
    padding-bottom: 22px;
}

.premium-r31-heading {
    max-width: 800px;
}

.premium-r31-heading--center {
    margin: auto;

    text-align: center;
}

.premium-r31-heading h2 {
    margin: 0;

    color: var(--r31-dark);

    font-size: clamp(29px, 3vw, 43px);
    line-height: 1.06;
    font-weight: 830;
    letter-spacing: -.03em;
}

.premium-r31-heading p {
    margin: 10px 0 0;

    color: var(--r31-text);

    font-size: 14px;
}

.premium-r31-species-grid {
    margin-top: 28px;

    display: grid;
    grid-template-columns: repeat(9,1fr);
    gap: 11px;
}

.premium-r31-species-grid > a {
    min-width: 0;
    min-height: 148px;

    padding: 16px 10px 13px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;

    border: 1px solid var(--r31-line);
    border-radius: 16px;

    background: white;
    color: var(--r31-dark) !important;

    box-shadow:
        0 7px 24px rgba(3,70,47,.045);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.premium-r31-species-grid > a:hover {
    transform: translateY(-4px);

    box-shadow: var(--r31-shadow);
}

.premium-r31-species-grid strong {
    font-size: 12px;
}

.premium-r31-animal {
    width: 78px;
    height: 78px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #fff8dc,
            #eff8f2
        );

    color: #b65d31;
}

.premium-r31-animal svg {
    width: 60px;
    height: 60px;

    overflow: visible;

    fill: currentColor;
}

.premium-r31-animal .wing {
    fill: rgba(255,255,255,.32);
}

.premium-r31-animal--brown {
    color: #916848;
}

.premium-r31-animal--blue {
    color: #357d78;
}

.premium-r31-animal--cream {
    color: #c3a76b;
}

.premium-r31-animal--peacock {
    color: #13705a;
}

.premium-r31-animal--peacock .fan {
    fill: #4ea786;
}

.premium-r31-animal--peacock .spot {
    fill: #e4b51f;
}

.premium-r31-animal--orange {
    color: #b66b36;
}

.premium-r31-animal--yellow {
    color: #d7a51a;
}

.premium-r31-animal--parrot {
    color: #208153;
}

.premium-r31-animal--turtle {
    color: #66814b;
}


/* HERO */

.premium-home-r3 > .premium-r31-hero {
    min-height: 560px;

    margin-top: 46px;
    padding:
        clamp(50px,5vw,78px)
        clamp(48px,6vw,92px);

    display: grid;
    grid-template-columns: .98fr 1.02fr;
    gap: 56px;
    align-items: center;

    overflow: hidden;

    border-radius: 26px;

    background:
        linear-gradient(
            110deg,
            #f5faf6 0%,
            #edf7f1 68%,
            #fff8dd 100%
        );
}

.premium-r31-hero__copy h1 {
    max-width: 680px;

    margin: 0;

    color: var(--r31-dark);

    font-size: clamp(46px,5vw,70px);
    line-height: .96;
    font-weight: 860;
    letter-spacing: -.05em;
}

.premium-r31-hero__copy > p {
    max-width: 650px;

    margin: 22px 0 25px;

    color: var(--r31-text);

    font-size: 16px;
    line-height: 1.7;
}

.premium-r31-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.premium-r31-hero__proof {
    margin-top: 30px;

    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 12px;
}

.premium-r31-hero__proof > div {
    display: flex;
    gap: 10px;
    align-items: center;
}

.premium-r31-hero__proof > div > b {
    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: white;
    color: var(--r31-green);

    box-shadow:
        0 7px 20px rgba(3,70,47,.08);
}

.premium-r31-hero__proof span,
.premium-r31-hero__proof strong {
    display: block;
}

.premium-r31-hero__proof span {
    color: var(--r31-text);

    font-size: 10px;
}

.premium-r31-hero__proof strong {
    color: var(--r31-dark);

    font-size: 11px;
}

.premium-r31-hero__visual {
    position: relative;

    min-height: 430px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.premium-r31-hero__visual > img {
    position: relative;
    z-index: 3;

    width: 92%;
    max-width: 650px;
    max-height: 430px;

    object-fit: contain;

    border-radius: 18px;

    filter:
        drop-shadow(
            0 28px 28px rgba(4,63,44,.14)
        );
}

.premium-r31-hero__leaf {
    position: absolute;

    width: 240px;
    height: 90px;

    border-radius:
        100% 0 100% 0;

    background: rgba(59,137,83,.13);
}

.premium-r31-hero__leaf--1 {
    right: 0;
    top: 15px;

    transform: rotate(25deg);
}

.premium-r31-hero__leaf--2 {
    left: 25px;
    bottom: 10px;

    transform: rotate(-35deg);
}

.premium-r31-hero__callout {
    position: absolute;
    z-index: 5;

    right: 2%;
    bottom: 4%;

    max-width: 225px;

    padding: 16px 18px;

    border-radius: 14px;

    background: var(--r31-dark);
    color: white;

    box-shadow: var(--r31-shadow);
}

.premium-r31-hero__callout strong,
.premium-r31-hero__callout span {
    display: block;
}

.premium-r31-hero__callout strong {
    font-size: 12px;
}

.premium-r31-hero__callout span {
    margin-top: 3px;

    color: rgba(255,255,255,.7);

    font-size: 10px;
}


/* FAMILIES */

.premium-home-r3 > .premium-r31-families {
    margin-top: 84px;
}

.premium-r31-family-grid {
    margin-top: 30px;

    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 18px;
}

.premium-r31-family-card {
    position: relative;

    min-width: 0;

    overflow: hidden;

    border: 1px solid var(--r31-line);
    border-radius: 21px;

    background: white;
    color: var(--r31-dark) !important;

    box-shadow:
        0 10px 34px rgba(3,70,47,.06);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.premium-r31-family-card:hover {
    transform: translateY(-5px);

    box-shadow: var(--r31-shadow);
}

.premium-r31-family-number {
    position: absolute;
    z-index: 4;

    left: 16px;
    top: 16px;

    width: 36px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: var(--r31-green);
    color: white;

    font-size: 10px;
    font-weight: 850;
}

.premium-r31-family-card:nth-child(even)
.premium-r31-family-number {
    background: var(--r31-yellow);
    color: var(--r31-dark);
}

.premium-r31-family-image {
    height: 300px;

    padding: 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        linear-gradient(
            145deg,
            #f8fbf9,
            #ecf4ef
        );
}

.premium-r31-family-image img {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.premium-r31-family-copy {
    padding: 22px;
}

.premium-r31-family-copy > strong {
    color: var(--r31-dark);

    font-size: 20px;
    font-weight: 830;
}

.premium-r31-family-copy p {
    min-height: 57px;

    margin: 7px 0 13px;

    color: var(--r31-text);

    font-size: 12px;
    line-height: 1.55;
}

.premium-r31-family-copy b {
    color: var(--r31-green);

    font-size: 11px;
}


/* PRODUCTS */

.premium-home-r3 .premium-products {
    margin-top: 86px !important;
}

.premium-home-r3 .premium-product-grid {
    gap: 20px !important;
}

.premium-home-r3 .premium-product-card__image {
    min-height: 310px !important;
}

.premium-home-r3 .premium-product-card__image img {
    height: 265px !important;
}

.premium-home-r3 .premium-product-card__body {
    padding: 21px 22px 22px !important;
}

.premium-home-r3 .premium-product-card__name {
    min-height: 62px !important;

    font-size: 15px !important;
}

.premium-home-r3 .premium-product-card__price {
    font-size: 19px !important;
}

.premium-home-r3 .premium-product-card__buy {
    min-height: 45px !important;

    border-radius: 11px !important;
}


/* CHOOSER */

.premium-home-r3 > .premium-choice {
    margin-top: 86px !important;
    padding: 62px !important;
}

.premium-home-r3
.premium-choice__intro h2 {
    font-size: clamp(38px,4vw,55px) !important;
}

.premium-home-r3 .premium-choice-card {
    padding:
        21px
        54px
        21px
        64px !important;

    min-height: 94px;
}


/* ACCESSORIES */

.premium-home-r3
.premium-products--accessories
.premium-product-card__image {
    min-height: 250px !important;
}

.premium-home-r3
.premium-products--accessories
.premium-product-card__image img {
    height: 205px !important;
}

.premium-home-r3 > .premium-r31-feature {
    min-height: 350px;

    margin-top: 30px;

    display: grid;
    grid-template-columns: .9fr 1.1fr;

    overflow: hidden;

    border: 1px solid var(--r31-line);
    border-radius: 23px;

    background: white;
}

.premium-r31-feature__visual {
    padding: 25px;

    background:
        linear-gradient(
            135deg,
            #e9f5ed,
            #f6faf7
        );
}

.premium-r31-feature__visual-inner {
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.55),
            rgba(217,237,225,.55)
        );
}

.premium-r31-feature__visual img {
    max-width: 330px;
    max-height: 300px;

    object-fit: contain;
}

.premium-r31-feature__copy {
    padding: 60px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.premium-r31-feature__copy h2 {
    max-width: 650px;

    margin: 0;

    color: var(--r31-dark);

    font-size: clamp(32px,3.5vw,48px);
    line-height: 1.04;
    font-weight: 830;
}

.premium-r31-feature__copy p {
    max-width: 650px;

    margin: 18px 0 23px;

    color: var(--r31-text);

    line-height: 1.7;
}


/* LOWER SECTIONS */

.premium-r3-journey,
.premium-r3-support {
    padding-top: 92px !important;
}

.premium-r3-journey-grid {
    gap: 18px !important;
}

.premium-r3-step {
    min-height: 220px !important;

    padding: 32px 27px 25px !important;
}

.premium-r3-step-icon {
    font-size: 42px !important;
}

.premium-r3-step strong {
    font-size: 17px !important;
}

.premium-r3-needs {
    margin-top: 86px !important;

    padding: 62px 54px !important;
}

.premium-r3-needs-grid {
    gap: 18px !important;
}

.premium-r3-need-card {
    min-height: 190px !important;

    padding: 25px !important;
}

.premium-r3-why {
    margin-top: 86px !important;

    padding: 50px 40px !important;
}

.premium-r3-why h2 {
    font-size: 31px !important;
}

.premium-r3-support-grid {
    gap: 18px !important;
}

.premium-r3-support-grid a {
    min-height: 180px !important;

    padding: 26px !important;
}


/* AUTHORITY */

.premium-home-r3 > .premium-r31-authority {
    margin-top: 88px;
    padding: 55px;

    display: grid;
    grid-template-columns: 1.15fr .72fr .75fr;
    gap: 32px;
    align-items: center;

    overflow: hidden;

    border-radius: 25px;

    background:
        linear-gradient(
            110deg,
            #edf7f1,
            #f8faf8
        );
}

.premium-r31-authority__copy h2 {
    margin: 0;

    color: var(--r31-dark);

    font-size: clamp(33px,4vw,51px);
    line-height: 1.02;
    font-weight: 850;
    letter-spacing: -.035em;
}

.premium-r31-authority__copy p {
    margin: 18px 0 22px;

    color: var(--r31-text);

    line-height: 1.7;
}

.premium-r31-authority__stats {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 11px;
}

.premium-r31-authority__stats > div {
    min-height: 110px;

    padding: 20px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    border: 1px solid var(--r31-line);
    border-radius: 14px;

    background: white;
}

.premium-r31-authority__stats strong {
    color: var(--r31-green);

    font-size: 22px;
    font-weight: 850;
}

.premium-r31-authority__stats span {
    margin-top: 3px;

    color: var(--r31-text);

    font-size: 10px;
}

.premium-r31-authority__visual {
    align-self: stretch;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #e3f0e7,
            #fff6d7
        );
}

.premium-r31-authority__visual img {
    width: 90%;
    height: 280px;

    object-fit: contain;

    filter:
        drop-shadow(
            0 25px 20px rgba(3,70,47,.13)
        );
}


/* WHATSAPP */

.premium-home-r3 > .premium-r31-whatsapp {
    margin-top: 56px;
    margin-bottom: 48px;

    padding: 28px 36px;

    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 20px;
    align-items: center;

    border-radius: 18px;

    background:
        linear-gradient(
            90deg,
            #08723f,
            #07954f
        );

    color: white;
}

.premium-r31-whatsapp__icon {
    width: 62px;
    height: 62px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: white;
    color: #0a8a4a;
}

.premium-r31-whatsapp__icon svg {
    width: 38px;
    height: 38px;
}

.premium-r31-whatsapp__icon svg path:last-child {
    fill: currentColor;
}

.premium-r31-whatsapp > div:nth-child(2) > span {
    color: #bceacc;

    font-size: 10px;
    font-weight: 850;

    letter-spacing: .1em;
    text-transform: uppercase;
}

.premium-r31-whatsapp h2 {
    margin: 2px 0;

    color: white;

    font-size: 26px;
    font-weight: 850;
}

.premium-r31-whatsapp p {
    margin: 0;

    color: rgba(255,255,255,.77);

    font-size: 12px;
}

.premium-r31-whatsapp > a {
    min-height: 48px;

    padding: 0 23px;

    display: inline-flex;
    align-items: center;

    border-radius: 10px;

    background: var(--r31-yellow);
    color: #15362b !important;

    font-size: 12px;
    font-weight: 850;
}


/* RESPONSIVE */

@media (max-width: 1100px) {

    .premium-r31-species-grid {
        grid-template-columns: repeat(5,1fr);
    }

    .premium-r31-family-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .premium-home-r3 > .premium-r31-authority {
        grid-template-columns: 1fr 1fr;
    }

    .premium-r31-authority__visual {
        display: none;
    }
}

@media (max-width: 850px) {

    .premium-home-r3 > section,
    .premium-home-r3 > .premium-r3-trust,
    .premium-home-r3 .premium-products {
        width: calc(100vw - 28px) !important;
    }

    .premium-home-r3 > .premium-campaign {
        width: calc(100vw - 12px) !important;
    }

    .premium-r31-campaign {
        grid-template-columns: 1fr;
    }

    .premium-r31-campaign__copy {
        padding: 48px 35px;
    }

    .premium-r31-campaign__visual {
        position: absolute;
        inset: 0 0 0 auto;

        width: 50%;

        opacity: .32;
    }

    .premium-r31-trust {
        grid-template-columns: repeat(2,1fr);
    }

    .premium-home-r3 > .premium-r31-hero,
    .premium-home-r3 > .premium-r31-feature,
    .premium-home-r3 > .premium-r31-authority {
        grid-template-columns: 1fr;
    }

    .premium-r31-hero__proof {
        grid-template-columns: 1fr;
    }

    .premium-r31-authority__visual {
        display: flex;
    }
}

@media (max-width: 620px) {

    .premium-home-r3 > .premium-campaign {
        height: 520px !important;
    }

    .premium-r31-campaign__copy > strong {
        font-size: 38px;
    }

    .premium-r31-campaign__visual {
        width: 60%;
    }

    .premium-r31-campaign__badge {
        display: none;
    }

    .premium-r31-trust,
    .premium-r31-family-grid {
        grid-template-columns: 1fr;
    }

    .premium-r31-species-grid {
        grid-template-columns: repeat(3,1fr);
    }

    .premium-home-r3 > .premium-r31-hero {
        padding: 36px 24px;
    }

    .premium-r31-hero__copy h1 {
        font-size: 40px;
    }

    .premium-home-r3 > .premium-r31-feature,
    .premium-home-r3 > .premium-r31-authority {
        padding: 0;
    }

    .premium-r31-feature__copy,
    .premium-r31-authority__copy {
        padding: 30px 24px;
    }

    .premium-r31-authority__stats {
        padding: 0 24px 30px;
    }

    .premium-r31-authority__visual {
        margin: 0 24px 24px;
    }

    .premium-home-r3 > .premium-r31-whatsapp {
        grid-template-columns: 1fr;

        text-align: center;
    }

    .premium-r31-whatsapp__icon {
        margin: auto;
    }

    .premium-r31-whatsapp > a {
        justify-content: center;
    }
}