:root{--dark:#10251b;--green:#1e3b2c;--gold:#c79a52;--cream:#f4eee3;--cream-dark:#e8dece;--brown:#694a30;--gray:#6d6961;--white:#fff}*
{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--dark);font:16px/1.6 Arial,Helvetica,sans-serif}
a{text-decoration:none;color:inherit}.container{width:min(1100px,calc(100% - 40px));margin:auto}
.site-header{position:absolute;width:100%;z-index:2;padding:24px 0;color:#fff}
.header-inner{width:min(1150px,calc(100% - 40px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:25px}
.logo{font:700 25px Georgia,serif;letter-spacing:.04em}
.logo small{display:block;color:var(--gold);font:700 10px Arial,sans-serif;letter-spacing:3px}
.main-nav{display:flex;align-items:center;gap:22px;font-size:14px;font-weight:bold}
.main-nav a:hover{color:var(--gold)}.phone{border:1px solid #ffffff66;border-radius:30px;padding:8px 14px}
.menu-toggle{display:none}
.hero{min-height:680px;display:grid;align-items:center;padding:140px 0 90px;color:#fff;background:radial-gradient(circle at 80% 20%,#c79a5240,transparent 30%),
    linear-gradient(115deg,#081a11,#173a28 52%,#68482e)}
    .eyebrow,
    .label{color:var(--gold);font-size:12px;font-weight:bold;letter-spacing:3px;text-transform:uppercase}
    .hero h1,.section h2,.visit h2{margin:16px 0 24px;font:700 clamp(48px,8vw,96px)/.92 Georgia,serif}
    .hero h1 span{color:var(--gold)}
    .hero-text{max-width:590px;color:#ffffffc7;font-size:18px}
    .button{
        display:inline-block;
        margin-top:18px;
        padding:14px 25px;
        border-radius:30px;
        background:var(--gold);
        color:#18140e;
        font-weight:bold;
        transition:.2s
    }
    .button:hover{transform:translateY(-3px);background:#d8ad66}.section{padding:105px 0}
    .split-heading{display:flex;justify-content:space-between;gap:30px;align-items:end}
    .section h2{font-size:clamp(43px,6vw,68px)}
    .section-intro{max-width:620px;color:var(--gray);font-size:17px}
    .week-badge{margin:0;padding:16px 21px;border-left:4px solid var(--gold);background:var(--cream-dark);font-size:13px;line-height:1.4}
    .week-badge strong{font-size:17px}
    /*
    .menu-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    margin-top: 44px;
    }
*/
    .menu-options .weekly-menu {
    min-width: 0;
    }

    .menu-options .dish-showcase.is-hidden {
    display: none;
    }

    .menu-options:has(.dish-showcase.is-hidden) {
    grid-template-columns: 1fr;
    }

    .weekly-menu{padding:32px;background:#fff;border-radius:12px;box-shadow:0 12px 35px #10251b10}
    .menu-days p{display:grid;grid-template-columns:54px 1fr;gap:10px;margin:0;padding:11px 0;border-bottom:1px solid #e8dece}
    .menu-days strong{color:var(--brown)}
    .fine-print{color:var(--gray);font-size:13px;margin:20px 0 0}
    .is-hidden{display:none}
    /* alemmat muutettiin geminin ohjeitten mukaan */
    .dish-showcase img{
        display:block;
        width:100%;
        max-height: 420px;
        aspect-ratio:4/5;
        object-fit:contain;
        margin-top:16px;
        border-radius:5px;
        background: var(--cream-dark);
    }
    .dish-showcase:hover {
        opacity: 0.95;
        box-shadow: 0 15px 40px #10251b18;
        transition: .2s;
    }
        /*Tähän asti*/
    /* caption tässä kohtaa tarkoittaa viikonpoiminnat ruokakuvan alle tulevasta tekstistä ruualle joka on tällä hetkellä keskellä */
    .dish-caption { text-align: center;}
    .dish-caption{margin:15px 0 0;color:var(--dark);font:700 22px Georgia,serif}
    .events-section{background:var(--dark);color:#fff}
    .events-section 
    .section-intro{color:#ffffffad}
    .event-list{margin-top:40px;border-top:1px solid #ffffff33}
    .event-row{width:100%;display:grid;grid-template-columns:90px 1fr auto;align-items:center;gap:20px;padding:20px 5px;border:0;border-bottom:1px solid #ffffff33;background:none;color:inherit;text-align:left;cursor:pointer}
    .event-row:hover{color:var(--gold)}
    .event-date{font:700 28px/.8 Georgia,serif;color:var(--gold);text-align:center}
    .event-date small{font:700 10px Arial,sans-serif;letter-spacing:2px}
    .event-name{font:700 clamp(20px,3vw,31px) Georgia,serif}
    .event-time{font-size:13px;font-weight:bold}
    .gallery-links{background:#fff}
    .category-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:44px}
    .category-card{height:280px;
        padding:28px;
        display:flex;
        flex-direction:column;
        justify-content:space-between;
        border-radius:12px;
        color:#fff;
        background:linear-gradient(135deg,#a46d48,#321b12);
        transition:.25s}
    .category-card:hover{transform:translateY(-5px)}
    .category-card span{color:var(--gold);font-weight:bold}
    .category-card strong{font:700 clamp(35px,5vw,54px)/1 Georgia,serif}
    /* Koko kaistan levyinen korttikuva */

    .full-width-dish-card{
        background: #fff;
        border-radius: 12px;
        padding: 36px 48px;
        box-shadow: 0 12px 35px #10251b10;
        margin: 44px auto 0 auto;

        width: 100%;
        max-width: 1100px; /* Pitää saman leveyden kuin muutkin kortit */
    }
    .full-width-dish-card .dish-card-header {
        margin-bottom: 20px;
    }
    .full-width-dish-card h3 {
        margin: 6px 0 0;
        color: var(--dark);
        font: 700 28px / 1.15 Georgia, serif;
    }  
    .full-width-dish-card .dish-image-container {
        width: 100%;
        background: var(--cream-dark);
        border-radius: 8px;
        overflow: hidden;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 20px;
    }
    /*Puhelimennäkymän muokkaus */
    @media (max-width: 700px) {
        .full-width-dish-card {
            padding: 24px 20px;
            margin-top: 30px;
        }
    }
    
    
    /* Koko kaistan levyinen korttipohja */
    .full-width-text-card{
        background:#fff;
        border-radius: 12px;
        padding: 32px 48px;
        box-shadow: 0 12px 35px #10251b10;
        margin: 44px auto 0 auto;

        width: 100%;
        max-width: 1100px;

        overflow-wrap: break-word;
        word-break: break-word;
    }
    .full-width-text-card h2 {
        margin: 10px 0 16px;
        color: var(--dark);
        font: 700 clamp(32px, 5vw, 48px) / 1.15 Georgia, serif;
        
    }
    .full-width-text-card .card-intro {
        margin: 0 0 16px;
        color: var(--dark);
        font-size: 18px;
        line-height: 1.6;
        font-weight: bold;
    }
    .full-width-text-card .card-body{
        margin: 0;
        color: var(--gray);
        font-size: 16px;
        line-height: 1.7;
    
    }
    /* Tämä sitten mukautuu pienemmille näytöille */
    @media (max-width: 700px){
        .full-width-text-card{
            padding: 28px;
            margin-top: 30px
        }
    }




    .cakes{background:linear-gradient(135deg,#66806a,#13281c)}
    .dessert{background:linear-gradient(135deg,#c59868,#70472d)}
    .kukko{background:linear-gradient(135deg,#a4774c,#412718)}
    .visit{text-align:center;color:#fff;background:linear-gradient(135deg,var(--green),var(--brown))}
    .visit h2{font-size:clamp(48px,7vw,76px)}
    .visit p{font-size:18px}
    .visit 
    .button{color:#18140e}footer{padding:32px 20px;background:#09140f;color:#ffffff88;text-align:center;font-size:12px}footer strong{display:block;color:#fff;font:700 21px Georgia,serif}
    /* Event dialogi tarkoittaa bannereiden näkyvyyttä tapatumissa */
    .event-dialog{
        position:relative;
        width:min(1200px, 95vw);
        max-height: 95vh;
        padding:22px;
        border:0;
        border-radius:12px;
        background:var(--cream);
        color:var(--dark);
        overflow: hidden;
    }
    .event-dialog::backdrop{background:#000b}
    .event-dialog img{
        display: block;
        width: 100%;
        height: auto;
        max-height: 80vh;
        object-fit: contain;
    }
        /* Tästä ylös */
    .event-dialog h2{margin:8px 0 0;font:700 36px Georgia,serif}
    .close-dialog{position:absolute;right:10px;top:10px;width:36px;height:36px;border:0;border-radius:50%;background:var(--dark);color:#fff;font-size:27px;line-height:1;cursor:pointer}
    .gallery-page{background:#fff}
    .gallery-hero{padding:150px 0 65px;color:#fff;background:linear-gradient(115deg,#081a11,#173a28 52%,#68482e)}
    .gallery-hero h1{margin:14px 0 0;font:700 clamp(50px,8vw,90px)/.95 Georgia,serif}
    .gallery-hero 
    .back{display:inline-block;margin-bottom:30px;color:var(--gold);font-size:14px;font-weight:bold}
    /* .photo-grid tarkoittaa kuvia jotka avautuvat galleriaan */
    .photo-grid{
        max-width: 900px;
        margin: 0 auto;
        columns:3 280px;
        column-gap:18px;
        padding:65px 0;
    }
    .photo-grid img{width:100%;display:block;margin-bottom:18px;break-inside:avoid;border-radius:6px;object-fit:cover;background:var(--cream-dark)}
    .gallery-note{padding:20px;background:var(--cream);color:var(--gray);font-size:14px}
    .gallery-note code{color:var(--brown)}@media(max-width:700px){.site-header{padding:16px 0}
    

    .main-nav{display:none;position:absolute;top:64px;right:20px;left:20px;padding:18px;background:var(--dark);flex-direction:column;align-items:stretch}.main-nav.is-open{display:flex}.menu-toggle{display:block;border:1px solid #ffffff88;border-radius:22px;padding:8px 14px;background:transparent;color:#fff;font-weight:bold}.split-heading,.menu-options{grid-template-columns:1fr;display:grid}.week-badge{justify-self:start}.category-grid{grid-template-columns:1fr}.event-row{grid-template-columns:64px 1fr}.event-time{display:none}.section{padding:75px 0}.hero{min-height:620px}.photo-grid{columns:2 160px;padding:35px 0}}