:root{--navy:#062f53;--navy2:#0a4f7c;--sea:#0b7bb7;--foam:#eef7fb;--ink:#12283a}
body{background:linear-gradient(180deg,#e9f5fb 0,#f4f8fa 22rem,#f6f8f8 100%)}
main.container{max-width:1180px}
.survey-page-shell{position:relative;margin-top:.5rem}
.survey-page-shell:before{content:"";position:fixed;inset:72px 0 auto;height:420px;z-index:-1;background:linear-gradient(rgba(10,69,107,.22),rgba(234,246,251,.86)),radial-gradient(circle at 20% 20%,#9fd1e6,transparent 40%),linear-gradient(130deg,#4fa4c8,#dff1f7)}
.survey-hero,.survey-card{background:rgba(255,255,255,.97);border:1px solid rgba(148,180,198,.42);box-shadow:0 18px 48px rgba(9,52,80,.12)}
.survey-hero{display:grid;grid-template-columns:230px 1fr;gap:2rem;align-items:center;border-radius:1.35rem 1.35rem .55rem .55rem;padding:2.3rem 3rem;margin-bottom:.25rem}
.survey-hero-art{display:grid;place-items:center;width:190px;height:190px;border-radius:50%;background:linear-gradient(180deg,#eef8fc,#d9eef7);border:10px solid #f6fbfd;box-shadow:inset 0 -18px 0 #b5dfef}
.lighthouse{font-size:5.5rem;filter:drop-shadow(0 8px 7px rgba(6,47,83,.16))}
.survey-time{display:inline-flex;gap:.4rem;align-items:center;padding:.4rem .72rem;border-radius:999px;background:#e7f2ff;color:#0a5d98;font-weight:700;font-size:.88rem}
.survey-hero h1{font-size:clamp(2rem,4vw,3.25rem);line-height:1.06;color:var(--ink);margin:.9rem 0}.survey-hero h1 span{color:#0877b9}.survey-hero-copy>p{font-size:1.08rem;color:#526979;max-width:760px}
.privacy-trust-card{display:flex;gap:1rem;background:linear-gradient(90deg,#edf7ff,#e7f2ff);border:1px solid #d0e7f7;border-radius:1rem;padding:1rem 1.15rem;margin-top:1.25rem}.privacy-trust-card p{margin:.25rem 0 0;color:#36586f}.privacy-icon{flex:0 0 2.4rem;width:2.4rem;height:2.4rem;border-radius:50%;display:grid;place-items:center;background:#0b79b5;color:white;font-weight:900}
.survey-card{border-radius:.55rem 1.35rem 1.35rem;padding:0;overflow:hidden}.survey-section{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:1.25rem;padding:2rem 2.25rem;border-bottom:1px solid #dce8ee}.survey-section:hover{background:#fbfdfe}.survey-step{width:2.65rem;height:2.65rem;border-radius:50%;background:linear-gradient(145deg,var(--navy),#0a679a);color:white;display:grid;place-items:center;font-weight:800;box-shadow:0 5px 14px rgba(6,47,83,.2)}
.section-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}.section-heading h2{font-size:1.45rem;color:var(--navy);font-weight:800;margin:0}.section-heading h2 small{font-weight:500;color:#748995;font-size:.75em}.section-heading p{margin:.35rem 0 0;color:#657d8b}.section-icon{font-size:1.45rem;color:#0878b6;font-weight:800}
.form-label{font-weight:650;color:#243e50}.form-control,.form-select,.input-group-text{border-color:#cfdde5;border-radius:.72rem}.form-control:focus,.form-select:focus{border-color:#4c9fca;box-shadow:0 0 0 .22rem rgba(11,123,183,.14)}.input-group>.form-control{border-radius:.72rem 0 0 .72rem}.input-group-text{background:#f4f8fa;color:#425c6d}
.survey-choice{display:flex;align-items:center;gap:.75rem;border:1px solid #d7e4ea;background:#f9fcfd;border-radius:.85rem;padding:1rem 1.05rem;cursor:pointer}.survey-choice:hover{border-color:#8cc5df;background:#f1f9fd}.survey-choice .form-check-input{width:1.25rem;height:1.25rem;margin:0;flex:0 0 auto}
.map-section{background:linear-gradient(90deg,#fbfdfe,#f2f9fc)}.map-layout{display:grid;grid-template-columns:minmax(220px,.62fr) minmax(350px,1.5fr);gap:1.2rem}.map-help{padding:.5rem 0}.map-help-item{display:flex;gap:.75rem;margin-bottom:1rem}.map-help-item>span{width:1.75rem;height:1.75rem;flex:0 0 1.75rem;border-radius:50%;display:grid;place-items:center;background:#0b79b5;color:white;font-weight:700}.map-help-item p{margin:0;color:#365568}.coordinate-status{border:1px solid #cde0e9;background:white;border-radius:.75rem;padding:.75rem;margin:1rem 0;color:#365568}#harbourMap{height:360px;border-radius:1rem;border:1px solid #bfd5df;box-shadow:0 8px 24px rgba(24,73,101,.1);z-index:1}
.prize-section{background:#fffaf0}.survey-submit{text-align:center;padding:2rem 2.25rem 2.4rem;background:#f7fafb}.survey-submit p{color:#667b88}.link-button{border:0;background:none;padding:0;color:#0877b9;text-decoration:underline}.submit-button{min-width:260px;border-radius:.85rem;background:linear-gradient(135deg,#063b63,#0879b8);border:0;font-weight:750;padding:.85rem 1.4rem;box-shadow:0 10px 20px rgba(6,59,99,.2)}.submit-button span{margin-left:.65rem}.privacy-accepted{display:inline-block;background:#e7f7ef;color:#176740;border:1px solid #bfe5cf;border-radius:.75rem;padding:.65rem .9rem;margin-bottom:.75rem}.privacy-modal-intro{background:#eef7fb;border:1px solid #cce3ef;border-radius:.9rem;padding:1rem}.modal-content{border:0;border-radius:1.1rem}.modal-kicker{font-size:.72rem;letter-spacing:.12em;color:#0877b9;font-weight:800}
@media(max-width:900px){.survey-hero{grid-template-columns:1fr}.survey-hero-art{display:none}.map-layout{grid-template-columns:1fr}}
@media(max-width:576px){main.container{padding-left:.7rem;padding-right:.7rem}.survey-hero{padding:1.35rem;border-radius:1rem .4rem .4rem}.survey-hero h1{font-size:2rem}.survey-section{grid-template-columns:1fr;padding:1.35rem 1rem;gap:.75rem}.survey-step{width:2.25rem;height:2.25rem}.section-heading h2{font-size:1.25rem}#harbourMap{height:320px}.survey-submit{padding:1.5rem 1rem}.submit-button{width:100%;min-width:0}.form-control-lg,.form-select-lg,.input-group-lg>.form-control,.input-group-lg>.input-group-text{font-size:1rem}}

/* Leaflet and mobile hardening */
.survey-page-shell,
.survey-card,
.survey-section,
.survey-section-body,
.map-layout,
#harbourMap {
    min-width: 0;
    max-width: 100%;
}

#harbourMap {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    isolation: isolate;
    touch-action: pan-x pan-y;
    background: #dbeaf0;
}

#harbourMap .leaflet-container,
.leaflet-container {
    width: 100%;
    max-width: 100%;
    font-family: inherit;
}

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas {
    position: absolute;
    left: 0;
    top: 0;
}

.leaflet-tile {
    max-width: none !important;
    max-height: none !important;
}

.leaflet-container img {
    max-width: none !important;
}

.leaflet-control-container {
    position: relative;
    z-index: 800;
}

@media (max-width: 767.98px) {
    body {
        overflow-x: hidden;
    }

    main.container {
        width: 100%;
        max-width: 100%;
        padding-left: .55rem;
        padding-right: .55rem;
    }

    .survey-page-shell {
        margin-top: 0;
    }

    .survey-card,
    .survey-hero {
        width: 100%;
        max-width: 100%;
    }

    .survey-section-body,
    .section-heading,
    .map-layout,
    .map-help,
    #harbourMap {
        width: 100%;
    }

    .section-heading {
        flex-wrap: wrap;
    }

    .map-layout {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    #harbourMap {
        height: min(62vh, 430px);
        min-height: 300px;
        border-radius: .85rem;
    }

    .leaflet-control-zoom a {
        width: 36px;
        height: 36px;
        line-height: 36px;
        font-size: 22px;
    }

    .leaflet-control-attribution {
        max-width: calc(100vw - 4rem);
        font-size: 10px;
        white-space: normal;
        text-align: right;
    }

    .form-control,
    .form-select,
    textarea {
        max-width: 100%;
    }

    input,
    select,
    textarea {
        font-size: 16px !important;
    }
}

@media (max-width: 390px) {
    #harbourMap {
        height: 330px;
        min-height: 280px;
    }

    .survey-section {
        padding-left: .8rem;
        padding-right: .8rem;
    }
}

/* Kartplassering er et underpunkt av steg 1, ikke et eget steg. */
.harbour-location-subsection{
    margin-top:1.5rem;
    padding:1.35rem;
    border:1px solid #cfe0e9;
    border-radius:1rem;
    background:linear-gradient(90deg,#fbfdfe,#f2f9fc);
}
.subsection-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:1rem;
    margin-bottom:1rem;
}
.subsection-kicker{
    display:inline-block;
    margin-bottom:.25rem;
    color:#0b79b5;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
}
.subsection-heading h3{
    margin:0;
    color:#143b5d;
    font-size:1.35rem;
}
.subsection-heading h3 small{
    color:#718694;
    font-size:.82rem;
    font-weight:600;
}
.subsection-heading p{
    margin:.35rem 0 0;
    color:#657f90;
}
@media(max-width:576px){
    .harbour-location-subsection{margin-top:1rem;padding:1rem .8rem}
    .subsection-heading h3{font-size:1.15rem}
}

.survey-map-legend{display:flex;flex-wrap:wrap;gap:.55rem 1rem;margin:.85rem 0 1rem;padding:.65rem .8rem;border:1px solid #d5e3ea;border-radius:.8rem;background:#fff}.survey-map-legend span{display:flex;align-items:center;gap:.4rem;font-size:.86rem;font-weight:700;color:#29455c}.survey-question-group{margin:1rem 0 1.35rem;padding:1rem;border:1px solid #d9e6ec;border-radius:.9rem;background:#f8fbfc}.survey-question-group h3{margin-bottom:.75rem}.survey-question-group small{font-weight:400;color:#6b8191}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.choice-grid .survey-choice{margin:0;height:100%}@media(max-width:700px){.choice-grid{grid-template-columns:1fr}.survey-map-legend{gap:.45rem .7rem}.survey-map-legend span{font-size:.78rem}}
