@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Devanagari:wght@400;500;600;700;800&display=swap');

:root{
    --green:#17633a;
    --green-dark:#0d4b2a;
    --green-soft:#2f7c52;
    --sea:#c7e4d5;
    --sea-light:#e4f3eb;
    --sea-deep:#b4d8c4;
    --gold:#c89b35;
    --text:#26372d;
    --muted:#68786e;
    --border:#c6ded0;
    --white:#fff;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%}
body{
    background:#b8d8c5;
    color:var(--text);
    font-family:"Noto Sans Devanagari",Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
}
a{-webkit-tap-highlight-color:transparent}
img{max-width:100%}

.phone-app{
    width:100%;
    max-width:480px;
    min-height:100vh;
    margin:0 auto;
    position:relative;
    overflow:hidden;
    background:#fff;
    padding-bottom:66px;
    box-shadow:0 0 42px rgba(18,65,39,.18);
}

/* subtle agricultural background texture without external images */
.phone-app:not(.welcome-app)::before{
    content:"";
    position:absolute;
    inset:95px 0 0;
    pointer-events:none;
    opacity:.55;
    background:
      radial-gradient(ellipse 80px 150px at 7% 18%,rgba(255,255,255,.34),transparent 70%),
      radial-gradient(ellipse 90px 160px at 96% 45%,rgba(255,255,255,.28),transparent 70%),
      radial-gradient(circle at 18% 70%,rgba(39,119,77,.07),transparent 18%),
      radial-gradient(circle at 84% 82%,rgba(39,119,77,.06),transparent 18%);
}
.gov-strip,.gov-header,.page-banner,.section-heading,.crop-grid,.article-page,.app-footer,.bottom-nav{position:relative;z-index:2}

.gov-strip{
    height:27px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 12px;
    background:#edf6f1;
    border-bottom:1px solid #c6ddd0;
    color:#52675b;
    font-size:8px;
}
.gov-strip-left,.gov-strip-right{display:flex;align-items:center;gap:6px}
.gov-dot{width:6px;height:6px;border-radius:50%;background:var(--gold)}

.gov-header{
    min-height:70px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:9px 12px;
    background:rgba(255,255,255,.98);
    border-bottom:1px solid #c9ded2;
}
.gov-emblem {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gov-emblem img {
    width: 42px;
    height: 42px;
    object-fit: contain;
    display: block;
}
.gov-brand{flex:1;min-width:0}
.gov-brand strong{display:block;color:#143f28;font-size:14px;font-weight:800;line-height:1.35}
.gov-brand small{display:block;margin-top:2px;color:#718078;font-size:8.5px;line-height:1.4}
.gov-actions{display:flex;gap:5px}
.header-action{
    width:33px;height:33px;
    display:flex;align-items:center;justify-content:center;
    background:#edf7f1;
    border:1px solid #c4ddce;
    border-radius:8px;
    color:var(--green);
    text-decoration:none;
    font-size:15px;
}

/* Welcome: richer but still professional */
.welcome-app{
    background:
      radial-gradient(ellipse 210px 130px at 100% 4%,rgba(56,137,91,.24),transparent 72%),
      radial-gradient(ellipse 190px 150px at -5% 92%,rgba(62,143,96,.20),transparent 72%),
      radial-gradient(circle at 78% 76%,rgba(200,155,53,.055),transparent 22%),
      linear-gradient(145deg,#dff1e7 0%,#c9e6d7 46%,#b9dcc8 100%);
}
.welcome-app::before{
    content:"";
    position:absolute;
    width:300px;height:300px;
    right:-185px;top:120px;
    border-radius:50%;
    border:55px solid rgba(255,255,255,.13);
    box-shadow:0 0 0 1px rgba(23,99,58,.03);
}
.welcome-app::after{
    content:"";
    position:absolute;
    width:190px;height:190px;
    left:-135px;bottom:90px;
    border-radius:50%;
    border:38px solid rgba(255,255,255,.10);
}
.welcome-main{
    min-height:calc(100vh - 27px);
    display:flex;align-items:center;justify-content:center;
    padding:28px 18px 45px;
    position:relative;z-index:2;
}
.gov-welcome-card{
    width:100%;
    padding:33px 20px 29px;
    background:rgba(255,255,255,.965);
    border:1px solid rgba(178,210,192,.95);
    border-radius:22px;
    text-align:center;
    position:relative;
    overflow:hidden;
    box-shadow:0 22px 52px rgba(20,77,47,.18),0 5px 15px rgba(20,77,47,.08);
}
.gov-welcome-card::before{
    content:"";
    position:absolute;left:0;right:0;top:0;height:4px;
    background:linear-gradient(90deg,#145a34,#4b9b70,#c89b35);
}
.gov-welcome-card::after{
    content:"";
    position:absolute;width:220px;height:220px;
    right:-145px;bottom:-140px;border-radius:50%;
    border:32px solid rgba(23,99,58,.055);
}
.hero-symbol {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.hero-symbol img {
    width: 110px;
    height: 110px;
    object-fit: contain;
    display: block;
}
.hero-symbol span{font-size:50px}
.welcome-kicker{color:#17633a;font-size:9px;font-weight:800;letter-spacing:1.3px;line-height:1.5}
.welcome-main h1{margin:7px 0 10px;color:#173f28;font-size:26px;line-height:1.45;font-weight:800}
.welcome-main p{max-width:335px;margin:0 auto 25px;color:#607168;font-size:12.5px;line-height:1.85}
.primary-button{
    min-width:198px;display:flex;align-items:center;justify-content:center;gap:17px;
    margin:0 auto;padding:14px 22px;color:#fff;
    background:linear-gradient(135deg,#155d36,#2d8154);
    border-radius:11px;text-decoration:none;font-size:14px;font-weight:700;
    box-shadow:0 11px 24px rgba(23,99,58,.24);
}
.primary-button span{font-size:20px}

/* Home banner */
.page-banner{
    padding:16px 16px 19px;color:#fff;
    background:
      radial-gradient(circle at 100% 0,rgba(255,255,255,.12),transparent 28%),
      linear-gradient(135deg,#125732,#2b7b4e);
    overflow:hidden;
}
.page-banner::after{
    content:"";position:absolute;width:185px;height:185px;
    right:-100px;top:-108px;border-radius:50%;
    border:27px solid rgba(255,255,255,.07);
}
.breadcrumb{display:flex;align-items:center;gap:5px;margin-bottom:5px;color:rgba(255,255,255,.76);font-size:8px}
.page-banner h1{margin:0;font-size:20px;line-height:1.4}
.page-banner p{margin:4px 0 0;color:rgba(255,255,255,.82);font-size:10px;line-height:1.55}

.section-heading{
    padding:18px 15px 11px;
    background:linear-gradient(180deg,#d9eee2,#cfe8da);
    border-bottom:1px solid #bed8c8;
}
.eyebrow{color:#a77e20;font-size:8px;font-weight:800;letter-spacing:1.5px}
.section-heading h2{margin:4px 0 3px;color:#214d30;font-size:19px;line-height:1.4}
.section-heading p{margin:0;color:#607268;font-size:10px;line-height:1.6}

.crop-grid{
    display:grid;grid-template-columns:repeat(3,1fr);
    gap:15px 8px;padding:12px 9px 30px;
    background:
      radial-gradient(circle at 0 15%,rgba(255,255,255,.25),transparent 18%),
      linear-gradient(180deg,#d0e9dc,#c4e1d2);
}
.crop-card{
    min-width:0;padding:9px 4px 11px;text-align:center;text-decoration:none;color:#35483c;
    background:rgba(255,255,255,.98);
    border:1px solid #b9d6c6;border-radius:12px;
    box-shadow:0 6px 14px rgba(28,78,49,.12);
}
.crop-card:active{transform:scale(.96)}
.crop-image{
    width:74px;height:74px;margin:0 auto 8px;overflow:hidden;
    border-radius:9px;border:1px solid #6d7c72;background:#edf5ef;
    box-shadow:0 3px 8px rgba(30,70,45,.12);
}
.crop-image img{display:block;width:100%;height:100%;object-fit:cover}
.crop-placeholder{
    width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
    background:linear-gradient(145deg,#e5f3e9,#c5e0cd);color:var(--green);
}
.crop-placeholder span{font-size:24px;font-weight:800}
.crop-placeholder i{margin-top:-3px;font-style:normal;font-size:11px}
.crop-name{min-height:19px;color:#33463a;font-size:10.5px;line-height:1.45;font-weight:700}
.crop-subtitle{margin-top:2px;color:#89958d;font-size:8px;line-height:1.35}

/* Article */
.article-page{
    padding:18px 15px 30px;
    background:linear-gradient(180deg,#d3ebdf 0%,#c5e2d3 100%);
}
.article-cover{
    display:block;width:100%;max-height:225px;object-fit:cover;margin-bottom:16px;
    border-radius:12px;border:1px solid #b9d5c4;box-shadow:0 6px 16px rgba(27,75,46,.12);
}
.article-label{color:#a37c1f;font-size:8px;font-weight:800;letter-spacing:1.5px}
.article-page h1{margin:5px 0 8px;color:#1c4b2b;font-size:23px;line-height:1.45;font-weight:800}
.article-divider{width:42px;height:3px;margin-bottom:17px;border-radius:4px;background:#c89b35}
.article-content{
    padding:18px;color:#4d5b52;background:#fff;border:1px solid #bfd9ca;border-radius:12px;
    box-shadow:0 6px 16px rgba(27,75,46,.10);font-size:13px;line-height:1.9;
}
.article-content h2{margin:0 0 9px;color:#236039;font-size:18px;line-height:1.5}
.article-content h3{margin:21px 0 7px;color:#2b633c;font-size:15px;line-height:1.5}
.article-content p{margin:0 0 14px}
.article-content ul,.article-content ol{margin:8px 0 17px;padding-left:22px}
.article-content li{margin-bottom:6px}
.article-content img{max-width:100%;height:auto;border-radius:9px}
.back-button{
    display:block;margin-top:23px;padding:12px 14px;color:var(--green);background:#f3faf6;
    border:1px solid #bcd9c8;border-radius:9px;text-align:center;text-decoration:none;font-size:11px;font-weight:700;
}

/* Footer and nav */
.app-footer{padding:19px 12px 14px;color:#718078;background:#d8ede1;border-top:1px solid #bcd8c8;text-align:center;font-size:9px}
.footer-line{width:42px;height:2px;margin:0 auto 8px;border-radius:3px;background:#c89b35}
.footer-leaf{margin-bottom:3px;font-size:16px}
.bottom-nav{
    position:fixed;left:50%;bottom:0;transform:translateX(-50%);
    width:100%;max-width:480px;height:65px;display:grid;grid-template-columns:repeat(4,1fr);
    background:rgba(255,255,255,.985);border-top:1px solid #bfd8ca;
    box-shadow:0 -6px 18px rgba(27,69,44,.10);z-index:100;
}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#7d8b82;text-decoration:none;font-size:8px;font-weight:600}
.bottom-nav a .nav-icon{font-size:18px;line-height:20px}
.bottom-nav a.active{color:var(--green);font-weight:800}
.bottom-nav a.active .nav-icon{transform:scale(1.08)}

/* Google Translate compact control */
.google-language-box{display:flex;align-items:center;gap:5px}
.google-language-btn{border:0;background:transparent;padding:1px 2px;color:#5c6c63;font-family:inherit;font-size:8px;cursor:pointer;font-weight:500}
.google-language-btn.active{color:#17633a;font-weight:800}
.google-language-separator{color:#a2aaa5;font-size:8px}
#google_translate_element{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;left:-9999px!important;top:-9999px!important}
.goog-te-banner-frame,.goog-te-balloon-frame,body>.skiptranslate{display:none!important}
body{top:0!important}
.goog-text-highlight{background:transparent!important;box-shadow:none!important}

@media(max-width:360px){
    .gov-brand strong{font-size:12px}
    .gov-brand small{font-size:7.5px}
    .crop-grid{gap:12px 6px;padding-left:7px;padding-right:7px}
    .crop-card{padding-left:3px;padding-right:3px}
    .crop-image{width:66px;height:66px}
    .crop-name{font-size:9.5px}
    .welcome-main{padding-left:13px;padding-right:13px}
    .gov-welcome-card{padding-left:15px;padding-right:15px}
    .welcome-main h1{font-size:23px}
}

@media(min-width:700px){
    body{padding:20px 0}
    .phone-app{min-height:calc(100vh - 40px);border-radius:20px}
    .bottom-nav{bottom:20px;border-radius:0 0 20px 20px}
}