/*
Theme Name: Neoma
Theme URI: https://neoma.ch
Author: Neoma GmbH
Description: Theme für Neoma GmbH. Strategie, Foresight und digitale Medien. Startseite und Unterseiten, mit Hell und Dunkelmodus.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: Proprietary
Text Domain: neoma
*/

/* Layout: Markenfarben von neoma-hospitality.ch (Olivgrün, Gold, Sand). Olivgrüner Hero mit Radar, ruhige Listen statt Kartenwände. */
:root{
  --bg:#F4F2EC; --surface:#FFFFFF; --sand:#E9E5DE; --ink:#1D3A2F; --muted:#56655D; --line:#D9D4C9;
  --olive:#525A4D; --on-olive:#F4F2EC; --gold:#A39563; --gold-ink:#7C6F42; --accent-ink:#FFFFFF;
  --f-head:'Jost','Helvetica Neue',Arial,sans-serif;
  --f-body:'Jost','Helvetica Neue',Arial,sans-serif;
  --f-serif:'Newsreader',Georgia,'Times New Roman',serif;
  --f-mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#141A16; --surface:#1B231E; --sand:#1F2923; --ink:#ECE9E0; --muted:#A5B0A8; --line:#2C3830;
  --olive:#3E463A; --on-olive:#F4F2EC; --gold:#BDAE78; --gold-ink:#CDBE88; --accent-ink:#141A16; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#141A16; --surface:#1B231E; --sand:#1F2923; --ink:#ECE9E0; --muted:#A5B0A8; --line:#2C3830;
  --olive:#3E463A; --on-olive:#F4F2EC; --gold:#BDAE78; --gold-ink:#CDBE88; --accent-ink:#141A16; color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:18px;font-weight:400;line-height:1.65;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:10}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}
.wrap{max-width:1160px;margin:0 auto}
h1,h2,h3{font-family:var(--f-head);font-weight:400;line-height:1.1;letter-spacing:-.01em;text-wrap:balance;margin:0}
h1{font-size:clamp(2.5rem,6.2vw,4.6rem);font-weight:300}
h2{font-size:clamp(1.9rem,3.8vw,2.8rem);font-weight:300}
h3{font-size:1.3rem;font-weight:500}
p{margin:0}
.label{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink)}
.lead{font-size:1.2rem;color:var(--muted);max-width:58ch;font-weight:300}
.serif{font-family:var(--f-serif)}

/* Full bleed Bänder */
.band{box-shadow:0 0 0 100vmax var(--bgc);clip-path:inset(0 -100vmax);background:var(--bgc)}
.band.olive{--bgc:var(--olive);color:var(--on-olive)}
.band.sand{--bgc:var(--sand)}

/* Header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);box-shadow:0 0 0 100vmax var(--bg);clip-path:inset(0 -100vmax);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px 28px;padding-block:14px;flex-wrap:wrap}
.logo{font-family:var(--f-head);font-weight:500;font-size:1.45rem;letter-spacing:.32em;text-transform:uppercase;text-decoration:none;color:var(--ink)}
nav{display:flex;gap:4px 24px;flex-wrap:wrap;font-size:.98rem}
nav a{text-decoration:none;color:var(--muted);padding:4px 0}
nav a:hover{color:var(--ink)}
.btn{display:inline-block;background:var(--gold);color:#1B2118;padding:13px 28px;border-radius:2px;text-decoration:none;font:inherit;font-weight:500;letter-spacing:.04em;border:0;cursor:pointer}
.btn:hover{filter:brightness(1.07)}
.btn.line{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px currentColor}
.btn.small{padding:9px 20px;font-size:.92rem}

/* Hero */
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding-block:84px 80px}
.hero .label{color:var(--gold)}
.hero h1{margin-top:20px}
.hero h1 span{display:block;font-family:var(--f-serif);font-style:italic;font-weight:400;color:var(--gold)}
.hero .lead{color:color-mix(in srgb,var(--on-olive) 82%,transparent);margin-top:26px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.radar{width:100%;max-width:440px;justify-self:center}
.radar svg{width:100%;height:auto;display:block}
.radar .ring,.radar .axis{fill:none;stroke:color-mix(in srgb,var(--on-olive) 28%,transparent);stroke-width:1}
.radar .sweep{fill:var(--gold);opacity:.22;transform-origin:240px 240px;animation:spin 10s linear infinite}
.radar .dot{fill:var(--on-olive)}
.radar .hot{fill:var(--gold)}
.radar text{font-family:var(--f-mono);font-size:11.5px;fill:color-mix(in srgb,var(--on-olive) 78%,transparent);letter-spacing:.04em}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.radar .sweep{animation:none}html{scroll-behavior:auto}}

section{padding-block:84px}
.head{display:grid;gap:14px;margin-bottom:48px;max-width:780px}

/* Schwerpunkte als Liste */
.topics{border-top:1px solid var(--ink)}
.topic{display:grid;grid-template-columns:1fr 1.3fr;gap:12px 48px;padding:30px 0;border-bottom:1px solid var(--line);align-items:baseline}
.topic h3{font-size:1.5rem;font-weight:400}
.topic p{color:var(--muted)}
.topic .pill{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);display:block;margin-bottom:8px}

/* Digitale Medien */
.digital{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:4px;padding:30px 28px;display:flex;flex-direction:column;gap:14px;min-width:0}
.card p{color:var(--muted)}
.card ul{margin:auto 0 0;padding:16px 0 0;list-style:none;display:grid;gap:7px;border-top:1px solid var(--line);font-size:.98rem}
.card li{padding-left:20px;position:relative}
.card li::before{content:"";position:absolute;left:0;top:.8em;width:10px;height:1px;background:var(--gold-ink)}
.brands{margin-top:20px;padding:22px 28px;display:flex;gap:10px 36px;flex-wrap:wrap;align-items:baseline;background:var(--sand);border-radius:4px}
.brands span{flex:1 1 320px;color:var(--muted)}

.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.checks{margin-top:28px;border-top:1px solid var(--line)}
.checks div{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.checks span{color:var(--muted);text-align:right}
.report{background:var(--surface);border:1px solid var(--line);border-radius:4px;padding:28px;display:grid;gap:20px;min-width:0}
.report .hd{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.report .t{font-size:1.2rem;font-weight:500}
.ex{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;background:var(--sand);color:var(--gold-ink);padding:4px 10px;border-radius:999px}
.meter{display:grid;gap:7px}
.meter .row{display:flex;justify-content:space-between;gap:12px;font-size:.96rem}
.meter .row span:last-child{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.track{height:8px;background:var(--sand);border-radius:4px;overflow:hidden}
.fill{height:100%;background:var(--olive);border-radius:4px}
.fill.warn{background:var(--gold)}
.report small{color:var(--muted);font-size:.85rem}

/* Hospitality Zitat */
.quote{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.quote blockquote{margin:0;font-family:var(--f-serif);font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.25;font-weight:500}
.quote p{color:color-mix(in srgb,var(--on-olive) 80%,transparent);font-weight:300;font-size:1.1rem}
.quote p+p{margin-top:16px}

/* Vorgehen */
.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink)}
.step{padding:26px 24px 8px 0;display:grid;gap:10px;align-content:start;min-width:0}
.step+.step{padding-left:24px;border-left:1px solid var(--line)}
.step .n{font-family:var(--f-mono);font-size:.78rem;color:var(--gold-ink)}
.step p{color:var(--muted);font-size:1rem}

/* Kontakt */
.contact{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.facts{margin-top:30px;display:grid;gap:6px;font-size:1.05rem}
.facts b{font-weight:500}
form{display:grid;gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:4px;padding:28px}
.field{display:grid;gap:6px}
label{font-size:.88rem;font-weight:500}
input,select,textarea{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:2px;padding:11px 13px;width:100%;min-width:0}
textarea{min-height:110px;resize:vertical}
.ok{padding:14px 16px;border-radius:2px;background:var(--sand);font-size:.95rem}

footer{padding-block:34px 44px;display:flex;justify-content:space-between;gap:12px 32px;flex-wrap:wrap;color:var(--muted);font-size:.95rem}

@media (max-width:900px){
  .hero,.split,.contact,.quote{grid-template-columns:1fr;gap:36px}
  .hero{padding-block:48px 52px}
  .topic{grid-template-columns:1fr}
  .digital{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .step:nth-child(3){padding-left:0;border-left:0}
  .step:nth-child(n+3){border-top:1px solid var(--line);margin-top:20px;padding-top:26px}
  section{padding-block:56px}
}
@media (max-width:520px){
  body{font-size:17px}
  .steps{grid-template-columns:1fr}
  .step+.step{padding-left:0;border-left:0;border-top:1px solid var(--line)}
  .step:nth-child(n+3){margin-top:0}
  .logo{letter-spacing:.22em}
}

.tl{text-decoration:none}.tl:hover{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:5px}
.topic h3 a::after{content:" \2192";color:var(--gold-ink)}
.crumb{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.12em;text-transform:uppercase}
.crumb a{color:var(--gold);text-decoration:none}
.dhero{padding-block:72px 72px;display:grid;gap:22px;max-width:820px}
.dhero h1{font-size:clamp(2.3rem,5.4vw,4rem)}
.dhero .lead{color:color-mix(in srgb,var(--on-olive) 82%,transparent)}
.cols{display:grid;grid-template-columns:1.2fr .8fr;gap:64px;align-items:start}
.list{margin:0;padding:0;list-style:none;border-top:1px solid var(--ink)}
.list li{padding:18px 0 18px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:34px 1fr;gap:6px}
.list li::before{content:"";width:12px;height:1px;background:var(--gold-ink);margin-top:.85em}
.aside{background:var(--sand);padding:28px;border-radius:4px;display:grid;gap:14px}
.aside h3{font-size:1.2rem}
.aside ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;color:var(--muted)}
.aside li{padding-left:20px;position:relative}
.aside li::before{content:"";position:absolute;left:0;top:.85em;width:10px;height:1px;background:var(--gold-ink)}
.more{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 32px;border-top:1px solid var(--ink)}
.more a{padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none;display:block}
.more a:hover{color:var(--gold-ink)}
.more a.cur{color:var(--muted);pointer-events:none}
@media (max-width:900px){.cols{grid-template-columns:1fr;gap:36px}.dhero{padding-block:44px}}

.entry{max-width:760px}
.entry h2{font-size:1.5rem;margin:40px 0 14px;font-weight:400}
.entry ul{margin:0 0 8px;padding:0;list-style:none;border-top:1px solid var(--ink)}
.entry li{padding:14px 0 14px 34px;border-bottom:1px solid var(--line);position:relative}
.entry li::before{content:"";position:absolute;left:0;top:1.55em;width:12px;height:1px;background:var(--gold-ink)}
.entry p{color:var(--muted);margin:0 0 16px}
.screen-reader-text{position:absolute;left:-9999px}
.hp{position:absolute;left:-9999px;opacity:0}

nav ul{display:flex;flex-wrap:wrap;gap:4px 24px;list-style:none;margin:0;padding:0}nav li{display:block}