/* Homepage art direction. Shared navigation and footer remain in public-navigation.css. */
main { --muted:#627267; --line:#dce3d9; --paper:#f4f4ec; }
main .wrap { width:min(1120px,calc(100% - 48px)); }
main p { text-wrap:pretty; }
main .hero { grid-template-columns:1.12fr 1fr; gap:64px; min-height:0; padding:44px 0 58px; }
main .hero h1 { font-size:clamp(2.8rem,4.45vw,4.25rem); line-height:1.06; letter-spacing:-.055em; margin:18px 0 22px; }
main .hero h1 em { color:#56852f; }
main .eyebrow { font-size:.68rem; letter-spacing:.15em; }
main .lead { font-size:1.12rem; line-height:1.65; max-width:490px; }
main .trial-note { display:block; border:0; border-left:2px solid #87ac65; border-radius:0; padding:0 0 0 13px; background:none; font-size:.84rem; line-height:1.6; font-weight:600; color:#627267; margin-top:22px; max-width:440px; }
main .trial-note::before { display:none; }
main .trial-note a { text-decoration:underline; text-underline-offset:3px; }
main .actions { margin-top:24px; gap:10px; }
main .button { font-size:.9rem; padding:13px 20px; transition:background .18s,transform .18s; }
main .actions .button:first-child::after { content:'↗'; font-size:1.05rem; margin-left:8px; }
main .button:hover { transform:translateY(-1px); }
main .button.alt { border-color:#d6ded2; background:transparent; }
main .trust { align-items:flex-start; font-size:.79rem; max-width:390px; margin-top:23px; }
main .dot { flex-shrink:0; width:6px; height:6px; margin-top:7px; }
main .hero-art { display:block; min-height:0; background:#e9eddf; border:1px solid #dce2d0; border-radius:28px; padding:20px 24px 16px; isolation:isolate; }
main .hero-art::before { inset:0; border-radius:28px; z-index:-1; opacity:.45; background:repeating-radial-gradient(ellipse at 115% 105%,transparent 0 22px,#b7c4a5 23px 24px,transparent 25px 42px); }
.preview-label { display:flex; justify-content:space-between; gap:12px; font-size:.6rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#5c7052; margin:0 0 14px; }
.preview-label span:last-child { letter-spacing:0; font-weight:600; text-transform:none; }
main .hero-art [hidden] { display:none!important; }
main .chat { display:block; width:100%; max-width:360px; border:5px solid #253b32; border-radius:29px; overflow:hidden; padding:0; background:#e3e9d8; box-shadow:0 16px 30px #193b2520; font-family:Arial,sans-serif; }
.phone-status { display:flex; justify-content:space-between; background:#fff; padding:9px 19px 5px; font-size:10px; font-weight:700; }
main .chat-head { background:#fff; padding:8px 13px 10px; border:0; gap:10px; font-size:14px; line-height:1.3; }
.chat-back { font-size:27px; font-weight:400; color:#438ab6; margin-right:2px; }
main .avatar { width:35px; height:35px; background:linear-gradient(145deg,#426a3a,#043b2a); color:#c5e0a2; font-size:17px; font-style:italic; }
.chat-identity { flex:1; }.chat-identity small { display:block; font-size:11px; color:#78878e; font-weight:400; }
.chat-more { color:#77858c; font-size:22px; }
.chat-thread { padding:10px 12px 12px; min-height:285px; }
.chat-date { display:table; margin:0 auto 11px; color:white; background:#8fa18c; padding:3px 10px; border-radius:10px; font-size:10px; }
main .bubble { width:fit-content; max-width:91%; padding:9px 11px 6px; margin-top:9px; border-radius:12px; font-size:12px; line-height:1.45; box-shadow:0 1px 1px #23402212; }
main .from-user { background:#e4ffc7; color:#203229; border-bottom-right-radius:3px; }
main .from-ruralia { background:#fff; color:#203229; border-bottom-left-radius:3px; min-width:82%; }
.bubble time { display:block; text-align:right; font-size:9px; color:#71816d; margin-top:3px; line-height:1; }
.bubble b { font-weight:700; }.record-lines { display:block; margin:7px 0; }
.inline-keys { display:flex; gap:3px; margin-top:4px; max-width:91%; }
.inline-keys span { flex:1; background:#749277; color:#fff; text-align:center; padding:8px 3px; font-size:10px; border-radius:5px; }
.chat-compose { display:flex; align-items:center; gap:10px; background:#fff; color:#859399; padding:10px 13px; font-size:12px; }
.chat-compose span:nth-child(2) { flex:1; }.chat-compose .compose-menu { background:#4c95c2; color:white; border-radius:12px; font-size:9px; padding:3px 9px; }
.chat-keyboard { display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:7px; background:#e9edf0; }
.chat-keyboard span { text-align:center; font-size:10px; padding:6px 3px; border:1px solid #dbe0e4; border-radius:5px; background:#fff; }
.preview-tabs { display:flex; justify-content:center; gap:5px; margin:14px 0 0; }
.preview-tabs button { border:1px solid transparent; padding:7px 13px; border-radius:20px; background:transparent; color:#526449; font-size:.73rem; font-weight:700; }
.preview-tabs button[aria-pressed="true"] { color:#fff; background:#244a33; }
.preview-tabs button:hover { border-color:#7c9672; }
main :focus-visible { outline:3px solid #588c35; outline-offset:4px; }
main .section { padding:58px 0; }
main .section h2 { font-size:clamp(1.85rem,3vw,2.65rem); line-height:1.12; letter-spacing:-.045em; }
main .section-head { max-width:700px; margin-bottom:26px; }
main .section-head p:not(.eyebrow) { font-size:.99rem; line-height:1.65; margin-top:14px; }
main .tint { background:#f3f5ee; }
main .grid3 { gap:16px; }
main .card { border:1px solid var(--line); border-radius:17px; padding:24px; box-shadow:none; }
main .card h3 { font-size:1.12rem; line-height:1.25; margin:16px 0 10px; letter-spacing:-.02em; }
main .card p { font-size:.91rem; line-height:1.65; }
main .card-icon { background:#edf2e5; border-radius:10px; width:36px; height:36px; font-size:1.1rem; }
main .card-icon svg { width:21px; height:21px; }
main #how { padding-top:38px; border-top:1px solid #e2e7db; }
main #how .section-head { display:grid; grid-template-columns:1fr 1fr; max-width:none; column-gap:70px; align-items:end; }
main #how .section-head .eyebrow { grid-column:1/-1; }
main #how .section-head h2 { margin-top:10px; }
main #how .section-head>p:last-child { max-width:350px; margin-bottom:0; }
main #how .card { border:1px solid #dce3d4; background:#fff; }
.how-story { display:block; }
main #how .how-story .grid3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; min-width:0; }
main #how .card { display:block; min-width:0; padding:0; }
main #how .card-copy { padding:24px; }
main #how .card-icon { left:14px; top:14px; width:29px; height:29px; border:1px solid #dce3d4; border-radius:50%; background:#fefdfbf2; box-shadow:none; color:#365735; font-size:.66rem; letter-spacing:.04em; }
.step-art { position:relative; height:410px; min-height:0; background:#e8edde; padding:20px 18px 0; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; font-family:Arial,sans-serif; }
#how .card:nth-child(2) .step-art { background:#edece2; }#how .card:nth-child(3) .step-art { background:#e1e9df; }
.how-people { margin:0; position:absolute; inset:0; background:#dbe4d0; }
.how-people img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 35%; }
/* One continuous photograph behind each phone, without a second crop or fade. */
.step-art.step-context { height:410px; background:#e8edde; isolation:isolate; }
.step-context .how-people { z-index:0; }
.step-context .how-people img { height:100%; object-position:50% 35%; }
.step-context .step-phone { position:relative; z-index:1; box-shadow:0 8px 25px #14351e40; }
.step-send::after { content:''; position:absolute; inset:40% 0 0; background:linear-gradient(transparent,#17312670); pointer-events:none; }
.step-outgoing { position:relative; z-index:1; width:100%; padding-bottom:20px; }
.step-sender { display:block; margin-bottom:7px; font-size:10px; font-weight:700; color:#fff; text-shadow:0 1px 4px #173126; }
.step-message { max-width:260px; margin-left:auto; padding:13px 15px 8px; background:#e4ffc7; color:#203229; border-radius:13px 13px 3px 13px; font-size:13px; line-height:1.5; box-shadow:0 4px 15px #16351b24; }
.step-message small { display:block; text-align:right; color:#66845c; font-size:9px; }
.step-phone { display:flex; flex-direction:column; flex-shrink:0; width:248px; max-width:100%; height:300px; border:4px solid #294235; border-bottom:0; border-radius:24px 24px 0 0; overflow:hidden; background:#e3e9d8; box-shadow:0 8px 25px #2841281c; color:#203229; }
.step-phone-head { display:flex; align-items:center; gap:8px; padding:10px 12px; background:#fff; font-size:12px; line-height:1.3; }
.step-phone-head small { display:block; color:#77878e; font-size:9px; }
.step-avatar { display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:#16432d; color:#c5e0a2; font-size:14px; font-style:italic; }
.step-phone-more { margin-left:auto; color:#77878e; font-size:20px; }
.step-phone-body { flex:1; min-height:0; padding:10px; overflow:hidden; }
.step-incoming { padding:10px 11px 7px; background:#fff; border-radius:10px 10px 10px 3px; font-size:11px; line-height:1.4; }
.step-incoming>small { display:block; margin-bottom:8px; color:#6d7c70; font-size:9px; }
.step-incoming>b { display:block; color:#244a33; font-size:12px; }
.step-incoming p { margin:7px 0; font-size:11px; line-height:1.4; color:#3e5548; }
.step-incoming>strong { display:block; font-size:17px; color:#244a33; }
.step-incoming time { display:block; color:#7d8b7c; text-align:right; font-size:8px; }
.step-confirm { display:flex; gap:3px; margin-top:4px; font-size:10px; }
.step-confirm span { flex:1; padding:9px 3px; text-align:center; color:white; background:#6c8c72; border-radius:4px; }
.step-phone-input { display:flex; justify-content:space-between; padding:7px 11px; background:#fff; color:#7c8c8c; font-size:11px; line-height:1; }
.step-report { padding:10px; background:#fefdfb; border-top:3px solid #043b2a; border-radius:3px; }
.step-phone-report .step-phone-body { padding:8px; }
.step-report-heading { border-left:3px solid #6cb324; padding-left:7px; color:#244a33; }
.step-report-heading b { display:block; font-size:11px; line-height:1.2; }.step-report-heading>span { display:block; margin-top:3px; font-size:8px; line-height:1.3; color:#627267; }
.step-report-totals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin-top:9px; }
.step-report-totals>span { background:#edf2e6; padding:5px; font-size:7px; color:#375542; }.step-report-totals b { display:block; margin-top:3px; font-size:10px; }
.step-report-totals>span:last-child { background:#043b2a; color:white; }
.step-report-chart { display:block; width:100%; height:68px; margin-top:7px; }
.step-report-legend { display:flex; align-items:center; gap:8px; font-size:7px; color:#526b5f; line-height:1.4; }
.step-report-legend>span:last-child { margin-left:auto; }.step-report-legend i { display:inline-block; width:5px; height:5px; margin-right:3px; background:#6cb324; }.step-report-legend>span:nth-child(2) i { background:#043b2a; }
.step-report>small { display:block; margin-top:6px; padding-top:5px; border-top:1px solid #dce3d4; font-size:7px; line-height:1.2; color:#627267; }
.how-example-note { margin:13px 0 0; font-size:.72rem; color:#687c61; }
main #events>.wrap { display:grid; grid-template-columns:.85fr 1.15fr; gap:0 40px; }
main #events .section-head { grid-row:1/3; align-self:center; margin:0; }
main #events>.wrap>.card { background:#f0f3e8; border:0; padding:24px 28px; }
main #events>.wrap>.card p { font-size:1.16rem; color:#254b34; letter-spacing:-.02em; }
main #events .grid3 { gap:0; margin-top:0!important; }
main #events .grid3 .card { background:none; border:0; border-radius:0; padding:20px 12px; }
main #events .grid3 .card p { font-size:.79rem; }
main #events .grid3 .card h3 { font-size:.95rem; }
main #field-book { padding-top:25px; }
main #field-book .grid3 { display:block; border-top:1px solid var(--line); }
main #field-book .card { display:grid; grid-template-columns:36px 1fr 1.8fr; gap:24px; align-items:start; background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0; padding:28px 0; }
main #field-book .field-topic h3 { margin:5px 0 10px; font-size:1.25rem; letter-spacing:-.025em; }
main #field-book .field-topic p { margin:0; max-width:300px; color:var(--muted); font-size:.94rem; line-height:1.6; }
.field-examples { min-width:0; display:grid; gap:24px; }
.field-example { min-width:0; padding-right:8px; }
main #field-book .field-message { position:relative; margin:0 0 12px; padding:16px 18px 9px; border:1px solid #caddb7; border-radius:16px 16px 3px 16px; background:#e4ffc7; color:#203229; box-shadow:0 2px 4px #16351b0b; }
.field-message::after { content:''; position:absolute; right:-8px; bottom:-1px; width:9px; height:13px; background:#e4ffc7; border-bottom:1px solid #caddb7; clip-path:polygon(0 0,100% 100%,0 100%); }
main #field-book .field-message p { margin:0; color:inherit; font-size:.96rem; line-height:1.6; }
.field-message footer { display:flex; justify-content:flex-end; align-items:center; gap:5px; margin-top:5px; font-size:.64rem; color:#637b57; }
.field-message footer span { color:#548db2; letter-spacing:-.2em; padding-right:3px; }
main #field-book .field-explanation { margin:0; padding:0 10px; font-size:.83rem; line-height:1.6; color:var(--muted); }
main #weather .wrap { display:grid; grid-template-columns:1fr 1.35fr; gap:35px; align-items:center; }
main #weather .section-head { margin:0; }
main #weather .grid3 { display:block; }
main #weather .card { display:grid; grid-template-columns:36px 1fr; gap:0 16px; background:transparent; border:0; border-bottom:1px solid #dce3d4; border-radius:0; padding:18px 0; }
main #weather .card:last-child { border:0; }main #weather .card-icon { grid-row:1/3; }main #weather .card h3 { margin:0 0 5px; }
main .message { padding:32px 38px; gap:32px; border-radius:20px; background:#113e2c; }
main .message h2 { color:#fff; font-size:clamp(1.8rem,2.7vw,2.5rem); }
main .message p { font-size:.96rem; line-height:1.65; }
main .message .eyebrow { font-size:.65rem; }
main #telegram .ruralia-capabilities { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; list-style:none; margin:0; padding:0; }
main #telegram .ruralia-capability { min-width:0; display:grid; grid-template-columns:24px 1fr; align-content:start; gap:12px 10px; padding:22px; border:1px solid #ffffff24; border-radius:14px; background:#20513a; }
.ruralia-capability>svg { width:24px; height:24px; color:#bbdf8b; }
main #telegram .ruralia-capability h3 { align-self:center; margin:0; font-size:1.08rem; line-height:1.3; letter-spacing:-.02em; color:#fff; }
main #telegram .ruralia-capability p { grid-column:1/-1; margin:0; font-size:.88rem; line-height:1.6; color:#e0ecda; }
.capability-languages { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; }
.capability-languages span { display:inline-block; padding:5px 8px; border:1px solid #badf8b50; border-radius:6px; background:#113e2c; color:#e0f5c7; font-size:.76rem; font-weight:700; line-height:1.3; }
main #audiences { padding:0 0 42px; }
main #audiences .producer-access { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.audience-card { display:flex; flex-direction:column; min-width:0; padding:32px; border:1px solid #164b35; border-radius:20px; background:#113e2c; color:#fff; }
.audience-network { background:#20513a; border-color:#2c6247; }
.audience-heading { display:grid; grid-template-columns:88px minmax(0,1fr); align-items:center; gap:18px; }
.audience-avatar { position:relative; width:88px; height:88px; overflow:hidden; border-radius:50%; background:#fff; }
.audience-avatar img { position:absolute; width:418.4%; max-width:none; height:auto; left:-25.47%; top:-56.13%; }
.audience-network-icon { display:grid; place-items:center; width:88px; height:88px; border:1px solid #bde08d42; border-radius:50%; background:#113e2c; color:#bde08d; }
.audience-network-icon svg { width:58px; height:58px; }
main #audiences .audience-brand { margin:0 0 7px; font-size:.65rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#bddc9f; }
main #audiences .audience-card h2 { margin:0; color:#fff; font-size:clamp(1.6rem,2.6vw,2.15rem); line-height:1.12; }
main #audiences .audience-intro { margin:22px 0 -10px; color:#c2d6bd; font-size:.94rem; line-height:1.6; }
.audience-benefits { display:grid; gap:12px; list-style:none; padding:0; margin:26px 0; color:#e2eddb; font-size:.94rem; line-height:1.6; }
.audience-benefits li { position:relative; padding-left:23px; }
.audience-benefits li::before { content:'✓'; position:absolute; top:0; left:0; font-weight:700; color:#bde08d; }
.audience-action { margin-top:auto; padding-top:18px; border-top:1px solid #ffffff26; }
main #audiences .audience-note { margin:0 0 18px; color:#c2d6bd; font-size:.77rem; line-height:1.6; }
main #audiences .audience-card .button { align-self:flex-start; background:var(--lime); border-color:var(--lime); color:var(--deep); font-size:.88rem; text-align:center; }
main section:has(>.wrap>.message) { padding:28px 0; }
main #premium .card { background:#fefdfb; }
main #premium { padding-top:28px; }
main #adaptability .coverage-details { margin-top:18px; border:1px solid var(--line); border-radius:16px; background:var(--ivory); }
.coverage-details>summary { padding:18px 22px; color:#254b34; font-size:.94rem; font-weight:700; cursor:pointer; }
.coverage-details>summary::marker { color:#56852f; }
main #adaptability #coverage { padding:12px 24px 24px; border-radius:0 0 16px 16px; }
main #adaptability #coverage>.wrap { width:100%; }
main #adaptability #coverage h2 { font-size:clamp(1.5rem,2.2vw,2rem); }
.closing-actions { display:grid; justify-items:start; align-content:center; gap:12px; max-width:290px; }
main .closing-actions .closing-note { margin:0; color:#c2d6bd; font-size:.76rem; line-height:1.5; }
.closing-network-link { color:#d0e5b7; font-size:.82rem; line-height:1.5; text-decoration:underline; text-underline-offset:3px; }
main #coverage { background:var(--ivory); }
main #coverage .coverage-grid { gap:25px; align-items:stretch; }
main .coverage-map { display:flex; flex-direction:column; justify-content:center; box-shadow:none; background:#f3f5ee; border:0; padding:20px; border-radius:18px; }
main .coverage-map svg { background:transparent; }
main .coverage-copy { border:0; padding:5px 0; background:transparent; }
main .coverage-copy p,main .coverage-countries { font-size:.84rem; line-height:1.65; }
main #faq { background:#f3f5ee; }
main #faq>.wrap { display:grid; grid-template-columns:.7fr 1.3fr; gap:60px; }
main #faq .faq { display:block; }
main #faq .faq details { padding:0; border-radius:0; min-height:0; border-bottom:1px solid #d6dfd0; }
main #faq .faq summary { padding:20px 30px 20px 0; min-height:0; font-size:.94rem; }
main #faq .faq p { font-size:.9rem; padding:0 25px 20px 0; }
main #faq .faq details:not([open]) .collapse-content { display:none; }
@media(min-width:1400px){main .hero { gap:90px; }}
@media(max-width:1000px){main .hero{gap:30px;grid-template-columns:1fr 1fr}main .hero h1{font-size:3.3rem}main .hero-art{padding:18px 16px 14px}main #field-book .card{grid-template-columns:36px .9fr 1.4fr;gap:18px}main #events>.wrap{gap:0 24px}main #events .grid3{grid-template-columns:1fr}main #events .grid3 .card{display:grid;grid-template-columns:36px 1fr;gap:0 12px;padding:12px 0}main #events .grid3 .card-icon{grid-row:1/3}main #events .grid3 .card h3{margin:0 0 5px}main #events .section-head{grid-row:1/3}}
@media(max-width:760px){
 main .wrap{width:calc(100% - 40px)}main .hero{grid-template-columns:1fr;padding:30px 0 36px;gap:28px}main .hero h1{font-size:clamp(2.7rem,9vw,3.65rem);max-width:550px}main .lead{font-size:1.05rem}main .trial-note{max-width:100%}main .hero-art{padding:18px 22px 15px;max-width:450px;width:100%;margin:auto}main .hero-art::before{inset:0}main .chat{max-width:330px}
 main .section{padding:38px 0}main .section h2{font-size:2rem}main .section-head{margin-bottom:23px}main .grid3{grid-template-columns:1fr}main #how .section-head{display:block}main #how .section-head>p:last-child{max-width:none}.how-story{display:block}main #how .how-story .grid3{grid-template-columns:1fr;gap:16px}main #how .card{display:block}main #how .step-art{height:320px;min-height:0;padding:20px 22px 0}main #how .card-copy{padding:22px}main #how .card-icon{top:14px;left:14px}main #how .step-phone{width:250px}.how-people img{object-position:50% 35%}
 main #events>.wrap{display:block}main #events .section-head{margin-bottom:23px}main #events .grid3{grid-template-columns:1fr}main #events .grid3 .card{padding:15px 0;border-bottom:1px solid var(--line)}main #events .grid3 .card p{font-size:.9rem}
 main #field-book{padding-top:15px}main #field-book .card{grid-template-columns:36px 1fr;gap:12px 16px;padding:22px 0}main #field-book .field-topic h3{margin:5px 0 10px}main #field-book .field-topic p{max-width:none}main #field-book .field-examples{grid-column:1/-1;margin-top:5px}
 main #weather .wrap,main #faq>.wrap{display:block}main #weather .section-head{margin-bottom:14px}main #faq .section-head{margin-bottom:5px}main .coverage-grid{grid-template-columns:1fr}main .message{grid-template-columns:1fr;padding:28px;gap:12px}main .message .button{justify-self:start}main #premium .card{padding:22px}main .coverage-countries{gap:13px}.closing-actions{max-width:none;margin-top:10px}
}
@media(max-width:380px){main .hero-art{padding:15px 12px}main #how .card{display:block}main #how .step-art{height:310px;min-height:0}main #how .card-copy{padding:20px}.preview-tabs button{padding:7px 10px}}
@media(max-width:760px){main #how .step-art.step-context{height:410px}}
@media(max-width:760px){main #telegram .ruralia-capabilities{grid-template-columns:1fr;gap:10px}main #telegram .ruralia-capability{padding:20px}main #telegram .button{justify-self:start}main #audiences .producer-access{grid-template-columns:1fr;gap:16px}.audience-card{padding:26px}.audience-heading{grid-template-columns:72px minmax(0,1fr);gap:16px}.audience-avatar,.audience-network-icon{width:72px;height:72px}.audience-network-icon svg{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}main .button{transition:none}main .button:hover{transform:none}}