/*
Theme Name: Amino Modern
Theme URI: https://aminopeptides.org/
Description: A modern, research-first Astra child theme for Aminopeptides.org.
Author: Aminopeptides.org
Version: 1.0.0
Template: astra
Text Domain: amino-modern
*/

:root {
  --am-ink: #102126;
  --am-muted: #5f7074;
  --am-paper: #f8faf7;
  --am-white: #ffffff;
  --am-teal: #0b6b66;
  --am-teal-dark: #074b48;
  --am-mint: #c9f28e;
  --am-blue: #dceef7;
  --am-line: #dce5e0;
  --am-shadow: 0 18px 50px rgba(16,33,38,.09);
  --am-radius: 22px;
  --am-max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--am-ink); background: var(--am-paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.65; }
a { color: inherit; }
img { max-width: 100%; height: auto; }
.amino-wrap { width: min(calc(100% - 40px), var(--am-max)); margin-inline: auto; }
.amino-skip { position: fixed; z-index: 9999; left: 16px; top: -100px; padding: 12px 18px; background: var(--am-ink); color: white; border-radius: 10px; }
.amino-skip:focus { top: 16px; }

.amino-header { position: sticky; top: 0; z-index: 1000; border-bottom: 1px solid rgba(220,229,224,.8); background: rgba(248,250,247,.9); backdrop-filter: blur(16px); }
.admin-bar .amino-header { top: 32px; }
.amino-navrow { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.amino-brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; font-weight: 850; letter-spacing: -.03em; font-size: 1.18rem; }
.amino-mark { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; background: var(--am-ink); color: var(--am-mint); font-size: 1.08rem; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); }
.amino-menu { display: flex; align-items: center; gap: 28px; margin: 0; padding: 0; list-style: none; }
.amino-menu a { text-decoration: none; font-size: .92rem; font-weight: 700; color: #34474b; }
.amino-menu a:hover, .amino-menu a:focus { color: var(--am-teal); }
.amino-nav-cta, .amino-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 0 20px; border-radius: 999px; background: var(--am-ink); color: white !important; text-decoration: none; font-weight: 800; border: 1px solid var(--am-ink); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.amino-nav-cta:hover, .amino-button:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(16,33,38,.18); background: var(--am-teal-dark); }
.amino-button--light { background: white; color: var(--am-ink) !important; border-color: white; }
.amino-menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--am-line); border-radius: 12px; background: white; color: var(--am-ink); font-size: 1.25rem; }

.amino-hero { position: relative; overflow: hidden; padding: 92px 0 72px; background: radial-gradient(circle at 78% 20%, rgba(201,242,142,.28), transparent 26%), radial-gradient(circle at 88% 70%, rgba(220,238,247,.6), transparent 30%), var(--am-paper); }
.amino-hero::after { content: ""; position: absolute; width: 470px; height: 470px; right: -100px; top: 30px; opacity: .18; background-image: radial-gradient(circle, var(--am-teal) 2px, transparent 2px); background-size: 28px 28px; transform: rotate(-9deg); }
.amino-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 76px; }
.amino-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 20px; color: var(--am-teal-dark); font-size: .77rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.amino-kicker::before { content: ""; width: 28px; height: 2px; background: var(--am-teal); }
.amino-hero h1 { max-width: 790px; margin: 0; font-size: clamp(3rem, 6.4vw, 5.75rem); line-height: .98; letter-spacing: -.065em; font-weight: 880; }
.amino-hero h1 em { color: var(--am-teal); font-style: normal; }
.amino-hero-copy { max-width: 670px; margin: 26px 0 0; color: var(--am-muted); font-size: clamp(1.05rem, 1.5vw, 1.22rem); }
.amino-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.amino-text-link { display: inline-flex; min-height: 48px; align-items: center; padding: 0 12px; color: var(--am-teal-dark); font-weight: 850; text-decoration: none; }
.amino-visual { position: relative; min-height: 470px; }
.amino-orbit { position: absolute; inset: 0; border: 1px solid rgba(11,107,102,.22); border-radius: 50%; }
.amino-orbit::before, .amino-orbit::after { content: ""; position: absolute; border-radius: 50%; background: var(--am-teal); box-shadow: 0 0 0 10px rgba(11,107,102,.1); }
.amino-orbit::before { width: 18px; height: 18px; left: 8%; top: 25%; }
.amino-orbit::after { width: 12px; height: 12px; right: 12%; bottom: 24%; background: var(--am-mint); }
.amino-research-card { position: absolute; inset: 70px 20px 42px 52px; padding: 34px; border: 1px solid rgba(255,255,255,.7); border-radius: 34px; background: rgba(255,255,255,.78); backdrop-filter: blur(12px); box-shadow: var(--am-shadow); transform: rotate(2deg); }
.amino-research-card small { display: block; color: var(--am-teal); font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.amino-research-card h2 { margin: 52px 0 16px; max-width: 340px; font-size: 2rem; line-height: 1.08; letter-spacing: -.04em; }
.amino-mini-list { display: grid; gap: 11px; margin-top: 30px; }
.amino-mini-list span { display: flex; align-items: center; gap: 10px; color: var(--am-muted); font-weight: 650; }
.amino-mini-list span::before { content: "✓"; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #e9f6db; color: var(--am-teal-dark); font-size: .78rem; font-weight: 900; }

.amino-trust { border-block: 1px solid var(--am-line); background: var(--am-white); }
.amino-trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.amino-trust-item { padding: 25px 24px; border-right: 1px solid var(--am-line); }
.amino-trust-item:last-child { border: 0; }
.amino-trust-item strong { display: block; margin-bottom: 2px; font-size: .93rem; }
.amino-trust-item span { color: var(--am-muted); font-size: .8rem; }

.amino-section { padding: 96px 0; }
.amino-section--white { background: var(--am-white); }
.amino-section-head { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 42px; }
.amino-section-head h2 { margin: 4px 0 0; max-width: 720px; font-size: clamp(2.15rem, 4vw, 3.5rem); line-height: 1.05; letter-spacing: -.055em; }
.amino-section-head p { max-width: 450px; margin: 0; color: var(--am-muted); }
.amino-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.amino-topic { position: relative; min-height: 295px; padding: 30px; overflow: hidden; border: 1px solid var(--am-line); border-radius: var(--am-radius); background: white; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.amino-topic:hover { transform: translateY(-6px); box-shadow: var(--am-shadow); border-color: transparent; }
.amino-topic:nth-child(2) { background: var(--am-ink); color: white; }
.amino-topic:nth-child(2) p { color: #bdd0d3; }
.amino-topic:nth-child(3) { background: #edf5e7; }
.amino-topic-number { color: var(--am-teal); font-size: .78rem; font-weight: 900; letter-spacing: .12em; }
.amino-topic h3 { margin: 70px 0 12px; font-size: 1.7rem; letter-spacing: -.035em; }
.amino-topic p { margin: 0; color: var(--am-muted); font-size: .93rem; }
.amino-topic-arrow { position: absolute; top: 26px; right: 28px; font-size: 1.35rem; }

.amino-post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.amino-post { display: flex; flex-direction: column; min-height: 390px; overflow: hidden; border: 1px solid var(--am-line); border-radius: var(--am-radius); background: white; box-shadow: 0 8px 24px rgba(16,33,38,.04); }
.amino-post-media { min-height: 180px; background: linear-gradient(135deg, #0b6b66, #12363d); }
.amino-post-media img { display: block; width: 100%; height: 210px; object-fit: cover; }
.amino-post:nth-child(2) .amino-post-media { background: linear-gradient(135deg, #d9efb8, #b4d7dc); }
.amino-post:nth-child(3) .amino-post-media { background: linear-gradient(135deg, #1b2d35, #46646b); }
.amino-post-body { display: flex; flex: 1; flex-direction: column; padding: 25px; }
.amino-post-meta { color: var(--am-teal); font-size: .72rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.amino-post h3 { margin: 12px 0 9px; font-size: 1.35rem; line-height: 1.2; letter-spacing: -.03em; }
.amino-post h3 a { text-decoration: none; }
.amino-post-excerpt { margin: 0 0 18px; color: var(--am-muted); font-size: .91rem; }
.amino-post-read { margin-top: auto; color: var(--am-teal-dark); font-size: .88rem; font-weight: 850; text-decoration: none; }

.amino-toolbox { display: grid; grid-template-columns: 1fr .8fr; overflow: hidden; border-radius: 30px; background: var(--am-teal-dark); color: white; box-shadow: var(--am-shadow); }
.amino-toolbox-copy { padding: clamp(40px, 6vw, 76px); }
.amino-toolbox h2 { margin: 5px 0 18px; max-width: 620px; font-size: clamp(2.3rem, 4.5vw, 4.2rem); line-height: 1; letter-spacing: -.06em; }
.amino-toolbox p { max-width: 620px; color: #c7dddc; }
.amino-toolbox-graphic { display: grid; place-items: center; min-height: 420px; background: radial-gradient(circle, rgba(201,242,142,.28), transparent 50%); }
.amino-vial { width: 170px; height: 250px; padding-top: 58px; border: 8px solid rgba(255,255,255,.8); border-radius: 25px 25px 38px 38px; transform: rotate(8deg); box-shadow: 0 30px 60px rgba(0,0,0,.2); }
.amino-vial::before { content: "PEPTIDE"; display: grid; place-items: center; height: 92px; background: var(--am-mint); color: var(--am-ink); font-size: .8rem; font-weight: 950; letter-spacing: .16em; }

.amino-method { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; align-items: start; }
.amino-method h2 { position: sticky; top: 120px; margin: 0; font-size: clamp(2.2rem, 4vw, 3.6rem); line-height: 1.04; letter-spacing: -.055em; }
.amino-method-list { border-top: 1px solid var(--am-line); }
.amino-method-item { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 30px 0; border-bottom: 1px solid var(--am-line); }
.amino-method-item b { color: var(--am-teal); }
.amino-method-item h3 { margin: 0 0 6px; font-size: 1.2rem; }
.amino-method-item p { margin: 0; color: var(--am-muted); }

.amino-disclaimer { padding: 28px; border: 1px solid #e6ddbe; border-radius: 18px; background: #fffbed; color: #685d3a; font-size: .88rem; }
.amino-disclaimer strong { color: #4b4229; }
.amino-footer { padding: 64px 0 30px; background: var(--am-ink); color: #d8e2e3; }
.amino-footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 60px; }
.amino-footer h2 { margin: 0 0 15px; color: white; font-size: 1.3rem; }
.amino-footer p { max-width: 470px; color: #9fb2b5; }
.amino-footer h3 { margin: 0 0 16px; color: white; font-size: .86rem; letter-spacing: .09em; text-transform: uppercase; }
.amino-footer ul { margin: 0; padding: 0; list-style: none; }
.amino-footer li { margin-bottom: 9px; }
.amino-footer a { color: #cbd9db; text-decoration: none; }
.amino-footer a:hover { color: var(--am-mint); }
.amino-footer-bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 50px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.12); color: #7f969a; font-size: .78rem; }

.amino-archive-hero { padding: 74px 0 44px; }
.amino-archive-hero h1 { margin: 0; font-size: clamp(2.6rem, 5vw, 4.8rem); line-height: 1; letter-spacing: -.06em; }
.amino-archive { padding-bottom: 90px; }
.amino-content { width: min(calc(100% - 40px), 820px); margin: 0 auto; padding: 72px 0 96px; }
.amino-content h1 { margin: 0 0 28px; font-size: clamp(2.6rem, 5vw, 4.8rem); line-height: 1; letter-spacing: -.06em; }
.amino-content h2 { margin-top: 2.2em; font-size: clamp(1.7rem, 3vw, 2.5rem); letter-spacing: -.04em; }
.amino-content p, .amino-content li { color: #33484c; }
.amino-content a { color: var(--am-teal); }
.amino-content img { border-radius: 18px; }
.amino-byline { margin: -12px 0 40px; color: var(--am-muted); font-size: .88rem; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 900px) {
  .amino-menu-toggle { display: block; }
  .amino-menu { display: none; position: absolute; left: 20px; right: 20px; top: 70px; flex-direction: column; align-items: stretch; gap: 0; padding: 16px; border: 1px solid var(--am-line); border-radius: 18px; background: white; box-shadow: var(--am-shadow); }
  .amino-menu.is-open { display: flex; }
  .amino-menu li a { display: block; padding: 12px; }
  .amino-nav-cta { display: none; }
  .amino-hero { padding-top: 64px; }
  .amino-hero-grid, .amino-toolbox, .amino-method { grid-template-columns: 1fr; gap: 40px; }
  .amino-visual { min-height: 400px; }
  .amino-trust-grid { grid-template-columns: repeat(2, 1fr); }
  .amino-trust-item:nth-child(2) { border-right: 0; }
  .amino-grid-3, .amino-post-grid { grid-template-columns: 1fr 1fr; }
  .amino-method h2 { position: static; }
}

@media (max-width: 620px) {
  .admin-bar .amino-header { top: 46px; }
  .amino-wrap { width: min(calc(100% - 28px), var(--am-max)); }
  .amino-navrow { min-height: 68px; }
  .amino-hero { padding: 52px 0; }
  .amino-hero h1 { font-size: clamp(2.8rem, 15vw, 4.2rem); }
  .amino-visual { min-height: 350px; }
  .amino-research-card { inset: 38px 8px 25px 22px; padding: 26px; }
  .amino-research-card h2 { margin-top: 36px; font-size: 1.65rem; }
  .amino-trust-grid, .amino-grid-3, .amino-post-grid, .amino-footer-grid { grid-template-columns: 1fr; }
  .amino-trust-item { border-right: 0; border-bottom: 1px solid var(--am-line); }
  .amino-section { padding: 68px 0; }
  .amino-section-head { display: block; }
  .amino-section-head p { margin-top: 16px; }
  .amino-toolbox-graphic { min-height: 310px; }
  .amino-footer-bottom { display: block; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}
