/* gabs.report -- Botanical field report with hex grid */
/* Palette: #FAF3E8, #3A2E1F, #C2703E, #E8B84B, #D4915E, #F0D5C0, #B8CFC4, #D4DCCC, #A0522D */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}

body{
    background:#FAF3E8;
    color:#3A2E1F;
    font-family:'Lora',serif;
    font-weight:400;
    line-height:1.72;
    overflow-x:hidden;
}

.section{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:4rem 2rem;
    position:relative;
}

/* Hero */
.hero-section{
    flex-direction:column;
    background:linear-gradient(180deg,#FAF3E8,#F0D5C0 80%);
}

.hex-cluster{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:0.5rem;
    margin-bottom:2rem;
}

.hex{
    width:clamp(80px,12vw,140px);
    height:clamp(92px,14vw,162px);
    clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}

.hex-inner{
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:#FAF3E8;
}

.hex-center{
    width:clamp(200px,30vw,340px);
    height:clamp(230px,34vw,390px);
}

.hex-accent{opacity:0.6}
.hex-terracotta{background:#C2703E}
.hex-sage{background:#B8CFC4}
.hex-amber{background:#E8B84B}
.hex-blush{background:#F0D5C0}
.hex-loam{background:#3A2E1F}

.hero-title{
    font-family:'Playfair Display',serif;
    font-weight:700;
    font-size:clamp(2rem,5vw,4rem);
    color:#3A2E1F;
    text-align:center;
}

.dot{color:#C2703E}

.hero-sub{
    font-family:'Lora',serif;
    font-style:italic;
    font-size:clamp(0.9rem,1.5vw,1.2rem);
    color:#A0522D;
    margin-top:0.5rem;
    text-align:center;
}

.hero-date{
    font-family:'Inter',sans-serif;
    font-weight:400;
    font-size:0.75rem;
    letter-spacing:0.15em;
    color:#A0522D;
    text-transform:uppercase;
}

/* Findings */
.finding{background:#FAF3E8}
.finding-alt{background:#F0D5C0}

.finding-content{
    max-width:56rem;
    width:100%;
}

.finding-label{
    font-family:'Inter',sans-serif;
    font-weight:500;
    font-size:0.7rem;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:#C2703E;
    display:block;
    margin-bottom:0.5rem;
}

.finding-heading{
    font-family:'Playfair Display',serif;
    font-weight:600;
    font-size:clamp(1.8rem,4vw,3rem);
    color:#3A2E1F;
    margin-bottom:2rem;
    line-height:1.15;
}

.finding-grid{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:3rem;
    align-items:center;
}

.body-text{
    font-size:clamp(0.95rem,1.2vw,1.1rem);
    line-height:1.8;
    margin-bottom:1rem;
    color:#3A2E1F;
}

.center-text{text-align:center;max-width:42rem;margin:2rem auto 0}

.botanical-svg{
    width:100%;
    max-width:200px;
    height:auto;
}

/* Hex data grid */
.hex-data-grid{
    display:flex;
    justify-content:center;
    gap:1.5rem;
    margin-bottom:2rem;
    flex-wrap:wrap;
}

.hex-tile{
    width:clamp(100px,15vw,160px);
    height:clamp(115px,17vw,184px);
    clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
    background:#3A2E1F;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:1rem;
}

.tile-value{
    font-family:'Playfair Display',serif;
    font-weight:700;
    font-size:clamp(1.2rem,2.5vw,2rem);
    color:#E8B84B;
    display:block;
}

.tile-label{
    font-family:'Inter',sans-serif;
    font-weight:300;
    font-size:0.6rem;
    letter-spacing:0.1em;
    color:#D4DCCC;
    text-transform:uppercase;
    margin-top:0.25rem;
}

/* Specimen card */
.specimen-card{
    max-width:32rem;
    margin:2rem auto;
    position:relative;
    padding:3rem 2.5rem;
    background:#FAF3E8;
    border:1px solid #D4915E;
}

.specimen-border{
    position:absolute;
    top:6px;left:6px;right:6px;bottom:6px;
    border:1px solid #E8B84B;
    pointer-events:none;
}

.specimen-inner{text-align:center}

.specimen-hangul{
    font-family:'Playfair Display',serif;
    font-size:clamp(4rem,8vw,7rem);
    font-weight:700;
    color:#C2703E;
    display:block;
    line-height:1;
}

.specimen-latin{
    font-family:'Inter',sans-serif;
    font-weight:300;
    font-size:1rem;
    letter-spacing:0.15em;
    color:#A0522D;
    display:block;
    margin:0.5rem 0 1rem;
}

.specimen-def{
    font-family:'Lora',serif;
    font-style:italic;
    font-size:0.95rem;
    color:#3A2E1F;
    line-height:1.7;
}

/* Conclusion */
.conclusion{
    background:#3A2E1F;
    text-align:center;
}

.conclusion-heading{
    font-family:'Playfair Display',serif;
    font-weight:600;
    font-size:clamp(1.5rem,3vw,2.5rem);
    color:#E8B84B;
    margin-bottom:1rem;
}

.conclusion-text{
    font-family:'Lora',serif;
    font-style:italic;
    font-size:1rem;
    color:#D4DCCC;
    margin-bottom:2rem;
}

.conclusion-domain{
    font-family:'Playfair Display',serif;
    font-weight:700;
    font-size:clamp(1.2rem,2.5vw,2rem);
    color:#C2703E;
}

/* Reveal */
.reveal{
    opacity:0;
    transform:translateY(25px);
    transition:opacity 0.7s ease-out,transform 0.7s ease-out;
}

.reveal.visible{opacity:1;transform:translateY(0)}

.reveal-tile{
    opacity:0;
    transform:scale(0.9);
    transition:opacity 0.5s ease-out,transform 0.5s ease-out;
}

.reveal-tile.visible{opacity:1;transform:scale(1)}
.reveal-tile:nth-child(2){transition-delay:0.15s}
.reveal-tile:nth-child(3){transition-delay:0.3s}

/* Responsive */
@media(max-width:768px){
    .finding-grid{grid-template-columns:1fr}
    .hex-cluster{gap:0.25rem}
    .hex{width:60px;height:69px}
    .hex-center{width:160px;height:184px}
}
