/**
 * ============================================================
 * KRULUXE TERMS & CONDITIONS PAGE
 * Premium Luxury Responsive Styling
 * ============================================================
 *
 * File:
 * /wp-content/themes/kruluxe-child/assets/css/terms-conditions.css
 *
 * Page:
 * /terms-conditions/
 *
 * Designed for:
 * page-terms-conditions.php
 * ============================================================
 */


/* ============================================================
   01. ROOT VARIABLES
============================================================ */

:root {

    --kr-terms-black: #0b0b0b;
    --kr-terms-charcoal: #171717;
    --kr-terms-charcoal-2: #202020;

    --kr-terms-white: #ffffff;

    --kr-terms-ivory: #faf8f3;
    --kr-terms-ivory-2: #f5f1e8;
    --kr-terms-ivory-3: #eee7da;

    --kr-terms-gold: #b88d3b;
    --kr-terms-gold-light: #d6b36e;
    --kr-terms-gold-dark: #97702a;

    --kr-terms-gold-soft:
        rgba(184, 141, 59, 0.12);

    --kr-terms-green: #536847;

    --kr-terms-text: #171717;
    --kr-terms-muted: #686868;
    --kr-terms-muted-2: #8a8a8a;

    --kr-terms-border: #e5dfd4;
    --kr-terms-border-dark:
        rgba(255, 255, 255, 0.14);

    --kr-terms-danger: #9b4d46;

    --kr-terms-radius: 18px;
    --kr-terms-radius-large: 28px;

    --kr-terms-max: 1440px;

    --kr-terms-shadow:
        0 18px 50px rgba(0, 0, 0, 0.07);

    --kr-terms-shadow-small:
        0 10px 28px rgba(0, 0, 0, 0.055);

    --kr-terms-transition:
        0.28s ease;
}


/* ============================================================
   02. RESET / BASE
============================================================ */

.kr-terms-main,
.kr-terms-main *,
.kr-terms-main *::before,
.kr-terms-main *::after {
    box-sizing: border-box;
}

.kr-terms-main {
    width: 100%;
    margin: 0;
    padding: 0;

    overflow: hidden;

    background:
        var(--kr-terms-white);

    color:
        var(--kr-terms-text);
}

.kr-terms-main img {
    display: block;

    max-width: 100%;
    height: auto;
}

.kr-terms-main a {
    color: inherit;

    text-decoration: none;
}

.kr-terms-main h1,
.kr-terms-main h2,
.kr-terms-main h3,
.kr-terms-main h4,
.kr-terms-main p,
.kr-terms-main ul {
    margin-top: 0;
}

.kr-terms-main p {
    color:
        var(--kr-terms-muted);

    line-height: 1.8;
}

.kr-terms-main ul {
    padding-left: 22px;
}

.kr-terms-main li {
    color:
        var(--kr-terms-muted);

    line-height: 1.75;
}


/* ============================================================
   03. CONTAINER
============================================================ */

.kr-terms-container {

    width:
        min(
            calc(100% - 64px),
            var(--kr-terms-max)
        );

    margin-left: auto;
    margin-right: auto;
}


/* ============================================================
   04. TYPOGRAPHY
============================================================ */

.kr-terms-main h1,
.kr-terms-main h2 {

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-weight: 400;

    letter-spacing:
        -0.025em;
}

.kr-terms-main h1,
.kr-terms-main h2,
.kr-terms-main h3 {

    color:
        var(--kr-terms-text);
}

.kr-terms-eyebrow {

    display:
        inline-block;

    margin-bottom:
        18px;

    color:
        var(--kr-terms-gold);

    font-size:
        12px;

    font-weight:
        700;

    letter-spacing:
        0.18em;

    text-transform:
        uppercase;
}


/* ============================================================
   05. BUTTONS
============================================================ */

.kr-terms-actions,
.kr-terms-contact-actions {

    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        14px;
}

.kr-terms-btn {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        52px;

    padding:
        14px 28px;

    border:
        1px solid transparent;

    border-radius:
        2px;

    font-size:
        14px;

    font-weight:
        600;

    line-height:
        1.2;

    cursor:
        pointer;

    transition:
        background var(--kr-terms-transition),
        color var(--kr-terms-transition),
        border-color var(--kr-terms-transition),
        transform var(--kr-terms-transition),
        box-shadow var(--kr-terms-transition);
}

.kr-terms-btn:hover {

    transform:
        translateY(-2px);
}

.kr-terms-btn-primary {

    background:
        var(--kr-terms-black);

    color:
        var(--kr-terms-white) !important;

    border-color:
        var(--kr-terms-black);
}

.kr-terms-btn-primary:hover {

    background:
        var(--kr-terms-gold);

    border-color:
        var(--kr-terms-gold);

    box-shadow:
        0 12px 26px
        rgba(184, 141, 59, 0.20);
}

.kr-terms-btn-secondary {

    background:
        transparent;

    color:
        var(--kr-terms-black) !important;

    border-color:
        #cfc7bb;
}

.kr-terms-btn-secondary:hover {

    color:
        var(--kr-terms-gold) !important;

    border-color:
        var(--kr-terms-gold);
}


/* ============================================================
   06. HERO
============================================================ */

.kr-terms-hero {

    position:
        relative;

    padding:
        clamp(90px, 10vw, 155px)
        0
        clamp(85px, 9vw, 140px);

    background:

        radial-gradient(
            circle at 82% 18%,
            rgba(184, 141, 59, 0.12),
            transparent 35%
        ),

        linear-gradient(
            135deg,
            #faf8f3 0%,
            #ffffff 58%,
            #f4efe4 100%
        );
}

.kr-terms-hero::before {

    content:
        "";

    position:
        absolute;

    width:
        450px;

    height:
        450px;

    right:
        -170px;

    bottom:
        -230px;

    border-radius:
        50%;

    background:
        rgba(184, 141, 59, 0.055);

    pointer-events:
        none;
}

.kr-terms-hero-inner {

    position:
        relative;

    z-index:
        2;

    max-width:
        980px;
}

.kr-terms-hero h1 {

    max-width:
        900px;

    margin-bottom:
        30px;

    font-size:
        clamp(
            52px,
            6.4vw,
            92px
        );

    line-height:
        0.98;
}

.kr-terms-hero-lead {

    max-width:
        760px;

    margin-bottom:
        0;

    font-size:
        clamp(
            17px,
            1.55vw,
            21px
        );

    line-height:
        1.8;
}


/* ============================================================
   07. HERO META
============================================================ */

.kr-terms-hero-meta {

    display:
        grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    max-width:
        900px;

    margin-top:
        54px;

    border-top:
        1px solid var(--kr-terms-border);

    border-bottom:
        1px solid var(--kr-terms-border);
}

.kr-terms-hero-meta > div {

    padding:
        26px
        26px;

    border-right:
        1px solid var(--kr-terms-border);
}

.kr-terms-hero-meta > div:first-child {
    padding-left: 0;
}

.kr-terms-hero-meta > div:last-child {
    border-right: 0;
}

.kr-terms-hero-meta span {

    display:
        block;

    margin-bottom:
        7px;

    color:
        var(--kr-terms-muted-2);

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        0.12em;

    text-transform:
        uppercase;
}

.kr-terms-hero-meta strong {

    color:
        var(--kr-terms-text);

    font-size:
        15px;

    font-weight:
        600;
}


/* ============================================================
   08. IMPORTANT NOTICE
============================================================ */

.kr-terms-notice {

    padding:
        0;

    background:
        var(--kr-terms-charcoal);

    color:
        var(--kr-terms-white);
}

.kr-terms-notice-inner {

    display:
        grid;

    grid-template-columns:
        240px
        minmax(0, 1fr);

    gap:
        60px;

    align-items:
        center;

    padding:
        52px
        0;
}

.kr-terms-notice-label {

    color:
        var(--kr-terms-gold-light);

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        0.16em;

    text-transform:
        uppercase;
}

.kr-terms-notice h2 {

    margin-bottom:
        12px;

    color:
        var(--kr-terms-white);

    font-size:
        clamp(
            28px,
            3vw,
            40px
        );

    line-height:
        1.1;
}

.kr-terms-notice p {

    max-width:
        850px;

    margin-bottom:
        0;

    color:
        rgba(255, 255, 255, 0.68);

    font-size:
        15px;
}


/* ============================================================
   09. QUICK GUIDE
============================================================ */

.kr-terms-guide {

    padding:
        clamp(80px, 8vw, 120px)
        0;

    background:
        var(--kr-terms-white);
}

.kr-terms-guide-header {

    max-width:
        760px;

    margin-bottom:
        48px;
}

.kr-terms-guide-header h2 {

    margin-bottom:
        0;

    font-size:
        clamp(
            42px,
            5vw,
            68px
        );

    line-height:
        1;
}

.kr-terms-guide-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    border-top:
        1px solid var(--kr-terms-border);

    border-left:
        1px solid var(--kr-terms-border);
}

.kr-terms-guide-grid a {

    display:
        flex;

    align-items:
        center;

    min-height:
        86px;

    padding:
        20px
        24px;

    border-right:
        1px solid var(--kr-terms-border);

    border-bottom:
        1px solid var(--kr-terms-border);

    color:
        var(--kr-terms-text);

    font-size:
        14px;

    font-weight:
        600;

    transition:
        background var(--kr-terms-transition),
        color var(--kr-terms-transition),
        padding-left var(--kr-terms-transition);
}

.kr-terms-guide-grid a:hover {

    padding-left:
        29px;

    background:
        var(--kr-terms-ivory);

    color:
        var(--kr-terms-gold);
}


/* ============================================================
   10. POLICY WRAPPER
============================================================ */

.kr-terms-policy {

    padding:
        clamp(90px, 9vw, 145px)
        0;

    background:
        var(--kr-terms-ivory);
}

.kr-terms-policy-layout {

    display:
        grid;

    grid-template-columns:
        290px
        minmax(0, 1fr);

    gap:
        clamp(
            55px,
            7vw,
            110px
        );

    align-items:
        start;
}


/* ============================================================
   11. STICKY SIDEBAR
============================================================ */

.kr-terms-sidebar {

    position:
        relative;
}

.kr-terms-sidebar-inner {

    position:
        sticky;

    top:
        140px;

    padding:
        30px;

    border:
        1px solid var(--kr-terms-border);

    background:
        var(--kr-terms-white);
}

.kr-terms-sidebar-title {

    display:
        block;

    padding-bottom:
        20px;

    margin-bottom:
        8px;

    border-bottom:
        1px solid var(--kr-terms-border);

    color:
        var(--kr-terms-gold);

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        0.16em;
}

.kr-terms-sidebar nav {

    display:
        flex;

    flex-direction:
        column;
}

.kr-terms-sidebar nav a {

    display:
        block;

    padding:
        11px
        0;

    border-bottom:
        1px solid #f0ece5;

    color:
        var(--kr-terms-muted);

    font-size:
        13px;

    line-height:
        1.45;

    transition:
        color var(--kr-terms-transition),
        padding-left var(--kr-terms-transition);
}

.kr-terms-sidebar nav a:last-child {
    border-bottom: 0;
}

.kr-terms-sidebar nav a:hover {

    padding-left:
        5px;

    color:
        var(--kr-terms-gold);
}


/* ============================================================
   12. CONTENT
============================================================ */

.kr-terms-content {

    min-width:
        0;
}

.kr-terms-section {

    scroll-margin-top:
        150px;

    padding:
        0
        0
        clamp(75px, 8vw, 115px);

    margin-bottom:
        clamp(75px, 8vw, 115px);

    border-bottom:
        1px solid var(--kr-terms-border);
}

.kr-terms-section:last-child {

    margin-bottom:
        0;

    border-bottom:
        0;
}

.kr-terms-number {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        52px;

    height:
        52px;

    margin-bottom:
        32px;

    border:
        1px solid var(--kr-terms-border);

    border-radius:
        50%;

    color:
        var(--kr-terms-gold);

    font-size:
        12px;

    font-weight:
        700;

    letter-spacing:
        0.08em;

    background:
        var(--kr-terms-white);
}

.kr-terms-section h2 {

    max-width:
        800px;

    margin-bottom:
        26px;

    font-size:
        clamp(
            40px,
            4.5vw,
            64px
        );

    line-height:
        1.03;
}

.kr-terms-section > p {

    max-width:
        850px;

    font-size:
        16px;
}

.kr-terms-section > p + p {

    margin-top:
        19px;
}


/* ============================================================
   13. LIST CARD
============================================================ */

.kr-terms-list-card {

    max-width:
        900px;

    margin-top:
        34px;

    padding:
        30px;

    border:
        1px solid var(--kr-terms-border);

    border-radius:
        var(--kr-terms-radius);

    background:
        var(--kr-terms-white);
}

.kr-terms-list-card h3 {

    margin-bottom:
        18px;

    color:
        var(--kr-terms-green);

    font-size:
        22px;

    font-weight:
        500;
}

.kr-terms-list-card ul {

    margin-bottom:
        0;
}

.kr-terms-list-card li + li {

    margin-top:
        8px;
}


/* ============================================================
   14. INFORMATION GRID
============================================================ */

.kr-terms-info-grid {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    max-width:
        920px;

    margin-top:
        36px;

    border-top:
        1px solid var(--kr-terms-border);

    border-left:
        1px solid var(--kr-terms-border);
}

.kr-terms-info-grid > div {

    min-height:
        160px;

    padding:
        28px;

    border-right:
        1px solid var(--kr-terms-border);

    border-bottom:
        1px solid var(--kr-terms-border);

    background:
        var(--kr-terms-white);
}

.kr-terms-info-grid strong {

    display:
        block;

    margin-bottom:
        10px;

    color:
        var(--kr-terms-green);

    font-size:
        18px;
}

.kr-terms-info-grid span {

    display:
        block;

    color:
        var(--kr-terms-muted);

    line-height:
        1.65;

    font-size:
        14px;
}


/* ============================================================
   15. CALLOUT
============================================================ */

.kr-terms-callout {

    max-width:
        900px;

    margin-top:
        36px;

    padding:
        32px
        34px;

    border-left:
        4px solid var(--kr-terms-gold);

    background:
        var(--kr-terms-white);

    box-shadow:
        var(--kr-terms-shadow-small);
}

.kr-terms-callout strong {

    display:
        block;

    margin-bottom:
        10px;

    color:
        var(--kr-terms-text);

    font-size:
        18px;
}

.kr-terms-callout p {

    margin-bottom:
        0;

    max-width:
        780px;
}


/* ============================================================
   16. ORDER STEPS
============================================================ */

.kr-terms-steps {

    display:
        grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    max-width:
        1000px;

    margin-top:
        38px;

    border-top:
        1px solid var(--kr-terms-border);

    border-left:
        1px solid var(--kr-terms-border);
}

.kr-terms-steps > div {

    min-height:
        155px;

    padding:
        28px
        22px;

    border-right:
        1px solid var(--kr-terms-border);

    border-bottom:
        1px solid var(--kr-terms-border);

    background:
        var(--kr-terms-white);
}

.kr-terms-steps span {

    display:
        block;

    margin-bottom:
        38px;

    color:
        var(--kr-terms-gold);

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        0.14em;
}

.kr-terms-steps strong {

    color:
        var(--kr-terms-text);

    font-size:
        14px;

    line-height:
        1.5;
}


/* ============================================================
   17. INLINE LINKS
============================================================ */

.kr-terms-inline-link {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    margin-top:
        25px;

    padding-bottom:
        5px;

    border-bottom:
        1px solid var(--kr-terms-gold);

    color:
        var(--kr-terms-text);

    font-size:
        14px;

    font-weight:
        600;

    transition:
        color var(--kr-terms-transition),
        gap var(--kr-terms-transition);
}

.kr-terms-inline-link:hover {

    gap:
        12px;

    color:
        var(--kr-terms-gold);
}


/* ============================================================
   18. CONTACT SECTION
============================================================ */

.kr-terms-contact-section {

    padding-bottom:
        0;
}

.kr-terms-contact-details {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    max-width:
        900px;

    margin-top:
        38px;

    border-top:
        1px solid var(--kr-terms-border);

    border-left:
        1px solid var(--kr-terms-border);
}

.kr-terms-contact-details > div {

    min-height:
        120px;

    padding:
        26px;

    border-right:
        1px solid var(--kr-terms-border);

    border-bottom:
        1px solid var(--kr-terms-border);

    background:
        var(--kr-terms-white);
}

.kr-terms-contact-details span {

    display:
        block;

    margin-bottom:
        8px;

    color:
        var(--kr-terms-muted-2);

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        0.12em;

    text-transform:
        uppercase;
}

.kr-terms-contact-details strong,
.kr-terms-contact-details a {

    color:
        var(--kr-terms-text);

    font-size:
        15px;

    font-weight:
        600;
}

.kr-terms-contact-details a {

    transition:
        color var(--kr-terms-transition);
}

.kr-terms-contact-details a:hover {

    color:
        var(--kr-terms-gold);
}

.kr-terms-contact-actions {

    margin-top:
        28px;
}


/* ============================================================
   19. RELATED POLICIES
============================================================ */

.kr-terms-related {

    padding:
        clamp(90px, 9vw, 145px)
        0;

    background:
        var(--kr-terms-white);
}

.kr-terms-related-header {

    max-width:
        820px;

    margin-bottom:
        55px;
}

.kr-terms-related-header h2 {

    margin-bottom:
        20px;

    font-size:
        clamp(
            42px,
            5vw,
            72px
        );

    line-height:
        1;
}

.kr-terms-related-header p {

    max-width:
        660px;

    margin-bottom:
        0;

    font-size:
        16px;
}

.kr-terms-related-grid {

    display:
        grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap:
        20px;
}

.kr-terms-related-grid > a {

    min-height:
        300px;

    padding:
        34px;

    border:
        1px solid var(--kr-terms-border);

    border-radius:
        var(--kr-terms-radius);

    background:
        var(--kr-terms-white);

    transition:
        transform var(--kr-terms-transition),
        box-shadow var(--kr-terms-transition),
        border-color var(--kr-terms-transition);
}

.kr-terms-related-grid > a:hover {

    transform:
        translateY(-4px);

    box-shadow:
        var(--kr-terms-shadow-small);

    border-color:
        rgba(184, 141, 59, 0.45);
}

.kr-terms-related-grid > a > span {

    display:
        block;

    margin-bottom:
        65px;

    color:
        var(--kr-terms-gold);

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        0.14em;
}

.kr-terms-related-grid h3 {

    margin-bottom:
        15px;

    color:
        var(--kr-terms-green);

    font-size:
        27px;

    font-weight:
        400;
}

.kr-terms-related-grid p {

    margin-bottom:
        28px;

    font-size:
        14px;
}

.kr-terms-related-grid strong {

    color:
        var(--kr-terms-text);

    font-size:
        13px;
}


/* ============================================================
   20. FINAL CTA
============================================================ */

.kr-terms-final {

    padding:
        clamp(85px, 9vw, 135px)
        0;

    background:
        linear-gradient(
            135deg,
            var(--kr-terms-ivory-2),
            #ffffff
        );
}

.kr-terms-final-inner {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap:
        60px;

    align-items:
        center;
}

.kr-terms-final h2 {

    max-width:
        780px;

    margin-bottom:
        20px;

    font-size:
        clamp(
            44px,
            5vw,
            72px
        );

    line-height:
        1;
}

.kr-terms-final p {

    max-width:
        680px;

    margin-bottom:
        0;

    font-size:
        16px;
}

.kr-terms-final .kr-terms-actions {

    justify-content:
        flex-end;
}


/* ============================================================
   21. TRUST STRIP
============================================================ */

.kr-terms-trust {

    background:
        var(--kr-terms-white);
}

.kr-terms-trust-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    border-top:
        1px solid var(--kr-terms-border);

    border-left:
        1px solid var(--kr-terms-border);
}

.kr-terms-trust-grid > div {

    min-height:
        150px;

    padding:
        34px
        28px;

    border-right:
        1px solid var(--kr-terms-border);

    border-bottom:
        1px solid var(--kr-terms-border);
}

.kr-terms-trust-grid strong {

    display:
        block;

    margin-bottom:
        9px;

    color:
        var(--kr-terms-text);

    font-size:
        16px;
}

.kr-terms-trust-grid span {

    display:
        block;

    color:
        var(--kr-terms-muted);

    font-size:
        13px;

    line-height:
        1.6;
}


/* ============================================================
   22. WORDPRESS / ASTRA CONTENT SAFETY
============================================================ */

body.page-template-page-terms-conditions .site-content,
body.page-template-page-terms-conditions .content-area,
body.page-template-page-terms-conditions .site-main,
body.page-template-page-terms-conditions .entry-content,

body.page-id-0 .kr-terms-main {

    max-width:
        none;
}

.kr-terms-main .entry-content,
.kr-terms-main .wp-block-group,
.kr-terms-main .elementor,
.kr-terms-main .site-main {

    max-width:
        none;
}

.kr-terms-main .entry-content {

    margin:
        0;

    padding:
        0;
}


/* ============================================================
   23. ACCESSIBILITY
============================================================ */

.kr-terms-main a:focus-visible,
.kr-terms-main button:focus-visible {

    outline:
        2px solid var(--kr-terms-gold);

    outline-offset:
        4px;
}


/* ============================================================
   24. LARGE DESKTOP
============================================================ */

@media (min-width: 1600px) {

    .kr-terms-container {

        width:
            min(
                calc(100% - 120px),
                var(--kr-terms-max)
            );
    }

}


/* ============================================================
   25. DESKTOP / SMALL LAPTOP
============================================================ */

@media (max-width: 1200px) {

    .kr-terms-policy-layout {

        grid-template-columns:
            250px
            minmax(0, 1fr);

        gap:
            55px;
    }

    .kr-terms-steps {

        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .kr-terms-guide-grid {

        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

}


/* ============================================================
   26. TABLET LANDSCAPE
============================================================ */

@media (max-width: 1050px) {

    .kr-terms-policy-layout {

        grid-template-columns:
            1fr;
    }

    .kr-terms-sidebar {

        display:
            none;
    }

    .kr-terms-related-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .kr-terms-final-inner {

        grid-template-columns:
            1fr;
    }

    .kr-terms-final .kr-terms-actions {

        justify-content:
            flex-start;
    }

    .kr-terms-trust-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* ============================================================
   27. TABLET
============================================================ */

@media (max-width: 900px) {

    .kr-terms-container {

        width:
            calc(100% - 40px);
    }

    .kr-terms-notice-inner {

        grid-template-columns:
            1fr;

        gap:
            20px;
    }

    .kr-terms-hero-meta {

        grid-template-columns:
            1fr;
    }

    .kr-terms-hero-meta > div {

        padding:
            20px
            0;

        border-right:
            0;

        border-bottom:
            1px solid var(--kr-terms-border);
    }

    .kr-terms-hero-meta > div:last-child {

        border-bottom:
            0;
    }

    .kr-terms-guide-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .kr-terms-info-grid,
    .kr-terms-contact-details {

        grid-template-columns:
            1fr;
    }

    .kr-terms-steps {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* ============================================================
   28. MOBILE
============================================================ */

@media (max-width: 767px) {

    .kr-terms-container {

        width:
            calc(100% - 32px);
    }

    .kr-terms-hero {

        padding:
            78px
            0
            82px;
    }

    .kr-terms-hero h1 {

        font-size:
            clamp(
                46px,
                13vw,
                65px
            );

        line-height:
            0.98;
    }

    .kr-terms-hero-lead {

        font-size:
            17px;
    }

    .kr-terms-notice-inner {

        padding:
            40px
            0;
    }

    .kr-terms-guide {

        padding:
            72px
            0;
    }

    .kr-terms-guide-grid {

        grid-template-columns:
            1fr;
    }

    .kr-terms-policy {

        padding:
            75px
            0;
    }

    .kr-terms-section {

        padding-bottom:
            65px;

        margin-bottom:
            65px;
    }

    .kr-terms-section h2 {

        font-size:
            clamp(
                38px,
                10vw,
                52px
            );
    }

    .kr-terms-section > p {

        font-size:
            15px;
    }

    .kr-terms-number {

        width:
            46px;

        height:
            46px;

        margin-bottom:
            26px;
    }

    .kr-terms-list-card,
    .kr-terms-callout {

        padding:
            26px
            22px;
    }

    .kr-terms-steps {

        grid-template-columns:
            1fr;
    }

    .kr-terms-steps > div {

        min-height:
            120px;
    }

    .kr-terms-related {

        padding:
            75px
            0;
    }

    .kr-terms-related-grid {

        grid-template-columns:
            1fr;
    }

    .kr-terms-related-grid > a {

        min-height:
            0;

        padding:
            30px
            24px;
    }

    .kr-terms-related-grid > a > span {

        margin-bottom:
            45px;
    }

    .kr-terms-final {

        padding:
            72px
            0;
    }

    .kr-terms-final h2 {

        font-size:
            clamp(
                42px,
                11vw,
                56px
            );
    }

    .kr-terms-actions,
    .kr-terms-contact-actions {

        display:
            grid;

        grid-template-columns:
            1fr;

        width:
            100%;
    }

    .kr-terms-btn {

        width:
            100%;

        min-height:
            56px;
    }

    .kr-terms-trust-grid {

        grid-template-columns:
            1fr;
    }

}


/* ============================================================
   29. SMALL MOBILE
============================================================ */

@media (max-width: 480px) {

    .kr-terms-container {

        width:
            calc(100% - 28px);
    }

    .kr-terms-eyebrow {

        font-size:
            11px;

        letter-spacing:
            0.15em;
    }

    .kr-terms-hero {

        padding:
            68px
            0
            72px;
    }

    .kr-terms-hero h1 {

        font-size:
            48px;
    }

    .kr-terms-guide-header h2,
    .kr-terms-related-header h2,
    .kr-terms-final h2 {

        font-size:
            43px;
    }

    .kr-terms-section h2 {

        font-size:
            40px;
    }

    .kr-terms-info-grid > div,
    .kr-terms-contact-details > div {

        padding:
            22px;
    }

}


/* ============================================================
   30. HOVER-FREE DEVICES
============================================================ */

@media (hover: none) {

    .kr-terms-btn:hover,
    .kr-terms-related-grid > a:hover {

        transform:
            none;
    }

}


/* ============================================================
   31. PRINT
============================================================ */

@media print {

    .kr-terms-main {

        background:
            #ffffff !important;

        color:
            #000000 !important;
    }

    .kr-terms-sidebar,
    .kr-terms-guide,
    .kr-terms-actions,
    .kr-terms-contact-actions,
    .kr-terms-final {

        display:
            none !important;
    }

    .kr-terms-policy {

        padding:
            20px
            0 !important;

        background:
            #ffffff !important;
    }

    .kr-terms-policy-layout {

        display:
            block !important;
    }

    .kr-terms-section {

        break-inside:
            avoid;

        page-break-inside:
            avoid;
    }

    .kr-terms-notice {

        background:
            #ffffff !important;

        color:
            #000000 !important;
    }

    .kr-terms-notice h2,
    .kr-terms-notice p,
    .kr-terms-notice-label {

        color:
            #000000 !important;
    }

}


/* ============================================================
   32. REDUCED MOTION
============================================================ */

@media (prefers-reduced-motion: reduce) {

    .kr-terms-main *,
    .kr-terms-main *::before,
    .kr-terms-main *::after {

        animation:
            none !important;

        transition:
            none !important;

        scroll-behavior:
            auto !important;
    }

}


/* ============================================================
   END OF KRULUXE TERMS-CONDITIONS.CSS
============================================================ */