
:root{--bg:#03353b;--bg-alt:#063c43;--panel:#08474f;--panel2:#0a5058;--text:#f4fbfb;--muted:#c0d7d9;--line:#32727a;--accent:#8ee4e8;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:#fff;color:#000;padding:8px;z-index:9}.nav{position:sticky;top:0;z-index:5;background:rgba(3,53,59,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.navin{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;font-weight:750;letter-spacing:-.02em}.brand img{display:block;height:40px;width:auto}.links{display:flex;align-items:center;gap:22px}.links a{text-decoration:none;color:var(--muted);font-size:.93rem}.links a:hover{color:var(--text)}.langs{display:flex;border:1px solid var(--line);border-radius:999px;padding:3px}.langs a{padding:3px 9px;border-radius:999px}.langs a[aria-current=true]{background:var(--text);color:var(--bg)}.hero{padding:110px 0 90px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 80% 20%,#0a5963 0,transparent 38%),linear-gradient(135deg,#03353b 0%,#052d33 100%)}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;color:var(--accent);font-weight:800}.hero h1{font-size:clamp(3.4rem,9vw,7.8rem);line-height:.88;letter-spacing:-.065em;margin:.25em 0 .2em;max-width:980px}.hero .lead{font-size:clamp(1.25rem,2.6vw,2rem);line-height:1.3;max-width:850px;color:#e4f2f3;letter-spacing:-.02em}.hero .sub{max-width:760px;color:var(--muted);font-size:1.06rem;margin-top:25px}.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-block;text-decoration:none;border:1px solid var(--line);padding:10px 16px;border-radius:8px;font-weight:700}.btn.primary{background:var(--text);color:var(--bg);border-color:var(--text)}section{padding:82px 0;border-bottom:1px solid var(--line)}.sectionhead{display:grid;grid-template-columns:220px 1fr;gap:45px;margin-bottom:36px}.sectionhead h2{font-size:.82rem;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);margin:5px 0}.sectionhead p{font-size:clamp(1.55rem,3vw,2.35rem);line-height:1.25;letter-spacing:-.035em;margin:0;max-width:830px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px}.card h3{font-size:1.12rem;margin:0 0 8px}.card p{color:var(--muted);margin:0}.card .meta{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:10px}.timeline{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));margin-top:52px;border-top:1px solid var(--line)}.step{position:relative;padding:24px 16px 0 0;min-width:0}.step:before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px var(--section)}.year{position:absolute;left:0;bottom:calc(100% + 14px);font-size:.78rem;font-weight:800;letter-spacing:.08em;color:var(--accent)}.step-content{display:flex;flex-direction:column;gap:4px}.step strong{display:block;font-size:.98rem}.step span{display:block;color:var(--muted);font-size:.88rem;line-height:1.45}.tags{display:flex;flex-wrap:wrap;gap:10px}.tag{border:1px solid var(--line);background:var(--panel);padding:9px 13px;border-radius:999px;color:#e0eff0}.refs{font-size:.9rem;color:var(--muted)}.refs a{color:#d8f4f5}.contact{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:end}.contact h2{font-size:clamp(2.5rem,6vw,5rem);line-height:.95;letter-spacing:-.055em;margin:0}.contact p{color:var(--muted)}footer{padding:30px 0 50px;color:var(--muted);font-size:.88rem}.foot{display:flex;justify-content:space-between;gap:20px}.mobile-toggle{display:none;background:none;border:1px solid var(--line);color:var(--text);border-radius:7px;padding:7px 10px}@media(max-width:800px){.mobile-toggle{display:block}.links{display:none;position:absolute;top:68px;left:0;right:0;background:var(--bg);padding:20px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}.links.open{display:flex}.langs{margin-top:5px}.hero{padding:75px 0 65px}.hero h1{font-size:clamp(3.1rem,17vw,5.3rem)}section{padding:58px 0}.sectionhead{grid-template-columns:1fr;gap:8px}.grid{grid-template-columns:1fr}.timeline{grid-template-columns:1fr 1fr}.contact{grid-template-columns:1fr}.foot{flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Section rhythm, gallery and contact */
main>section:nth-of-type(even){background:var(--bg-alt)}
main>section:nth-of-type(odd){background:transparent}
.hero{background:radial-gradient(circle at 80% 20%,#0a5963 0,transparent 38%),linear-gradient(135deg,#03353b 0%,#052d33 100%)!important}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.gallery-card{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}.gallery-card a{text-decoration:none}.gallery-media{aspect-ratio:4/3;display:grid;place-items:end start;padding:20px;font-weight:800;font-size:1.25rem;background:linear-gradient(145deg,#084d55,#052f35);color:var(--text)}.gallery-card figcaption{padding:18px 20px;color:var(--muted);font-size:.93rem}.gallery-note{color:var(--muted);font-size:.85rem;margin-top:16px}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:flex;flex-direction:column;gap:7px}.field-wide{grid-column:1/-1}.field label{font-weight:700;font-size:.9rem}.field input,.field textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);padding:12px 13px;font:inherit}.field input:focus,.field textarea:focus{outline:2px solid var(--accent);outline-offset:2px}.form-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.contact-form button{cursor:pointer}.form-status{margin:0;color:var(--muted);font-size:.9rem}.foot a{color:var(--text);text-decoration:none}.foot a:hover{text-decoration:underline}@media(max-width:800px){.gallery{grid-template-columns:1fr}.contact-form{grid-template-columns:1fr}.timeline{grid-template-columns:1fr!important}.field-wide{grid-column:auto}}

/* Contact CTA and modal */
.contact-cta{display:flex;align-items:end;justify-content:space-between;gap:40px}.contact-cta h2{font-size:clamp(2.5rem,6vw,5rem);line-height:.95;letter-spacing:-.055em;margin:.12em 0 .25em}.contact-cta p{color:var(--muted);margin:0}.contact-cta .btn{cursor:pointer;flex:0 0 auto}.contact-modal{width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:16px;background:var(--bg-alt);color:var(--text);box-shadow:0 24px 80px rgba(0,0,0,.45)}.contact-modal::backdrop{background:rgba(0,18,21,.72);backdrop-filter:blur(5px)}.modal-shell{position:relative;padding:34px}.modal-shell h2{font-size:clamp(2rem,5vw,3.4rem);line-height:1;letter-spacing:-.045em;margin:.2em 0}.modal-intro{color:var(--muted);margin:0 0 26px}.modal-close{position:absolute;right:18px;top:14px;border:0;background:transparent;color:var(--muted);font:300 2rem/1 system-ui;cursor:pointer;padding:8px}.modal-close:hover,.modal-close:focus-visible{color:var(--text)}.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}.contact-form button:disabled{opacity:.6;cursor:wait}@media(max-width:800px){.contact-cta{align-items:flex-start;flex-direction:column}.contact-modal{width:calc(100% - 20px);max-height:calc(100dvh - 20px)}.modal-shell{padding:28px 20px}.contact-form{grid-template-columns:1fr}}

@media(max-width:800px){.timeline{grid-template-columns:1fr 1fr;margin-top:52px;row-gap:48px}.step{padding-right:22px}}
@media(max-width:520px){.timeline{grid-template-columns:1fr!important;row-gap:46px}.step{padding-right:0}}


/* Timeline alignment update
   Desktop: year above node; below it, aligned rows for place, function, institution.
   Mobile: vertical timeline with natural-height content for readability. */
.timeline {
  display: grid;
  grid-template-columns: repeat(8, minmax(120px, 1fr));
  overflow-x: auto;
  padding: 6px 0 12px;
}

.step {
  position: relative;
  display: grid;
  grid-template-rows: auto 20px auto;
  min-width: 120px;
  padding: 0 18px 0 0;
}

.year {
  min-height: 34px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.timeline-node {
  position: relative;
  height: 20px;
  border-top: 1px solid var(--line);
}

.timeline-node::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--accent);
}

.timeline-info {
  display: grid;
  grid-template-rows: 2.15em 2.15em 2.25em;
  padding-right: 8px;
}

.timeline-place,
.timeline-function,
.timeline-institution {
  display: block;
  line-height: 1.3;
}

.timeline-place {
  padding-top: 2px;
  font-size: 1rem;
}

.timeline-function {
  color: var(--muted);
  font-size: 0.9rem;
}

.timeline-institution {
  align-self: start;
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 800;
}


.timeline-function,
.timeline-institution {
  margin: 0;
  padding: 0;
}

.timeline-institution {
  margin-top: 0;
}

@media (max-width: 800px) {
  .timeline {
    grid-template-columns: 1fr !important;
    gap: 0;
    overflow-x: visible;
    padding: 0;
  }

  .step {
    grid-template-columns: 64px 22px 1fr;
    grid-template-rows: auto;
    min-width: 0;
    padding: 0 0 26px;
  }

  .year {
    min-height: 0;
    padding-top: 1px;
  }

  .timeline-node {
    width: 22px;
    height: 100%;
    min-height: 96px;
    border-top: 0;
    border-left: 1px solid var(--line);
  }

  .timeline-node::before {
    top: 5px;
    left: -5px;
  }

  .timeline-info {
    grid-template-rows: auto;
    gap: 3px;
    padding: 0 0 0 10px;
  }
}

/* Final timeline layout fix: overrides legacy timeline rules without affecting other components. */
.timeline {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0;
  margin-top: 52px;
  padding: 0;
  overflow: visible;
  border-top: 1px solid var(--line);
}

.step {
  position: relative;
  display: block;
  min-width: 0;
  padding: 24px 14px 0 0;
}

.step::before {
  content: none;
}

.year {
  position: absolute;
  left: 0;
  bottom: calc(100% + 14px);
  min-height: 0;
  color: var(--accent);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  font-variant-numeric: tabular-nums;
}

.timeline-node {
  position: absolute;
  top: -5px;
  left: 0;
  width: 9px;
  height: 9px;
  border: 0;
  border-radius: 50%;
  background: var(--accent);
}

.timeline-node::before {
  content: none;
}

.timeline-info {
  display: grid;
  grid-template-rows: 3.2em 4.5em 3.2em;
  gap: 0;
  padding: 0 8px 0 0;
}

.timeline-place,
.timeline-function,
.timeline-institution {
  display: block;
  min-width: 0;
  line-height: 1.45;
}

.timeline-place {
  font-size: .98rem;
}

.timeline-function {
  color: var(--muted);
  font-size: .88rem;
}

.timeline-institution {
  color: var(--text);
  font-size: .88rem;
  font-weight: 800;
}

@media (max-width: 800px) {
  .timeline {
    grid-template-columns: 1fr !important;
    gap: 0;
    margin-top: 24px;
    padding: 0;
    overflow: visible;
    border-top: 0;
  }

  .step {
    display: grid;
    grid-template-columns: 58px 18px minmax(0, 1fr);
    align-items: start;
    padding: 0 0 28px;
  }

  .year {
    position: static;
    grid-column: 1;
    grid-row: 1;
    padding-top: 0;
    font-size: .78rem;
  }

  .timeline-node {
    position: relative;
    top: 5px;
    left: 0;
    grid-column: 2;
    grid-row: 1;
    width: 9px;
    height: 9px;
  }

  .timeline-node::after {
    content: "";
    position: absolute;
    top: 9px;
    left: 4px;
    width: 1px;
    height: calc(100% + 78px);
    background: var(--line);
  }

  .step:last-child .timeline-node::after {
    content: none;
  }

  .timeline-info {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 0;
  }

  .timeline-place,
  .timeline-function,
  .timeline-institution {
    min-height: 0;
  }
}


/* Timeline desktop alignment — robust version.
   Places and functions share two-line rows and are bottom-aligned.
   This keeps institutions on one aligned final row without a visible gap beneath
   one-line functions. No subgrid is used. */
@media (min-width: 801px) {
  .timeline {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    overflow: visible;
    padding: 6px 0 12px;
  }

  .step {
    position: relative;
    display: grid;
    grid-template-rows: 34px 20px 2.6em 2.6em auto;
    min-width: 0;
    padding: 0 18px 0 0;
  }

  .year {
    position: static;
    display: block;
    min-height: 0;
    padding: 0;
    align-self: start;
  }

  .timeline-node {
    position: relative;
    height: 20px;
    border-top: 1px solid var(--line);
  }

  .timeline-node::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--accent);
  }

  .timeline-info {
    display: contents;
  }

  .timeline-place,
  .timeline-function,
  .timeline-institution {
    display: block;
    min-height: 0;
    margin: 0;
    padding: 0;
    line-height: 1.3;
  }

  .timeline-place {
    align-self: end;
    padding-bottom: 4px;
    font-size: 1rem;
  }

  .timeline-function {
    align-self: end;
    padding-bottom: 4px;
    color: var(--muted);
    font-size: 0.9rem;
  }

  .timeline-institution {
    align-self: start;
    color: var(--text);
    font-size: 0.9rem;
    font-weight: 800;
  }
}


/* Remove legacy timeline marker; the current marker belongs to .timeline-node. */
.timeline .step::before {
  content: none !important;
  display: none !important;
}

@media (min-width: 801px) {
  .timeline-node {
    position: relative;
    height: 20px;
    border-top: 1px solid var(--line);
  }

  .timeline-node::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--accent);
    transform: none;
  }
}


/* Canonical desktop timeline marker reset.
   Explicitly clears properties left by older timeline implementations. */
@media (min-width: 801px) {
  .timeline {
    border-top: 0 !important;
  }

  .timeline .step::before {
    content: none !important;
    display: none !important;
  }

  .timeline-node {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    height: 20px !important;
    min-height: 0 !important;
    border: 0 !important;
    border-top: 1px solid var(--line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .timeline-node::before {
    content: "" !important;
    position: absolute !important;
    top: -5px !important;
    left: 0 !important;
    width: 9px !important;
    height: 9px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--accent) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .timeline-node::after {
    content: none !important;
    display: none !important;
  }
}


/* Continuous desktop timeline.
   One line spans the whole timeline; individual milestones contribute only dots. */
@media (min-width: 801px) {
  .timeline {
    position: relative;
  }

  .timeline::before {
    content: "";
    position: absolute;
    top: 40px; /* 34px year row + node line position */
    left: 0;
    right: 0;
    height: 1px;
    background: var(--line);
    pointer-events: none;
  }

  .timeline-node {
    position: relative !important;
    z-index: 1;
    width: auto !important;
    height: 20px !important;
    border: 0 !important;
    background: transparent !important;
  }

  .timeline-node::before {
    content: "" !important;
    position: absolute !important;
    top: -5px !important;
    left: 0 !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: var(--accent) !important;
  }
}


/* Timeline text alignment: top-align place and function within their shared rows. */
@media (min-width: 801px) {
  .timeline-place {
    align-self: start !important;
    padding-top: 0 !important;
    padding-bottom: 4px !important;
  }

  .timeline-function {
    align-self: start !important;
    padding-top: 0 !important;
    padding-bottom: 4px !important;
  }

  .timeline-institution {
    align-self: start !important;
  }
}


/* Mobile timeline stacking: keep the connector line behind dots, years and text. */
@media (max-width: 800px) {

  .step {
    position: relative;
    isolation: isolate;
  }

  /* Keep the long turquoise pill exactly as it is */
  .timeline-node {
    position: relative;
    z-index: 2;
  }

  /* Stop drawing the connector as part of the pill */
  .timeline-node::after {
    content: none !important;
    display: none !important;
  }

  /* Draw the connector independently behind the pill */
  .step::after {
    content: "";
    position: absolute;

    /* 58px year column + centre of the 9px pill */
    left: 62px;

    top: 5px;
    bottom: -5px;

    width: 1px;
    background: var(--line);

    z-index: 0;
    pointer-events: none;
  }

  /* No connector after the final milestone */
  .step:last-child::after {
    content: none;
  }

  .year,
  .timeline-info {
    position: relative;
    z-index: 2;
  }
}

/* Mobile timeline: newest first, with safe spacing after the About text.
   Desktop remains unchanged. */
@media (max-width: 800px) {
  #about .timeline {
    display: flex !important;
    flex-direction: column-reverse;
    margin-top: 36px;
  }

  /* In reversed visual order, 2020 is first and 2001 is last.
     Draw connectors after every item except the visually final (2001) item. */
  #about .timeline .step:last-child::after {
    content: "" !important;
    display: block !important;
  }

  #about .timeline .step:first-child::after {
    content: none !important;
    display: none !important;
  }

  /* Keep years in normal flow so they cannot overlap the biography above. */
  #about .timeline .year {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
  }
}

/* Mobile timeline milestone dots: circular, matching the desktop markers. */
@media (max-width: 800px) {
  #about .timeline .timeline-node {
    width: 9px !important;
    height: 9px !important;
    min-height: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--accent) !important;
  }
}

/* Timeline present-day endpoint: label only, no milestone dot or content. */
@media (min-width: 801px) {
  #about .timeline {
    grid-template-columns: repeat(8, minmax(0, 1fr)) auto;
  }

  #about .timeline-now {
    position: relative;
    z-index: 2;
    align-self: start;
    margin-left: -2.3em;
    padding: 0;
    min-height: 34px;
    color: var(--accent);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .08em;
    font-variant-numeric: tabular-nums;
    line-height: inherit;
    white-space: nowrap;
  }
}

/* Mobile NOW endpoint: same rhythm as the next timeline step, but without a dot.
   The connector runs from the NOW level down to the 2020 milestone. */
@media (max-width: 800px) {
  #about .timeline .timeline-now {
    order: 1;
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 74px;
    margin: 0;
    padding: 0 0 28px;
    color: var(--accent);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .08em;
    font-variant-numeric: tabular-nums;
    line-height: inherit;
    white-space: nowrap;
  }

  #about .timeline .timeline-now::after {
    content: "";
    position: absolute;
    left: 62px;
    top: 5px;
    bottom: -5px;
    width: 1px;
    background: var(--line);
    z-index: 0;
    pointer-events: none;
  }
}

/* Mobile timeline compact interval layout:
   reuse the existing step height; place each entry in the segment above its node.
   Desktop is intentionally untouched. */
@media (max-width: 800px) {
  #about .timeline .step {
    position: relative;
    display: grid;
    grid-template-columns: 58px 18px minmax(0, 1fr);
    grid-template-rows: auto;
    min-height: 0;
    height: auto;
    padding: 0 0 28px;
    align-items: start;
  }

  #about .timeline .year {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    padding: 0 !important;
  }

  #about .timeline .timeline-node {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    top: 5px !important;
  }

  #about .timeline .timeline-info {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    padding: 0 0 0 10px;
    transform: translateY(calc(-100% - 4px));
  }

  #about .timeline .step::after {
    left: 62px;
    top: 5px;
    bottom: -5px;
  }

  /* NOW stays one compact step above 2020; no dot or content. */
  #about .timeline .timeline-now {
    order: 1;
    width: 100%;
    min-height: 74px;
    height: 74px;
    margin: 0;
    padding: 0;
  }

  #about .timeline .timeline-now::after {
    left: 62px;
    top: 5px;
    bottom: -5px;
  }
}

/* Personal site refinements: alternating visible sections, navigation and footer */
/* The hidden gallery occupies a section position, so explicitly correct Contact. */
main > #contact { background: var(--bg); }
/* Distinguish navigation and footer from the main section backgrounds. */
.nav { background: rgba(4, 44, 51, .96); }
footer { background: #052e35; padding: 14px 0 18px; }
.foot { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 16px; }
.footer-credit { justify-self: center; font-size: .75rem; color: var(--muted); }
.foot > a { justify-self: end; }
@media (max-width: 800px) {
  .links { background: #042c33; }
  .foot { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
  .footer-credit { grid-column: 1; grid-row: 2; justify-self: start; }
  .foot > a { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}

/* Button differentiation and interactive feedback */
.btn {
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.btn:not(.primary):not(.cv-download) { background: rgba(255,255,255,.035); }
.btn.cv-download { background: #17636a; border-color: #69a9ad; color: #f4fbfb; }
.btn.primary:hover:not(:disabled) { background: #b9f0ef; border-color: #b9f0ef; color: #03353b; }
.btn.cv-download:hover:not(:disabled) { background: #319098; border-color: #9ce5e5; color: #fff; }
.btn:not(.primary):not(.cv-download):hover:not(:disabled) { background: #145c65; border-color: #8ee4e8; color: #fff; }
.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .btn { transition: none; } }

/* Contact message: vertical resizing on desktop only. */
.contact-form textarea { resize: none; }
@media (min-width: 801px) and (pointer: fine) {
  .contact-form textarea { resize: vertical; }
}

/* Remove powered by from mobile */
@media (max-width: 800px) {
    .footer-credit {
        display: none;
    }
}