/* Den offentlige side på srcatering.no (fra 24/9 2026): mørk hero som i forslag D,
   og en lys, enkel kontaktside. Alt andet fra D ligger på testsiden. */
:root{
  --ground:#0e100f;
  --ink:#f3f1ec;
  --muted:#a9aba4;
  --svag:#7e817b;
  --streg:rgba(243,241,236,.16);
  --serif:"Newsreader", Georgia, "Times New Roman", serif;
  --sans:Archivo, "Helvetica Neue", Arial, sans-serif;
  --spalte:1320px;
  --kant:clamp(20px, 5vw, 72px);
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--sans);font-weight:300;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media (prefers-reduced-motion: reduce){*{transition:none !important;animation:none !important}}
.baand{max-width:var(--spalte);margin:0 auto;padding-left:var(--kant);padding-right:var(--kant)}

/* ---------- hero, ordret fra forslag D ---------- */
.dhero{position:relative;min-height:88svh;display:flex;align-items:center;justify-content:center;
  text-align:center;overflow:hidden}
.dhero .lag{position:absolute;inset:0;z-index:0}
.dhero .lag img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;animation:dskift 32s infinite;will-change:opacity,transform}
.dhero .lag img:nth-child(1){animation-delay:0s}
.dhero .lag img:nth-child(2){animation-delay:8s}
.dhero .lag img:nth-child(3){animation-delay:16s}
.dhero .lag img:nth-child(4){animation-delay:24s}
@keyframes dskift{0%{opacity:0;transform:scale(1)}6%{opacity:1}25%{opacity:1}31%{opacity:0}100%{opacity:0;transform:scale(1.12)}}
.dhero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to bottom,rgba(14,16,15,.6),rgba(14,16,15,.42) 42%,rgba(14,16,15,.9))}
.dhero .indhold{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  gap:24px;padding:80px 0}
.dmerke{margin:0;font-family:var(--serif);font-weight:500;text-transform:uppercase;
  font-size:clamp(40px,8.5vw,96px);line-height:.96;letter-spacing:.14em;text-indent:.14em}
.dmerke img{height:clamp(90px,15vw,190px);width:auto;display:block;margin:0 auto}
.dsted{margin:0;font-size:clamp(11px,1.3vw,13px);letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.dslag{max-width:26ch;margin:4px auto 0;font-family:var(--serif);font-weight:400;
  font-size:clamp(19px,2.2vw,26px);line-height:1.45;color:var(--ink);text-wrap:balance}
.dknapper{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.knap-lenke{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:14px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);
  background:transparent;border:1px solid var(--streg);padding:0 30px;min-height:54px;
  transition:background .15s ease}
.knap-lenke:hover{background:rgba(243,241,236,.1);border-color:rgba(243,241,236,.45)}
@media (prefers-reduced-motion:reduce){.dhero .lag img{animation:none}.dhero .lag img:nth-child(1){opacity:1}}

/* ---------- bund ---------- */
.bund-p{padding:30px var(--kant) 40px;text-align:center;font-size:12.5px;letter-spacing:.06em;
  line-height:2;color:var(--svag)}
.bund-p a{color:var(--muted)}
.bund-p a:hover{color:var(--ink)}

/* skjult honningfelt mod robotter */
.hp{position:absolute !important;left:-10000px;width:1px;height:1px;overflow:hidden}

/* ================= kontaktsiden: lys, men med forsidens identitet =================
   Samme billede og logo som heroen i et smalt bånd øverst, Bodoni i overskrift og ingress,
   de små spatierede mærkater («OSLO», «FORESPØRSEL») og forsidens knap-form. */
body.lys{
  --papir:#f6f3ec;
  --blaek:#1d1f1e;
  --graa:#5d605b;
  --svag-l:#858882;
  --streg-l:#d6d0c3;
  --felt:#fffdf9;
  --guld:#86703f;
  background:var(--papir);color:var(--blaek);font-weight:300}
.lys .top-l{display:flex;justify-content:center;padding:34px var(--kant) 0}
.lys .top-l img{height:clamp(60px,9vw,76px);width:auto}
.lys main{max-width:560px;margin:0 auto;padding:clamp(28px,5vw,52px) 20px 32px}
.lys .mrk{margin:0 0 12px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--svag-l)}
.lys h1{margin:0 0 16px;font-family:var(--serif);font-weight:500;letter-spacing:-.005em;
  font-size:clamp(34px,6.4vw,50px);line-height:1.08;text-wrap:balance}
.lys .ingress{margin:0 0 34px;font-family:var(--serif);font-size:clamp(17px,1.9vw,20px);line-height:1.55;color:var(--graa);text-wrap:pretty}
.lys .ingress a,.lys .direkte a{color:var(--blaek);text-decoration:underline;text-decoration-color:var(--guld);text-underline-offset:4px}
.lys form{margin:0;display:flex;flex-direction:column;gap:22px}
.lys .felt{display:flex;flex-direction:column;gap:8px}
.lys label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;color:var(--graa)}
.lys input,.lys select{font-family:var(--sans);font-weight:300;font-size:17px;color:var(--blaek);background:var(--felt);
  border:1px solid var(--streg-l);border-radius:2px;padding:0 14px;min-height:54px;width:100%;
  appearance:none;-webkit-appearance:none}
.lys input[type=date]{display:block;line-height:52px}
.lys input::-webkit-date-and-time-value{text-align:left}
.lys select{padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235d605b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center}
.lys select:invalid{color:var(--svag-l)}
.lys input::placeholder,.lys textarea::placeholder{color:var(--svag-l)}
.lys input:focus,.lys select:focus,.lys textarea:focus{border-color:var(--blaek);outline:1px solid var(--blaek);outline-offset:0}
.lys textarea{font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.5;color:var(--blaek);background:var(--felt);
  border:1px solid var(--streg-l);border-radius:2px;padding:13px 14px;width:100%;display:block;
  min-height:118px;max-height:60vh;resize:vertical;field-sizing:content;overflow:auto;-webkit-appearance:none}
.lys label .valgfritt{font-weight:300;text-transform:none;letter-spacing:0;color:var(--svag-l);margin-left:6px}
/* knappen: forsidens form (uppercase, spatieret, skarpe hjørner), fyldt mørk for kontrastens skyld */
.lys button.knap{font-family:var(--sans);font-weight:400;font-size:13px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--papir);background:var(--blaek);border:1px solid var(--blaek);border-radius:0;
  min-height:56px;padding:0 30px;margin-top:4px;width:100%;cursor:pointer;transition:background .15s ease}
.lys button.knap:hover{background:#000}
.lys .smaat{margin:0;font-size:13.5px;line-height:1.6;color:var(--svag-l);text-wrap:pretty}
.lys .direkte{margin:48px 0 0;padding-top:32px;border-top:1px solid var(--streg-l);text-align:center}
.lys .direkte .mrk{margin-bottom:10px}
.lys .direkte-epost{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--blaek);text-decoration:none;
  border-bottom:1px solid var(--guld);padding-bottom:2px}
.lys .direkte-epost:hover{color:var(--guld)}
.lys .bund-p{color:var(--svag-l);border-top:1px solid var(--streg-l);margin-top:12px}
.lys .bund-p a{color:var(--graa)}
.lys .bund-p a:hover{color:var(--blaek)}