/*
 * AutoSolution — Brand Redesign 2026
 * Farger: Rød #E53012 + Oransj #FF6B35 (offisiell profil)
 */

:root {
    --as-red:        #E53012;
    --as-orange:     #FF6B35;
    --as-gradient:   linear-gradient(135deg, #E53012 0%, #FF6B35 100%);
    --as-black:      #0F0F0F;
    --as-dark:       #1A1A1A;
    --as-darker:     #111111;
    --as-white:      #FFFFFF;
    --as-light:      #F8F8F8;
    --as-gray:       #888888;
    --as-gray-light: #CCCCCC;
    --as-radius:     6px;
    --as-shadow:     0 4px 24px rgba(229,48,18,.18);
    --as-transition: all 0.28s cubic-bezier(.4,0,.2,1);
}

/* ===========================
   GLOBAL
   =========================== */
body {
    background-color: #F5F5F5 !important;
    font-family: 'Open Sans','Segoe UI',Arial,sans-serif !important;
    color: #222 !important;
    -webkit-font-smoothing: antialiased;
}
a, a:focus { color: var(--as-red) !important; transition: var(--as-transition); }
a:hover    { color: var(--as-orange) !important; text-decoration: none !important; }
h1,h2,h3,h4,h5,h6 { letter-spacing: -.01em; font-weight: 700 !important; }

/* ===========================
   HEADER & NAVIGASJON
   =========================== */
header,
header .bottom-header,
.bottom-header .navbar-default,
header .dropdown .dropdown-menu li.dropdown .dropdown-menu,
header .navbar-nav.pull-right > li > .dropdown-menu,
header .navbar-nav > li > .dropdown-menu {
    background-color: var(--as-darker) !important;
}
.toolbar { background-color: #080808 !important; border-bottom: 1px solid #1e1e1e !important; }
.toolbar ul li a, .toolbar .search_box, header .toolbar button, .toolbar ul li i {
    color: #BBBBBB !important;
}
.toolbar ul li a:hover, .toolbar ul li i:hover { color: var(--as-orange) !important; }

.bottom-header .navbar-default .navbar-nav > li > a,
header .bottom-header .navbar-default .navbar-nav > li > a,
.navbar .navbar-nav li .dropdown-menu > li > a,
.dropdown .dropdown-menu li.dropdown .dropdown-menu > li > a {
    color: #EEEEEE !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    padding: 20px 16px !important;
    transition: var(--as-transition) !important;
}

/* Aktiv/hover nav */
.bottom-header .navbar-default .navbar-nav > .active > a,
header .bottom-header .navbar-default .navbar-nav > .active > a,
.bottom-header .navbar-default .navbar-nav > .active > a:hover,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover {
    background: var(--as-red) !important;
    background-color: var(--as-red) !important;
    color: var(--as-white) !important;
}
.bottom-header .navbar-default .navbar-nav > li > a:hover,
.dropdown-menu > li > a:hover,
.dropdown-menu > li.active > a:hover {
    background: var(--as-orange) !important;
    background-color: var(--as-orange) !important;
    color: var(--as-white) !important;
}

.dropdown-menu {
    background: var(--as-darker) !important;
    border: 1px solid #2A2A2A !important;
    border-top: 2px solid var(--as-red) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
    border-radius: 0 0 var(--as-radius) var(--as-radius) !important;
}

/* Logo */
header .bottom-header .navbar-default .navbar-brand .logo .primary_text {
    color: var(--as-orange) !important;
    font-size: 26px !important;
    letter-spacing: .04em !important;
}
header .bottom-header .navbar-default .navbar-brand .logo .secondary_text {
    color: #CCCCCC !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
}

/* ===========================
   SEKUNDÆRBANNER / BREADCRUMB
   =========================== */
#secondary-banner {
    background: linear-gradient(135deg, var(--as-darker) 0%, #1E1E1E 100%) !important;
    border-bottom: 3px solid var(--as-red) !important;
    padding: 16px 0 !important;
}
#secondary-banner h1, #secondary-banner h2 { color: var(--as-white) !important; font-size: 28px !important; }
.breadcrumb li, .breadcrumb li a, .breadcrumb > li + li:before { color: #BBBBBB !important; font-size: 13px !important; }
.breadcrumb li a:hover { color: var(--as-orange) !important; }

/* ===========================
   INNHOLD
   =========================== */
section.content, .car-block-wrap, .welcome-wrap { background-color: var(--as-white) !important; }

/* ===========================
   BILKORT
   =========================== */
.car-block {
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.09) !important;
    transition: var(--as-transition) !important;
    border: 1px solid #EBEBEB !important;
    background: var(--as-white) !important;
    margin-bottom: 28px !important;
}
.car-block:hover {
    box-shadow: 0 8px 40px rgba(229,48,18,.18) !important;
    transform: translateY(-5px) !important;
    border-color: var(--as-red) !important;
}
.car-block-bottom {
    padding: 16px 20px !important;
    background: var(--as-white) !important;
    transition: var(--as-transition) !important;
}
.car-block:hover .car-block-bottom { background: var(--as-darker) !important; }
.car-block:hover .car-block-bottom h4 a,
.car-block:hover .car-block-bottom p,
.car-block:hover .car-block-bottom span { color: var(--as-white) !important; }
.car-block-wrap h4 a { font-size: 16px !important; font-weight: 700 !important; color: #1A1A1A !important; }
.car-block-wrap h4 a:hover { color: var(--as-red) !important; }
.car-block .price, .car-block .car-price, .listing-price {
    color: var(--as-red) !important; font-size: 18px !important; font-weight: 700 !important;
}

/* ===========================
   KNAPPER
   =========================== */
.default-btn, .default-btn:focus,
.form-element input[type=submit],
.side-content form input[type=submit],
input[type="reset"], input[type="submit"], input[type="button"],
.btn-inventory,
.porche-footer input[type="submit"], .porche-footer input[type="button"],
.leave-comments form input[type=submit] {
    background: var(--as-gradient) !important;
    background-color: var(--as-red) !important;
    color: var(--as-white) !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: var(--as-radius) !important;
    padding: 12px 28px !important;
    font-size: 13px !important;
    transition: var(--as-transition) !important;
    box-shadow: 0 2px 12px rgba(229,48,18,.3) !important;
}
.default-btn:hover, .btn-inventory:hover,
input[type="submit"]:hover, input[type="button"]:hover,
input[type="reset"]:hover {
    background: var(--as-darker) !important;
    background-color: var(--as-darker) !important;
    color: var(--as-orange) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.3) !important;
    transform: translateY(-2px) !important;
}

/* ===========================
   FLIPPING CARDS (forsiden)
   =========================== */
.flip .card .back {
    background: var(--as-gradient) !important;
    background-color: var(--as-red) !important;
}
.flip .card .back i.button_icon:hover:before { color: var(--as-orange) !important; }

/* ===========================
   FEATURED ICON BOXES (forsiden)
   =========================== */
.featured-service .featured:hover { background: var(--as-red) !important; }
.featured-service .featured .caption { background: var(--as-gradient) !important; }
.featured-service h2, .detail-service h2 { color: var(--as-darker) !important; font-size: 28px !important; }

/* ===========================
   FINANS-LOGOER SEKSJON
   =========================== */
.as-finans-logos {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.15) !important;
}
.as-finans-logos img {
    height: 32px !important;
    width: auto !important;
    max-width: 110px !important;
    object-fit: contain !important;
    filter: brightness(0) invert(1) !important;
    opacity: .9 !important;
    transition: opacity .2s !important;
}
.as-finans-logos img:hover { opacity: 1 !important; }

/* ===========================
   PARALLAX IKON-BOKSER
   =========================== */
.parallax_parent .parallax_scroll h4 { color: var(--as-white) !important; font-size: 22px !important; }

/* ===========================
   SMALL BLOCKS
   =========================== */
.small-block { border-radius: var(--as-radius) !important; transition: var(--as-transition) !important; padding: 20px !important; }
.small-block:hover { background: var(--as-darker) !important; box-shadow: var(--as-shadow) !important; }
.small-block:hover h4 { color: var(--as-orange) !important; }

/* ===========================
   SIDEINNHOLD / FILTRE
   =========================== */
.side-content .list h3, .side-content h3, .side-content .financing_calculator h3 { color: var(--as-red) !important; }
.left_inventory h2, .left_inventory h3, .inventory-heading h2 { color: var(--as-darker) !important; font-size: 24px !important; font-weight: 700 !important; }
.inventory-heading span { color: var(--as-red) !important; font-weight: 600 !important; }

.search-box-wrap, .car-search-form, .side-content .list {
    background: var(--as-darker) !important;
    border-radius: var(--as-radius) !important;
    padding: 24px !important;
    box-shadow: var(--as-shadow) !important;
}

/* ===========================
   SKJEMAER
   =========================== */
body input, body select, body textarea, body input[type="text"],
body textarea[name="message"], input.form-control, input[type="search"] {
    border: 1px solid #DDD !important;
    border-radius: var(--as-radius) !important;
    padding: 10px 14px !important;
    transition: var(--as-transition) !important;
    background-color: #FAFAFA !important;
}
body input:focus, body select:focus, body textarea:focus, input.form-control:focus {
    border-color: var(--as-red) !important;
    box-shadow: 0 0 0 3px rgba(229,48,18,.12) !important;
    outline: none !important;
}

/* ===========================
   PAGINERING
   =========================== */
.pagination > li > a, .pagination > li > span {
    border-radius: var(--as-radius) !important; margin: 0 3px !important;
    color: var(--as-darker) !important; border: 1px solid #DDD !important;
    transition: var(--as-transition) !important;
}
.pagination > li > a:hover, .pagination > li > span:hover,
.pagination > li > a:focus, .pagination > li > span:focus {
    background: var(--as-red) !important;
    background-color: var(--as-red) !important;
    border-color: var(--as-red) !important;
    color: var(--as-white) !important;
}

/* ===========================
   TILBAKE TIL TOPP
   =========================== */
.back_to_top {
    background: var(--as-gradient) !important;
    border-radius: 50% !important;
    width: 44px !important; height: 44px !important; line-height: 44px !important;
    box-shadow: 0 2px 12px rgba(229,48,18,.4) !important;
    transition: var(--as-transition) !important;
}
.back_to_top:hover { background: var(--as-darker) !important; transform: translateY(-3px) !important; }

/* ===========================
   FOOTER
   =========================== */
footer {
    background: var(--as-darker) !important;
    color: #AAAAAA !important;
    border-top: 3px solid var(--as-red) !important;
    padding: 48px 0 32px !important;
}
footer h3, footer h4, footer .widget-title {
    color: var(--as-orange) !important;
    font-size: 15px !important;
    text-transform: uppercase !important;
    letter-spacing: .1em !important;
    border-bottom: 1px solid #2A2A2A !important;
    padding-bottom: 10px !important;
    margin-bottom: 16px !important;
}
footer p, footer ul li, footer span { color: #AAAAAA !important; font-size: 14px !important; line-height: 1.8 !important; }
footer a { color: #AAAAAA !important; transition: var(--as-transition) !important; }
footer a:hover { color: var(--as-orange) !important; }
.copyright-wrap { background: #060606 !important; padding: 16px 0 !important; border-top: 1px solid #1E1E1E !important; }
.copyright-wrap p, .copyright-wrap span, .copyright-wrap a { color: #555 !important; font-size: 13px !important; }
.copyright-wrap a:hover { color: var(--as-orange) !important; }

/* ===========================
   DIVERSE AKSENTFARGER
   =========================== */
a, a:hover, a:focus,
.firstcharacter, .list-info span.text-red,
.car-block-wrap h4 a, .welcome-wrap h4,
.small-block:hover h4, .small-block:hover a i,
.recent-vehicles h5, .about-us h3, .blog-container h3,
.blog-post h3, .side-content h3, .services h3,
.list_faq ul li.active a, .list_faq ul li a:hover,
.right_faq .side-widget h3, .side-content .side-blog strong,
.featured-service h2, .featured-service h2 strong,
.detail-service h2, .detail-service h2 strong,
.find_team h2, .our_inventory h4, .our_inventory span,
.read-more a, .find_map h2, .information_head h3,
.left_inventory h2, .left_inventory h3 {
    color: var(--as-red) !important;
}
.choose-list ul li:before,
.detail-service .details h5:before,
.services .right-content ul li:before,
body ul.shortcode.type-checkboxes li i,
#features ul li .fa-li { color: var(--as-orange) !important; }

.angled_badge.theme_color:before { border-left-color: var(--as-red) !important; border-right-color: var(--as-red) !important; }
.listing-slider .angled_badge.theme_color:before { border-color: var(--as-red) rgba(0,0,0,0) !important; }

.post-entry blockquote { border-left-color: var(--as-red) !important; }

/* Progressbar */
.progressbar .progress .progress-bar-danger { background: var(--as-gradient) !important; }

/* ===========================
   HERO ANIMASJONER (ny seksjon over RevSlider)
   =========================== */
@keyframes as-fadeUp   { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes as-fadeIn   { from { opacity:0; } to { opacity:1; } }
@keyframes as-slideRight { from { opacity:0; transform:translateX(-40px); } to { opacity:1; transform:translateX(0); } }
@keyframes as-pulse    { 0%,100% { transform:scale(1); } 50% { transform:scale(1.04); } }
@keyframes as-shimmer  { 0% { background-position:-400px 0; } 100% { background-position:400px 0; } }
@keyframes as-float    { 0%,100% { transform:translateY(0px); } 50% { transform:translateY(-8px); } }

/* ===========================
   AS HERO BANNER (erstatter / supplerer RevSlider)
   =========================== */
.as-hero-wrap {
    position: relative;
    background: var(--as-darker);
    min-height: 520px;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.as-hero-wrap::before {
    content:'';
    position:absolute; inset:0;
    background: linear-gradient(135deg, rgba(229,48,18,.85) 0%, rgba(255,107,53,.7) 60%, rgba(15,15,15,.95) 100%);
    z-index:1;
}
.as-hero-content {
    position:relative; z-index:2;
    padding: 60px 40px;
    max-width: 640px;
}
.as-hero-content h1 {
    font-size: clamp(28px, 4vw, 52px) !important;
    font-weight: 900 !important;
    color: var(--as-white) !important;
    line-height: 1.1 !important;
    margin-bottom: 16px !important;
    animation: as-fadeUp .7s ease both;
}
.as-hero-content p {
    font-size: 18px !important;
    color: rgba(255,255,255,.88) !important;
    margin-bottom: 28px !important;
    line-height: 1.7 !important;
    animation: as-fadeUp .7s .15s ease both;
}
.as-hero-btn {
    display: inline-block !important;
    background: var(--as-white) !important;
    color: var(--as-red) !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    padding: 16px 36px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    transition: var(--as-transition) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.2) !important;
    animation: as-fadeUp .7s .3s ease both !important;
    letter-spacing: .04em !important;
}
.as-hero-btn:hover {
    background: var(--as-orange) !important;
    color: var(--as-white) !important;
    transform: translateY(-3px) scale(1.03) !important;
    box-shadow: 0 8px 30px rgba(229,48,18,.35) !important;
}
.as-hero-cars {
    position:absolute; right:0; bottom:0; top:0; z-index:1;
    width: 55%;
    overflow: hidden;
}
.as-hero-cars img {
    width:100%; height:100%;
    object-fit: cover;
    object-position: center;
    opacity: .35;
    animation: as-fadeIn 1.2s ease both;
}

/* ===========================
   STATS-STRIPE (under hero)
   =========================== */
.as-stats-bar {
    background: var(--as-gradient);
    padding: 20px 0;
}
.as-stats-bar .as-stat {
    text-align: center;
    color: var(--as-white);
    padding: 8px 20px;
    border-right: 1px solid rgba(255,255,255,.25);
}
.as-stats-bar .as-stat:last-child { border-right: none; }
.as-stats-bar .as-stat strong { display:block; font-size: 26px; font-weight: 900; line-height:1; }
.as-stats-bar .as-stat span  { font-size: 13px; opacity: .9; }

/* ===========================
   SEKSJONSTITLER
   =========================== */
.as-section-title {
    text-align: center;
    margin-bottom: 36px;
}
.as-section-title h2 {
    font-size: 30px !important;
    font-weight: 800 !important;
    color: var(--as-darker) !important;
    margin-bottom: 8px !important;
}
.as-section-title p { color: #666; font-size: 16px; max-width: 560px; margin: 0 auto; }
.as-section-title::after {
    content:'';
    display:block;
    width: 56px; height: 4px;
    background: var(--as-gradient);
    border-radius: 2px;
    margin: 14px auto 0;
}

/* ===========================
   FINN.NO-KORT (biler)
   =========================== */
.as-car-card {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(0,0,0,.08);
    background: var(--as-white);
    transition: var(--as-transition);
    border: 1px solid #EBEBEB;
}
.as-car-card:hover {
    box-shadow: 0 10px 40px rgba(229,48,18,.15);
    transform: translateY(-6px);
    border-color: var(--as-red);
}
.as-car-card img { width:100%; height:200px; object-fit:cover; transition: transform .4s ease; }
.as-car-card:hover img { transform: scale(1.04); }
.as-car-card-body { padding: 16px; }
.as-car-card-body h3 { font-size: 16px !important; font-weight: 700 !important; color: var(--as-darker) !important; margin-bottom: 4px !important; }
.as-car-card-body .as-price { font-size: 20px; font-weight: 800; color: var(--as-red); }
.as-car-card-body .as-meta { font-size: 13px; color: #888; margin-bottom: 12px; }

/* ===========================
   FORSIKRING + FINANS KORT
   =========================== */
.as-partner-card {
    background: var(--as-white);
    border-radius: 10px;
    border: 1px solid #EBEBEB;
    padding: 28px 24px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
    transition: var(--as-transition);
    height: 100%;
}
.as-partner-card:hover {
    border-color: var(--as-red);
    box-shadow: 0 6px 28px rgba(229,48,18,.12);
    transform: translateY(-3px);
}
.as-partner-card .as-card-icon {
    width: 56px; height: 56px;
    background: var(--as-gradient);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin-bottom: 16px;
    color: var(--as-white);
}
.as-partner-card h3 { font-size: 18px !important; font-weight: 700 !important; color: var(--as-darker) !important; margin-bottom: 8px !important; }
.as-partner-card p { font-size: 14px; color: #555; line-height: 1.7; margin-bottom: 14px; }
.as-partner-logos { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:14px; }
.as-partner-logos img {
    height: 30px; width: auto; max-width: 100px;
    object-fit: contain; opacity: .75;
    transition: opacity .2s;
    filter: grayscale(30%);
}
.as-partner-logos img:hover { opacity: 1; filter: none; }

/* ===========================
   DEKK & FELGER SEKSJON
   =========================== */
.as-dekk-block {
    background: linear-gradient(135deg, #FFF8F5 0%, #FFF 100%);
    border: 1px solid rgba(229,48,18,.15);
    border-left: 4px solid var(--as-red);
    border-radius: 10px;
    padding: 28px 24px;
    transition: var(--as-transition);
}
.as-dekk-block:hover {
    box-shadow: 0 4px 24px rgba(229,48,18,.1);
    transform: translateX(4px);
}

/* ===========================
   ANIMERTE INNKOMMENDE ELEMENTER
   =========================== */
.as-animate-up   { opacity:0; transform:translateY(28px); transition: opacity .6s ease, transform .6s ease; }
.as-animate-up.visible { opacity:1; transform:translateY(0); }
.as-animate-left { opacity:0; transform:translateX(-28px); transition: opacity .6s ease, transform .6s ease; }
.as-animate-left.visible { opacity:1; transform:translateX(0); }
.as-animate-scale{ opacity:0; transform:scale(.96); transition: opacity .5s ease, transform .5s ease; }
.as-animate-scale.visible { opacity:1; transform:scale(1); }

/* ===========================
   MOBIL
   =========================== */
@media(max-width:767px) {
    .car-block { margin-bottom: 20px !important; }
    header .bottom-header .navbar-default .navbar-brand .logo .primary_text { font-size: 20px !important; }
    .as-hero-cars { display:none; }
    .as-hero-wrap { min-height: 380px; }
    .as-hero-content { padding: 40px 20px; }
    .as-stats-bar .as-stat { border-right: none; border-bottom: 1px solid rgba(255,255,255,.2); }
}

/* ===========================
   GENERAL ACCENT OVERRIDES
   =========================== */
#wp-calendar td#today,
body ul.shortcode li .red_box,
button, .pricing_table .pricing-header,
.featured:hover, button:hover,
.arrow1 a:hover, .arrow2 a:hover, .arrow3 a:hover,
.description-accordion .panel-title a:after { background-color: var(--as-red) !important; }

.layout-3 .pricing-header, .layout-4 .pricing-header,
.porche .porche-header { background: var(--as-gradient) !important; }

.flexslider2 .flex-direction-nav li a:hover,
.controls .left-arrow:hover, .controls .right-arrow:hover {
    background: var(--as-red) !important;
}