a{
    text-decoration: none !important;
    color:white;
}

a:hover{
    color:rgb(192, 192, 192);
}

.christmas-link {
    background-color: #b30000;
    /* dyp rød */
    color: #fff !important;
    font-weight: bold;
    padding: 15px 30px;
    border-radius: 50px;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: background-color 0.3s ease;
    display: inline-block;
}

.christmas-link:hover {
    background-color: #8c0000;
    text-decoration: none;
    color: #fff !important;
}

/* frontpage — todelt hero */

.hero-split{
    display:grid;
    grid-template-columns:1fr 1fr;
    min-height:76vh;
    background-color:#f8f4ef;
}

.hero-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:5rem 4rem 5rem 7%;
}

.hero-eyebrow{
    font-family:'Reem Kufi', sans-serif;
    text-transform:uppercase;
    letter-spacing:0.22em;
    font-size:0.9rem;
    color:#a68a6e;
    margin:0 0 1.35rem;
}

.hero-text h1{
    font-size:3.9rem;
    line-height:1.12;
    color:#2b2b2b;
    margin:0;
}

.hero-lead{
    font-size:1.2rem;
    line-height:1.6;
    color:#4a4a4a;
    max-width:34rem;
    margin:1.85rem 0 0;
}

/* To i bredden: med fire valg ville tre spalter latt det siste bli stående
   alene på egen rad, og fire spalter gjort knappene så smale at «Se
   cateringmeny» brekker. */
.hero-choices{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:1rem;
    max-width:42rem;
    margin-top:2.75rem;
}

.hero-choice{
    display:block;
    padding:1.3rem 1.4rem;
    background-color:#a68a6e;
    border:2px solid #a68a6e;
    border-radius:12px;
    transition:background-color 0.3s ease, transform 0.3s ease;
}

.hero-choice:hover{
    background-color:#8a6e52;
    border-color:#8a6e52;
    transform:translateY(-3px);
}

.hero-choice-label{
    display:block;
    font-family:'Prosto One', cursive;
    font-size:1.08rem;
    line-height:1.3;
    color:white;
}

.hero-choice-text{
    display:block;
    font-family:'Reem Kufi', sans-serif;
    font-size:0.88rem;
    line-height:1.4;
    color:#f3e9de;
    margin-top:0.45rem;
}

.hero-choice-alt{
    background-color:transparent;
}

.hero-choice-alt .hero-choice-label{
    color:#6f5942;
}

.hero-choice-alt .hero-choice-text{
    color:#7a6a58;
}

.hero-choice-alt:hover{
    background-color:#efe4d6;
    border-color:#a68a6e;
}

.hero-choice-alt:hover .hero-choice-label{
    color:#6f5942;
}

/* Liten botanisk vignett i hjørnet av minnestundknappen — samme motiv som
   brukes på selve minnestundsiden. Speilvendes, fordi hjørnestykket er
   tegnet for øvre venstre hjørne. */

.hero-choice-minnestund{
    position:relative;
    overflow:hidden;
}

.hero-choice-minnestund::after{
    content:"";
    position:absolute;
    top:-0.5rem;
    right:-0.5rem;
    width:6rem;
    height:5rem;
    background-image:url("../img/minnestund/botanikk-1.svg");
    background-repeat:no-repeat;
    /* Bildet skaleres større enn feltet, slik at bare den tette delen
       av hjørnemotivet vises — resten klippes bort av knappen. */
    background-size:11rem auto;
    background-position:left top;
    transform:scaleX(-1);
    opacity:0.75;
    pointer-events:none;
}

/* Snarvei under de tre valgknappene, for dem som alt vet hva de vil ha.
   Holdt som tekstlenke med vilje: en btn-order her ville konkurrert med
   den brune cateringknappen rett over. */

.hero-bestill{
    display:inline-flex;
    align-items:center;
    gap:0.7rem;
    margin-top:1.35rem;
    font-family:'Reem Kufi', sans-serif;
    font-size:2rem;
    color:#6f5942;
    /* Uten denne legger Bootstrap sin egen strek under hele lenka ved
       hover — altså også under ikonet. Streken settes på teksten i stedet. */
    text-decoration:none;
    /* Lenka vokser mot høyre i stedet for å gli utover i begge retninger. */
    transform-origin:left center;
    transition:color 0.3s ease, transform 0.3s ease;
}

.hero-bestill-ikon{
    flex:none;
    width:2.1rem;
    height:auto;
}

.hero-bestill:hover{
    color:#8a6e52;
    text-decoration:none;
    transform:scale(1.04);
}

.hero-bestill:hover span{
    text-decoration:underline;
    text-underline-offset:0.28rem;
}

/* Heroens bildebytte ved hover på valgknappene */

.hero-image{
    position:relative;
    overflow:hidden;
}

.hero-img{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    opacity:0;
    transition:opacity 0.45s ease;
}

.hero-img img,
img.hero-img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.hero-img-default{
    opacity:1;
}

/* Hvitt slør med logo oppå standardbildet */

.hero-overlay{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:rgba(166, 138, 110, 0.78);
    opacity:1;
    transition:opacity 0.45s ease;
    pointer-events:none;
}

.hero-overlay-logo{
    width:52%;
    max-width:330px;
    height:auto;
}

.hero-split:has(.hero-choice:is(:hover, :focus-visible)) .hero-img-default,
.hero-split:has(.hero-choice:is(:hover, :focus-visible)) .hero-overlay{
    opacity:0;
}

/* Lunsjen serveres i de samme lokalene, så den deler bilde med "Selskap hos
   oss". Uten en regel her ville heroen blitt stående tom ved hover: regelen
   over skjuler standardbildet for alle .hero-choice. */
.hero-split:has(.hero-choice-huset:is(:hover, :focus-visible)) .hero-img-huset,
.hero-split:has(.hero-choice-lunsj:is(:hover, :focus-visible)) .hero-img-huset{
    opacity:1;
}

.hero-split:has(.hero-choice-catering:is(:hover, :focus-visible)) .hero-img-catering{
    opacity:1;
}

.hero-split:has(.hero-choice-minnestund:is(:hover, :focus-visible)) .hero-img-minnestund{
    opacity:1;
}

/* frontpage slutt*/

/* Lokaler + kart */

.lokaler{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:stretch;
}

.lokaler-text{
    padding:5rem 4rem 5rem 7%;
}

.lokaler-text h2{
    font-family:'Prosto One', cursive;
    font-size:2.6rem;
    line-height:1.15;
    color:#2b2b2b;
    margin:0 0 1.75rem;
}

.lokaler-text p{
    font-size:1.1rem;
    line-height:1.65;
    color:#4a4a4a;
    max-width:34rem;
    margin:0 0 1.15rem;
}

.lokaler-knapper{
    display:flex;
    flex-wrap:wrap;
    gap:1rem;
    margin-top:2.25rem;
}

.btn-order.btn-order-alt{
    background-color:transparent;
    border:2px solid #a68a6e;
    color:#6f5942 !important;
    padding:0.775rem 2.35rem;
}

.btn-order.btn-order-alt:hover{
    background-color:#efe4d6;
    color:#6f5942 !important;
}

.lokaler-kart{
    min-height:520px;
}

.lokaler-kart iframe{
    display:block;
    width:100%;
    height:100%;
    border:0;
}


/* Selskapsrom */

.selskapsrom{
    padding:5rem 7% 6rem;
    background-color:#f8f4ef;
}

.selskapsrom-topp{
    max-width:44rem;
    margin:0 auto;
    text-align:center;
}

.selskapsrom-topp h2{
    font-family:'Prosto One', cursive;
    font-size:2.4rem;
    color:#2b2b2b;
    margin:0 0 1.5rem;
}

.selskapsrom-topp p{
    font-size:1.1rem;
    line-height:1.65;
    color:#4a4a4a;
    margin:0;
}

.rom-kort-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:2.5rem;
    max-width:64rem;
    margin:3.5rem auto 0;
}

.rom-kort{
    background-color:white;
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 4px 18px rgba(0, 0, 0, .07);
}

.rom-bilde{
    display:block;
    width:100%;
    height:260px;
    object-fit:cover;
}

.rom-bilde-tom{
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:#e7dccd;
    color:#8a7359;
    font-family:'Reem Kufi', sans-serif;
    font-size:0.95rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
}

.rom-kort-tekst{
    padding:1.75rem 1.85rem 2rem;
}

.rom-kort-tekst h3{
    font-family:'Prosto One', cursive;
    font-size:1.4rem;
    color:#2b2b2b;
    margin:0;
}

.rom-kapasitet{
    font-family:'Reem Kufi', sans-serif;
    font-size:1rem;
    color:#8a6e52;
    margin:0.5rem 0 0.9rem;
}

.rom-kort-tekst p:last-child{
    font-size:1.05rem;
    line-height:1.6;
    color:#4a4a4a;
    margin:0;
}

.selskapsrom-cta{
    text-align:center;
    margin-top:3.25rem;
}

@media only screen and (max-width: 991px) {
    .hero-split{
        grid-template-columns:1fr;
        min-height:0;
    }

    .hero-image{
        order:-1;
        height:38vh;
    }

    .hero-text{
        padding:2.75rem 1.5rem 3.5rem;
    }

    .hero-text h1{
        font-size:2.3rem;
    }

    .hero-lead{
        font-size:1.1rem;
    }

    .hero-choices{
        grid-template-columns:minmax(0, 1fr);
        margin-top:2rem;
    }

    .lokaler{
        grid-template-columns:1fr;
    }

    .lokaler-text{
        padding:3rem 1.5rem;
    }

    .lokaler-kart{
        min-height:0;
        height:45vh;
    }

    .selskapsrom{
        padding:3.5rem 1.5rem 4rem;
    }

    .rom-kort-grid{
        grid-template-columns:minmax(0, 1fr);
        gap:2rem;
        margin-top:2.5rem;
    }

    .rom-bilde{
        height:210px;
    }
}

@media only screen and (max-width: 768px) {
    .lokaler-text h2{
        font-size:1.9rem;
    }

    .selskapsrom-topp h2{
        font-size:1.8rem;
    }
}

