import { Container } from "@/components/container";
import { Heading } from "@/components/heading";
import { Subheading } from "@/components/subheading";

export function About() {
  return (
    <section className="py-24 bg-white">
      <Container>
        <div className="grid grid-cols-1 md:grid-cols-2 gap-16 items-center">
          <div>
            <Heading className="text-3xl mb-6">Our Story</Heading>
            <p className="text-neutral-600 leading-relaxed mb-6">
              INDWES was born in Greater Noida — a city where modern lifestyles grow alongside deep Indian roots. 
              Growing up between tradition and contemporary living, we noticed something missing in fashion. 
              Clothing was either deeply traditional or entirely Western. There was very little balance.
            </p>
            <p className="text-neutral-600 leading-relaxed">
              INDWES was created to fill that space. We design for individuals who don’t want to choose between cultures — 
              those who carry Indian soul with Western ease, and express it quietly through what they wear.
            </p>
          </div>
          <div className="bg-[#F3F0E9] p-12">
            <Heading className="text-3xl mb-6">Our Philosophy</Heading>
            <p className="text-neutral-600 leading-relaxed mb-6 italic">
              "We believe true luxury is subtle. It is felt in the fabric, seen in the fit, and remembered in the way it makes you feel."
            </p>
            <ul className="space-y-4 text-neutral-700">
              <li className="flex items-center gap-3">
                <span className="w-1.5 h-1.5 bg-neutral-400 rounded-full" />
                Thoughtfully designed
              </li>
              <li className="flex items-center gap-3">
                <span className="w-1.5 h-1.5 bg-neutral-400 rounded-full" />
                Made using premium fabrics
              </li>
              <li className="flex items-center gap-3">
                <span className="w-1.5 h-1.5 bg-neutral-400 rounded-full" />
                Produced in limited quantities
              </li>
            </ul>
          </div>
        </div>
      </Container>
    </section>
  );
}