/* ============================================================================
   terms.css - page styles for terms-and-conditions.html
   Extracted from the live page (header-style.css + style.css) on 17-09-2026.
   Covers only the page content: inner-page hero banner, breadcrumb,
   .main-content / .content-section text, .list-items-leaf lists and the
   .accord-tabs accordion. Header, footer, fonts, .container, .text-center,
   .white and the section float come from header-footer-new.css and are
   deliberately not repeated here.
   Colours use the --ca-* tokens defined in header-footer-new.css.
   ============================================================================ */

/* ---------- Page heading base (h1 is not styled in header-footer-new.css) ---------- */
h1{line-height:1.2;margin-top:0;font-family:museo700;font-size:4.5rem}

/* ---------- Inner-page hero banner ---------- */
.herobanner{min-height:100vh;float:left;width:100%;position:relative;padding-top:15%;padding-bottom:2.5%}
.herobanner:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ca-black-a75)}
.herobanner.innerpage-banner{padding-top:29%;min-height:inherit}
.herobanner.innerpage-banner.terms{background:url(../images/background/terms-banner-img.webp) top center / cover no-repeat}
@supports (-webkit-hyphens:none){
    .herobanner.innerpage-banner.terms{background-image:url(../images/background/terms-banner-img.jpg)}
}
@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){
    .herobanner.innerpage-banner.terms{background-image:url(../images/background/terms-banner-img.jpg)}
}
.herobanner .herobanner-content{float:left;width:100%;padding:0;position:relative;min-height:400px}
.herobanner.innerpage-banner .herobanner-content{position:absolute;top:50%;transform:translate(-50%,-30%);width:100%;left:50%;max-width:1230px;padding:0 15px;min-height:0}
.herobanner.innerpage-banner .herobanner-content .magento-flex{float:left;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:row}
.herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont{display:block;overflow:hidden;width:80%;margin-left:4%;padding-left:4%;border-left:1px solid var(--ca-white-a30)}
.herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont.no-pm{padding:0!important;width:100%;margin:0!important;border:0!important}
.herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont h1{margin-bottom:15px;line-height:1.3;text-transform:inherit;color:inherit;font-size:3rem}
.herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont.no-pm h1{margin-bottom:20px;font-weight:400}

/* ---------- Breadcrumb ---------- */
.breadcrumb{float:left;width:100%;padding:15px 0;margin-bottom:0!important}
.breadcrumb ul{margin:0;padding:0}
.breadcrumb ul li{list-style:none;display:inline-block;float:left;color:var(--ca-black-pure);position:relative;font-size:14px}
.breadcrumb ul li+li{padding-left:20px;margin-left:20px}
.breadcrumb ul li+li:before{content:"";position:absolute;top:8px;left:0;transform:translate(-50%,-50%) rotate(-45deg);width:6px;height:5px;border-right:1px solid var(--ca-black-pure);border-bottom:1px solid var(--ca-black-pure)}
.breadcrumb ul li a{color:var(--ca-black-pure);text-decoration:none}
.breadcrumb ul li a:hover,.breadcrumb ul li span{color:var(--ca-navy)}
.breadcrumb ul li:first-child span{color:var(--ca-black-pure)}

/* ---------- Main content text ---------- */
.main-content{float:left;width:100%}
.content-section>p:first-child{margin-top:50px}
.content-section p{margin-bottom:20px}
.content-section>h2{margin-top:50px;margin-bottom:15px;line-height:1.2;font-size:2.375rem;padding:0}
.content-section strong{font-weight:600}

/* ---------- Leaf bullet lists ---------- */
.list-items-leaf{display:flex;flex-wrap:wrap}
.content-section .list-items-leaf{margin:0;min-width:100%}
.list-items-leaf ul{margin:0;padding:0}
.list-items-leaf ul li{position:relative;display:block;padding-left:40px;margin-top:20px}
.content-section .list-items-leaf li{margin-bottom:10px}
.list-items-leaf ul li:before{content:"";background:url(../images/icons/leaf.svg) no-repeat;width:42px;height:42px;position:absolute;left:0;top:-8px;transform:scale(.5)}
.content-section .list-items-leaf li p{margin:0}
.content-section .list-items-leaf+p{margin-top:40px}

/* ---------- Accordion (.accord-tabs) - toggled by js/terms.js ---------- */
.accord-tabs,.accord-tabs .tabs,.accord-tabs .tabs .tabs-content,.accord-tabs .tabs .tabs-label{float:left;width:100%}
.accord-tabs .tabs{margin-bottom:15px;padding:5px;background:var(--ca-white);border:1px solid var(--ca-gray-380)}
.accord-tabs .tabs .tabs-label{padding:10px 40px 10px 15px;position:relative;background:var(--ca-gray-370);cursor:pointer;font-size:1.3125rem;font-weight:700;line-height:1.8}
.accord-tabs .tabs .tabs-label:after{content:"+";position:absolute;top:50%;right:15px;transform:translate(0,-50%)}
.accord-tabs .tabs .tabs-content{padding:3% 3.5% .5%;display:none}
.accord-tabs .tabs.show .tabs-content{display:block}
.accord-tabs .tabs.show .tabs-label:after{content:"-"}

/* ---------- Responsive ---------- */
@media screen and (max-width:1366px){
    .herobanner.innerpage-banner{padding-top:35%}
}
@media screen and (max-width:1199px){
    .content-section p{font-size:14px}
}
@media screen and (max-width:1024px){
    .herobanner{padding-top:20%;min-height:inherit}
    .herobanner.innerpage-banner{padding-top:40%}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont h1{font-size:3rem}
    .accord-tabs .tabs .tabs-label{font-size:1.25rem}
}
@media screen and (max-width:991px){
    .herobanner .herobanner-content{padding:0 5%}
    .herobanner.innerpage-banner{padding-top:45%}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont h1{font-size:2.5rem}
    .content-section p{font-size:15px;margin-bottom:15px}
    .content-section>h2{margin-top:30px;margin-bottom:15px}
    .list-items-leaf{margin:0;padding:0 15px}
    .content-section .list-items-leaf{padding:0 20px}
    .list-items-leaf ul li{padding-left:40px;margin-bottom:20px}
    .list-items-leaf ul li:before{transform:scale(.5);top:-10px}
    .content-section .list-items-leaf+p{margin-top:30px}
    .accord-tabs .tabs .tabs-label{font-size:1.125rem}
}
@media screen and (max-width:767px){
    .herobanner{padding-top:20%}
    .herobanner.innerpage-banner{padding-top:17%!important;padding-bottom:18%}
    .herobanner.innerpage-banner.terms{background-image:url(../images/background/terms-banner-img-mobile.webp)}
    @supports (-webkit-hyphens:none){
        .herobanner.innerpage-banner.terms{background-image:url(../images/background/terms-banner-img-mobile.jpg)}
    }
    .herobanner .herobanner-content{padding:0;min-height:0}
    .herobanner.innerpage-banner .herobanner-content{position:relative;transform:none;z-index:1;left:0;right:0}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont{text-align:left}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont h1{font-size:1.8rem}
    .breadcrumb ul li{font-size:13px;margin-bottom:10px}
    .content-section .list-items-leaf{padding:0}
    .list-items-leaf ul li{margin-bottom:10px;padding-left:40px}
    .list-items-leaf ul li:before{transform:scale(.5);top:-8px}
}
@media screen and (max-width:575px){
    .herobanner.innerpage-banner{padding-top:60%}
}
@media screen and (max-width:479px){
    .herobanner{padding-bottom:5%}
    .herobanner.innerpage-banner{padding-top:15%!important;padding-bottom:15%}
    .herobanner.innerpage-banner .herobanner-content{transform:translate(-50%,0);position:relative}
    .herobanner.innerpage-banner .herobanner-content .magento-flex{flex-wrap:wrap}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont{width:100%;margin:0;padding:0;border:0;float:left;text-align:left}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont.no-pm h1{margin-bottom:15px}
    .herobanner.innerpage-banner .herobanner-content .magento-flex .magento-cont h1{font-size:1.8rem}
    .content-section h2{font-size:1.825rem}
    .list-items-leaf ul li{padding-left:40px}
    .list-items-leaf ul li:before{transform:scale(.5);top:-8px}
}
