/* ==========================================================
   Småhus-Spesialisten
   overrides
   Version 2.0
   Lastes etter dhh.css og dhh-theme.css
==========================================================*/

:root{

    /* =====================================================
       LOGOFARGER
    ====================================================== */

    --primary:#3F372A;
    --primary-light:#DCD2C0;

    --white:#FFFFFF;
    --black:#000000;

    /* =====================================================
       BAKGRUNNER
    ====================================================== */

    --bg-page:#f6f3ed;

    --bg-content:#ffffff;

    --bg-section:#dcd2c0;

    --bg-dark:#3F372A;

    --bg-dark-2:#241D2A;

    /* =====================================================
       TEKST
    ====================================================== */

    --text:#38342E;

    --text-light:#ffffff;

    --text-muted:#7A7368;

    --heading:#3F372A;

    /* =====================================================
       LINKER
    ====================================================== */

    --link:#004B8D;

    --link-hover:#33691E;

    --link-visited:#954F72;

    /* =====================================================
       STATUS
    ====================================================== */

    --success:#33691E;

    --warning:#F2B705;

    --danger:#94090D;

    --danger-dark:#D90000;

    /* =====================================================
       MODERNE UI
    ====================================================== */

    --radius-xs:4px;

    --radius-sm:6px;

    --radius:10px;

    --radius-lg:16px;

    --transition:all .25s ease;

    --shadow-sm:
        0 2px 8px rgba(0,0,0,.08);

    --shadow:
        0 8px 24px rgba(0,0,0,.10);

    --shadow-lg:
        0 16px 48px rgba(0,0,0,.15);

    --border:#d7d7d7;

}
/* ==========================================================
   GLOBALE OVERSTYRINGER
========================================================== */


/* Fjern gamle gradienter */

*,
*::before,
*::after{

    background-image:none;

}

/* Jevnere beregning av bredder */

*,
*::before,
*::after{

    box-sizing:border-box;

}

/* ==========================================================
   HTML / BODY
========================================================== */

html{

    background:var(--bg-page);

    scroll-behavior:smooth;

}

body{

    background:var(--bg-page);

    color:var(--text);

/*    font-family:"Lucida Fax", Georgia, serif;

    font-size:16px;

    line-height:1.65;

    margin:0;

    padding:0;

    overflow-x:hidden;

    text-rendering:optimizeLegibility;

    -webkit-font-smoothing:antialiased;
*/
}

/* ==========================================================
   YTTERSTE CONTAINERE
========================================================== */

/* Fjerner hvite felter rundt hele siden */

.site,
.site-wrapper,
.site-container,
.page-wrapper,
.page,
.wrapper,
.outer-wrapper,
.main-wrapper{

    background:var(--bg-page);

}

/* ==========================================================
   HOVEDINNHOLD
========================================================== */

main,
.site-main,
.content,
.content-area,
.entry-content{

    background:var(--bg-content);

}

/* ==========================================================
   SECTION
========================================================== */

section{

    position:relative;

    background:transparent;

}

/* ==========================================================
   CONTAINER
========================================================== */

.container,
.container-fluid{

    position:relative;

}

/* ==========================================================
   KORT
========================================================== */

.card,
.widget,
.panel,
.box,
.feature-box,
.wp-block-group{

    background:var(--bg-content);

    border:none;

    border-radius:var(--radius);

    box-shadow:var(--shadow-sm);

    transition:var(--transition);

}

.card:hover,
.widget:hover,
.panel:hover,
.box:hover{

    box-shadow:var(--shadow);

}

/* ==========================================================
   BILDER
========================================================== */

img{

    max-width:100%;

    height:auto;

    border-radius:var(--radius-xs);

}

/* ==========================================================
   HORISONTALE LINJER
========================================================== */

hr{

    border:0;

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

    margin:40px 0;

}

/* ==========================================================
   SEKSJONER MED MØRK BAKGRUNN
========================================================== */

.bg-dark,
.dark-section,
.footer-dark{

    background:var(--bg-dark);

    color:var(--text-light);

}

/* ==========================================================
   LYSE SEKSJONER
========================================================== */

.bg-light{

    background:var(--primary-light);

}

/* ==========================================================
   STANDARD MARGINS
========================================================== */

section{

    padding-top:40px;

    padding-bottom:40px;

}

/* ==========================================================
   ANIMASJONER
========================================================== */

a,
button,
input,
textarea,
select{

    transition:var(--transition);

}
/* ==========================================================
   HEADER
========================================================== */

header,
.site-header,
#masthead,
.header,
.main-header{

    background:var(--primary);

    color:var(--primary-light);

    border:none;

    box-shadow:0 2px 10px rgba(0,0,0,.12);

    position:relative;

    z-index:1000;

}

/* ==========================================================
   LOGO
========================================================== */

.site-logo img,
.custom-logo{

    max-height:90px;

    width:auto;

}

.site-title,
.site-title a{

    color:var(--primary-light);

    font-family:"Segoe UI",sans-serif;

    font-weight:700;

    text-decoration:none;

    letter-spacing:.4px;

}

.site-description{

    color:rgba(220,210,192,.85);

}

/* ==========================================================
   HOVEDMENY
========================================================== */

.main-navigation,
.navbar,
.primary-menu,
.main-menu{

    background:transparent;

    border:none;

}

.main-navigation ul,
.navbar ul,
.primary-menu ul{

    list-style:none;

    margin:0;

    padding:0;

}

/* ==========================================================
   MENYLENKER
========================================================== */

.main-navigation a,
.navbar a,
.primary-menu a{

    color:var(--primary-light);

/*    text-decoration:none;

    font-weight:600;

    padding:16px 18px;

    display:block;

    transition:var(--transition);
*/
}

/* Hover */

.main-navigation a:hover,
.navbar a:hover,
.primary-menu a:hover{

    color:var(--warning);

}

/* Aktiv side */

.current-menu-item>a,
.current_page_item>a,
.current-menu-ancestor>a{

    color:white;

    background:rgba(255,255,255,.08);

    border-radius:var(--radius-xs);

}

/* ==========================================================
   DROPDOWN
========================================================== */

.main-navigation ul ul,
.navbar ul ul{

    background:var(--primary);

    border:none;

    border-radius:var(--radius);

    box-shadow:var(--shadow);

    padding:8px 0;

}

/* Elementer i dropdown */

.main-navigation ul ul a,
.navbar ul ul a{

    padding:12px 20px;

    color:var(--primary-light);

}

/* Hover i dropdown */

.main-navigation ul ul a:hover,
.navbar ul ul a:hover{

    background:rgba(255,255,255,.08);

    color:white;

}

/* ==========================================================
   STICKY HEADER
========================================================== */

.is-sticky,
.sticky-header,
.fixed-header{

    background:rgba(63,55,42,.97);

    backdrop-filter:blur(8px);

    box-shadow:0 4px 18px rgba(0,0,0,.18);

}

/* ==========================================================
   SØKEFELT I HEADER
========================================================== */

.header-search input[type="search"]{

    background:white;

    color:var(--text);

    border:none;

    border-radius:40px;

    padding:10px 18px;

}

.header-search button{

    background:var(--link);

    color:white;

    border:none;

    border-radius:40px;

}

.header-search button:hover{

    background:var(--success);

}

/* ==========================================================
   MOBILMENY
========================================================== */

.menu-toggle,
.navbar-toggler{

    background:transparent;

    color:var(--primary-light);

    border:2px solid rgba(220,210,192,.4);

    border-radius:var(--radius-xs);

}

.menu-toggle:hover,
.navbar-toggler:hover{

    background:rgba(255,255,255,.08);

}

/* ==========================================================
   BRØDSMULER
========================================================== */

.breadcrumb,
.breadcrumbs{

    background:transparent;

    color:var(--primary-light);

/*    font-size:.92rem;
*/
}

.breadcrumb a,
.breadcrumbs a{

    color:var(--primary-light);

}

.breadcrumb a:hover,
.breadcrumbs a:hover{

    color:var(--warning);

}